Oryginalny szablon JA Purity został wydany przez JoomlArt.com jako archiwum w formacie ZIP oraz został umieszczony w pakiecie instalacyjnym Joomla!. Odnoszące się do logo pliki szablonu, które poddamy modyfikacji, logo.gif (stosowane w przypadku problemów z przezroczystością) oraz logo.png znajdują się w poniższych katalogach:
templates/ja_purity
images/
logo.gif
logo.png
Jeśli korzystasz z samouczka i szablonu ćwiczebnego, pliki te znajdują się w katalogu:
templates/my_japurity
images/
logo.gif
logo.png
- Stwórz nowy obraz o rozmiarach: szerokość - 207 pikseli, wysokość 80px, korzystając z edytora graficznego takiego, jak Gimp.
- Zapisz obraz w obu formatach - PNG oraz Gif w katalogu /images. W ten sposób nadpiszesz (zastąpisz) istniejące pliki logo.gif oraz logo.png.
- Poprawiaj, zapisuj, testuj swoje nowe logo aż uzyskasz satysfakcjonujący Cię efekt.
Jeśli chcesz zmienić rozmiary logo, skorzystaj z samouczka rozmiar obszaru nagłówka oraz popraw odpowiednio arkusz stylów, template.css, znajdujący się w katalogu:
templates/ja_purity
css/
template.css
W przypadku, gdy korzystasz z szablonu ćwiczebnego, arkusz stylów znajduje się w katalogu:
templates/my_japurity
css/
template.css
Plik CSS mozesz zmodyfikować w dowolnym zwykłym edytorze tekstu, takim jak VI czy Notepad albo za pomocą edytora CSS dostępnego na stronie administracyjnej Joomla. Tutaj posłużymy się edytorem wbudowanym w Joomla!.
- Zaloguj się na stronę zaplecza administracyjnego
- Otwórz stronę menedżera szablonów
- Kliknij nazwę swojej wersji szablonu JA Purity albo
- Zaznacz przycisk radiowy obok nazwy i kliknij ikonę Zmień w przyborniku.
- Kliknij w przyborniku ikonę Edytuj CSS
- Zaznacz przycisk radiowy obok template.css
- Kliknij w przyborniku ikonę Edytuj, aby otworzyć w edytorze plik template.css
- W pobliżu wiersza 956 znajdziesz:
-
- h1.logo a {
- width: 208px; <--- POPRAW TUTAJ SZEROKOŚĆ ---<<
- display: block;
- background: url(../images/logo.png) no-repeat;
- height: 80px; <--- POPRAW TUTAJ WYSOKOŚĆ ---<<
- position: relative;
- z-index: 100;
- }
- Zmień odpowiednio wartości określające szerokość i wysokość Twojego logo.
- Naciśnij w przyborniku ikonę Zapisz, aby zakończyć i zachować zmiany.