Gość MotyF Opublikowano 22 Marca 2012 Udostępnij Opublikowano 22 Marca 2012 Co zrobić, aby pasek z ikonkami (góra) był nieruchomy a dodatkowo zawierał mini foto przy nazwie? 1. W panelu administracyjnym dodajemy w naszym skinie w global_template wpis o treści <!-- mobileo - mini foto--><img src='{$this->memberData['pp_small_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" class='ipsUserPhoto ipsUserPhoto_mini_header' /> <!-- konic mini foto--> Dodajemy go w tym miejscu <li><a id='user_link' href="{parse url="showuser={$this->memberData['member_id']}" seotitle="{$this->memberData['members_seo_name']}" template="showuser" base="public"}" title='{$this->lang->words['your_profile']}'>[b]<!-- Mobileo - dodaje mini foto--><img src='{$this->memberData['pp_small_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" class='ipsUserPhoto ipsUserPhoto_mini_header' /> <!-- konic mini foto-->[/b]{$this->memberData['members_display_name']} <span id='user_link_dd'></span></a></li> Ten zabieg spowoduje, że obok nazwy pojawi się foto i będzie ono jednocześnie linkiem do rozwijanej karty profilu. Ale to zdjęcie jest duże. Jak widać w powyższym wpisie zdjęcie dostało klasę ipsUserPhoto_mini_header. Więc w głównym pliku CSS czyli ipb_style dodajemy wpis .ipsUserPhoto_mini_header { width: 25px; height: 25px; } najlepiej dodać do już istniejących wpisów klas zdjęć co wygląda wtedy tak .ipsUserPhoto_variable { max-width: 155px; } .ipsUserPhoto_large { max-width: 90px; max-height: 90px; } .ipsUserPhoto_medium { width: 50px; height: 50px; } .ipsUserPhoto_mini { width: 30px; height: 30px; } .ipsUserPhoto_mini_header { width: 25px; height: 25px; } .ipsUserPhoto_tiny { width: 20px; height: 20px; } .ipsUserPhoto_icon { width: 16px; height: 16px; } teraz zdjęcie jest małe i ładne. Nieruchomy pasek. Musimy ustalić mu atrybut position: fixed; Dokładnie w tym samym pliku stylu, co powyżej. Jest on zawsze wczytywany, więc każda aplikacja odziedziczy nowe ustawienia. Szukamy w pliku ipb_styles #header_bar W oryginale wygląda on tak: #header_bar { background: #323232 url(http://www.symbianforum.pl/public/style_images/master/user_navigation.png ) repeat-x bottom; padding: 0; text-align: right; } Dodajemy mu 3 ostatnie linijki i wygląda tak: #header_bar { background: #323232 url(http://www.symbianforum.pl/public/style_images/master/user_navigation.png ) repeat-x bottom; padding: 0; text-align: right; position:fixed; width: 100%; z-index: 9999; } position-fixed czyli zawsze na górze, szerokość 100% i z-index 9999 (teoretycznie 999 jest najwyższą wartością ale ...), a więc zawsze na górze (klasyfikacja warstw). Teraz jeszcze jeden wpis do #branding czyli niższego paska z logo. Musimy go obniżyć o wartość wysokości nieruchomego paska. W tym samym pliku stylów szukamy #branding i z #branding { background: #0f3854 url(http://www.symbianforum.pl/public/style_images/master/branding_bg.png) repeat-x bottom left; border-bottom: 1px solid #1b3759; min-height: 64px; } robimy #branding { background: #0f3854 url(http://www.symbianforum.pl/public/style_images/master/branding_bg.png) repeat-x bottom left; border-bottom: 1px solid #1b3759; min-height: 64px; padding-top: 36px; } Gotowe. Jeżeli nie widać zmian - CRTL+F5 lub przebudowa skina. Tekst z bloga: www.symbianforum.pl/blog/1/entry-19-jak-zrobic-nieruchomy-pasek-ala-facebook-w-ipb/ Powyższy tekst jest chroniony prawem autorskim. Można rozpowszechniać pod warunkiem podania źródła. 2012 © MotyF - Mobileo Odnośnik do komentarza Udostępnij na innych stronach Więcej opcji udostępniania...
Booski Opublikowano 22 Marca 2012 Udostępnij Opublikowano 22 Marca 2012 a jakiś ss by się przydał Odnośnik do komentarza Udostępnij na innych stronach Więcej opcji udostępniania...
Amfidiusz Opublikowano 22 Marca 2012 Udostępnij Opublikowano 22 Marca 2012 Po co screenshot, skoro masz demo? Ustawienia IP.Board po polsku! Odnośnik do komentarza Udostępnij na innych stronach Więcej opcji udostępniania...
Gość MotyF Opublikowano 22 Marca 2012 Udostępnij Opublikowano 22 Marca 2012 Jak chce - proszę. Odnośnik do komentarza Udostępnij na innych stronach Więcej opcji udostępniania...
dudeka Opublikowano 22 Marca 2012 Udostępnij Opublikowano 22 Marca 2012 Poradnik świetny, dałoby radę zrobić tak z menu ? ;> Od razu coś napiszę, zauważyłem że rejestrując się na Twoim forum poprzez FaceBook'a nie da się ustawić własnego nicku, tutaj masz rozwiązanie : 1 Odnośnik do komentarza Udostępnij na innych stronach Więcej opcji udostępniania...
Gość MotyF Opublikowano 22 Marca 2012 Udostępnij Opublikowano 22 Marca 2012 (edytowane) Menu można dodać do paska, i za pomocą prostego JS inkludowanego w stylu pokazać co się chce na zasadzie <li>. Nie wiem czy o to Ci chodziło ? Sory za kolor - nie miałem nic pod ręką Edytowane 22 Marca 2012 przez MotyF Odnośnik do komentarza Udostępnij na innych stronach Więcej opcji udostępniania...
Rekomendowane odpowiedzi
Jeśli chcesz dodać odpowiedź, zaloguj się lub zarejestruj nowe konto
Jedynie zarejestrowani użytkownicy mogą komentować zawartość tej strony.
Zarejestruj nowe konto
Załóż nowe konto. To bardzo proste!
Zarejestruj sięZaloguj się
Posiadasz już konto? Zaloguj się poniżej.
Zaloguj się