Oryginalny szablon JA Purity został wydany przez JoomlArt.com jako archiwum w formacie ZIP oraz został umieszczony w pakiecie instalacyjnym Joomla!. Odnoszący się do logo plik szablonu, który poddamy modyfikacji, template.css znajduje się w poniższym katalogu:
templates/ja_purity
css/
template.css
Jeśli korzystasz z samouczka i szablonu ćwiczebnego, plik ten 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;
- display: block;
- background: url(../images/logo.png) no-repeat;
- height: 80px;
- position: absolute; <---- POPRAW TUTAJ
- top: 10px; <---- DODAJ TEN WIERSZ
- left: 10px; <---- DODAJ TEN WIERSZ
- z-index: 100;
- }
- W dodanych wierszach umieszczasz obrazek logo zgodnie ze swoimi preferencjami.
- Następnie popraw pozycje tekstów towarzyszących logo...
- W pobliżu wiersza 970 znajdziesz:
-
- h1.logo-text a {
- color: #CCCCCC !important;
- text-decoration: none;
- outline: none;
- position: absolute;
- bottom: 40px; <---- POPRAW TUTAJ
- left: 5px; <---- POPRAW TUTAJ
- }
-
- p.site-slogan {
- margin: 0;
- padding: 0;
- padding: 2px 5px;
- color: #FFFFFF;
- background: #444444;
- font-size: 92%;
- position: absolute;
- bottom: 20px; <---- POPRAW TUTAJ
- left: 0; <---- POPRAW TUTAJ
- }
- Popraw te wiersze, aby umieścić logo w preferowanym miejscu.
- Naciśnij w przyborniku ikonę Zapisz, aby zakończyć i zachować zmiany.