Wszystko o e-Commerce w jednym miejscu

Edycja szablonu w CSS dla zaawansowanych

Kompleksowe rozwiązanie z platformą sprzedażową i obsługą klienta
Bartłomiej Jaskółka
Posty: 1
Rejestracja: wtorek 23 kwie 2019, 11:33

Edycja szablonu w CSS dla zaawansowanych

Postautor: Bartłomiej Jaskółka » wtorek 23 kwie 2019, 11:57

Słowem wstępu

Nasz sklep internetowy składa się elementów takich jak:
    Nagłówki
    Menu
    Akapity
    Teksty pogrubione, pochylone, podkreślone
    Rodzaje czcionek, kolorów i rozmiarów
    Tło strony
    Obrazki
    Tabele
    Linki
    Stopki
Do poznania nazw .klas i #id tych elementów użyję narzędzia zwanego Firebug, które od jakiegos czasu jest zintegrowanym narzędziem w popularnych przeglądarkach np. Mozilla Firefox.

Dopisując w tym narzędziu fragmenty kodu HTML i CSS widzisz na bieżąco, jak zmienia się wygląd i układ strony internetowej. Nie tracisz więc czasu na domysły tylko na bieżąco sprawdzasz, co możesz poprawić. Nauka obsługi tego narzędzia zajmie Ci mniej niż 2 minuty. Dobrą alternatywą dla Firebuga jest przeglądarka Google Chrome.


Firebug w Google Chrome

Aktualnie wykorzystuję przeglądarkę Google Chrome do badania elementów HTML i stylów CSS.

W tym momencie należy:

1. Uruchomić front sklepu pod Chrome (w przykładzie https://bartek.ec-at.com).
2. Najechać na wybrany element strony, kliknąć prawym przyciskiem myszy i wybrać: Zbadaj element (skrót klawiszowy Ctrl+Shift+i), (w przykładzie badamy nagłówek "Popularne produkty").
3. W tym momencie nastąpi uruchomienie takiego Firebug'a w Chromie i możesz zbadać elementy HTML i CSS powstającego szablonu. W lewej (lub górnej jak na przykładzie) kolumnie znajduje się struktura dokumentu w HTML, a w prawej kolumnie (lub dolnej jak na przykładzie) style CSS, które zostały wykorzystane do kodowania szablonu.

Obrazek

CDN

Adrian Tomczykowski
Posty: 2
Rejestracja: poniedziałek 01 kwie 2019, 22:08

Re: Edycja szablonu w CSS dla zaawansowanych

Postautor: Adrian Tomczykowski » piątek 10 maja 2019, 10:46

Tytuł postu wprowadza w błąd.

Każdy zaawansowany, jak nawet i średnio zaawansowany programista zna opcję "Zbadaj element"

Nie mamy dostępu do FTP, tak więc i funkcja "Zbadaj element" jest nam zbędna.

No chyba, że w przyszłości dostaniemy dostęp do FTP, ale to dla początkujących powinny być porady, gdyż zaawansowani jak samo słowo wskazuje poradzą sobie ze zmianą wyglądu.


Wróć do „e-Commerce Automation”

Kto jest online

Użytkownicy przeglądający to forum: Obecnie na forum nie ma żadnego zarejestrowanego użytkownika

cron