--=REKLAMA=--
--=REKLAMA=--
Logo Joomla! jest umieszczone w lewej górnej części szablonu.
Logo nazywane jest przez wielu projektantów witryn internetowych nagłówkiem, a w j. angielskim - header. To nagłówek witryny. Zwykle zawiera logo organizacji lub przedsiębiorstwa, które wydaje witrynę. Obraz zastosowany w szablonie rhuk-milkyway jest w formacie PNG. O wyborze tego formatu zdecydowała możliwość zastosowania przezroczystości.
Gdyby kolor tła nagłówka pod obrazkiem został zmieniony, zmiana widoczna będzie we wszystkich tych obszarach logo, które nie są pełnymi kolorami. Osiągnięto to przez ustawienie własności CSS - Z-index. Naprawdę, nie musisz się przejmować, że zastąpienie tego nagłówka wymaga sporo pracy. Nie będzie, jeśli stworzysz logo tych samych rozmiarów (298x75px) i w tym samym formacie.
Zakładam, że zastąpię nagłówek swoim obrazkiem stworzonym w edytorze grafiki. Obraz, jaki stworzyłem, ma te same rozmiary i ten sam format, co oryginalny plik (PNG).
Po stworzeniu nowego obrazka logo i zapisaniu go w formacie przezroczystego PNG, możesz przesłać nowy plik do katalogu katalog_joomla/templates/rhuk_milkyway/images/. Nazwałem swój obrazek: moj-nowy-naglowek.png i umieściłem go w katalogu obrazków. Możesz też zapisać swój obraz pod taką samą nazwą, jak oryginalny. W ten sposób nie musisz zmieniać żądnego kodu. Nowy obraz zastąpi poprzedni. Ale jeśli chcesz wykonać pracę porządnie i zwracasz uwagę na różne szczegóły, np. optymalizację pod kątem wyszukiwarek,konieczna będzie modyfikacja pliku CSS, aby umieścić własną nazwę pliku nagłówka.
Wykonaj te same kroki, co przy zmianie domyślnych ustawień - przejdź do konfiguratora własności szablonu. Kliknij ikonę Edytuj CSS w prawym górnym rogu ekranu.
Na nowej stronie zostanie wyświetlona lista plików CSS. Większość z nich to pliki definiujące reguły koloru. Ten, w którym musimy dokonać zmiany, nazywa się template.css.
Plik, który chcemy modyfikować, nazywany jest głównym plikiem CSS. Tak jest, ponieważ pozostałe pliki CSS są dodatkowymi plikami z regułami modyfikującymi podstawowe. Główny plik CSS jest tym, w którym znajdują się wszystkie niezbędne dla przeglądarki reguły stylizowania. Plik ten nazywa się template.css (w Joomla 1.0 nazywał się template_css.css).
Zaznacz pole opcji przy pliku template.css, a następnie kliknij ikonę Zmień w przyborniku.
Następny ekran, który zobaczysz, to wbudowany edytor CSS. W linii 82 zobaczysz element div z etykietą:
div#logo { position: absolute; left: 0; top: 0; float: left; width: 298px; height: 75px; background: url(../images/mw_joomla_logo.png) 0 0 no-repeat; margin-left: 30px; margin-top: 25px; }
Jak się domyślasz, linię wymagającą zmiany zawiera 7 wiersz:
background: url(../images/mw_joomla_logo.png) 0 0 no-repeat;
Ta linia zawiera nazwę pliku nagłówka mw_joomla_logo.png, który chcemy zastąpić własnym, przesłanym na serwer. Musimy więc zmienić tę nazwę. Zwykle nowy obraz przesyłamy do tego samego katalogu co aktualny
katalog_joomla/templates/rhuk_milkyway/images/
Po zastąpieniu starej ścieżki do pliku nową, która musi wskazywać dokładnie na katalog, w którym plik został umieszczony, nazwę i rozszerzenie pliku, zapisz plik, naciskając ikonę Zapisz w przyborniku.
W tym momencie masz przesłany na serwer plik z nowym obrazkiem logo o tych samych rozmiarach (298x75), zapisany w formacie PNG z przezroczystością, umieszczony w folderze obrazków szablonu Rhuk_milkyway. Plik nosi też inną niż oryginał nazwę, zgodną z nazwą, jaką wpisaliśmy do arkusza stylów. Jeśli wykonasz dokładnie wszystkie powyższe czynności, w miejsce oryginalnego obrazka logo powinno się pokazać logo stworzone przez Ciebie.