Platforma Selesto jest gotowym rozwiązaniem, ale z możliwością rozszerzenia funkcji jeśli tego potrzebujesz. Taką opcją jest np. skorzystanie z sekcji html, która pozwoli Ci na wprowadzenie kreatywnych rozwiązań oraz opcji przygotowanych specjalnie pod Ciebie. Jednym słowem z gotowca możesz wycisnąć tyle, że Twój sklep będzie wyglądał jak dedykowane rozwiązanie!

Wprowadzenie

Nie musisz być specjalistą, żeby robić drobne modyfikacje w kodzie. Jednak, jeśli potrzebujesz zawansowanych rozwiązań możesz skorzystać z pomocy naszego zespołu. A jeśli masz obszerną wiedzę w tym zakresie to hulaj dusza, bo możesz naprawdę bardzo wiele!

Każdemu dajemy szansę na zapoznanie się z html. Przykładowo na sklepie testowym gotowa sekcja układ jest również wgrana za pomocą kodu. Możesz z niej skorzystać, albo możesz zastąpić gotowym rozwiązaniem.

Podstawowe elementy Html

Chcąc edytować wgrane przykładowo sekcje zwróć uwagę na poszczególne elementy:

Uwaga!

W tej instrukcji nie przeprowadzimy całego szkolenia z zakresu tworzenia html. Jest to jedynie drobna podpowiedź, żebyś mógł zrozumieć co przedstawiają wybrane obszary.

Jest to obszar kodu, w którym zawarte są warunki, co ma się dziać z poszczególnymi elementami. Jednym słowem ta części odpowiada za ostylowanie obiektu np. jaki rozmiar będą miały nagłówki, jaki kolor czcionki będzie wykorzystany do podpisu, jaki wygląd będzie miał przycisk itp.

W kolejnej części kodu znajdują się konkretne treści, które są ostylowane wg. wcześniej ustalonego wzoru oraz wywoływane odpowiednimi znacznikami:

Paragraf, tutaj z reguły wprowadza się tekst określony standardową czcionką.

Największy nagłówek, bardzo pożądany jeśli chodzi o SEO strony.

Nagłówek o mniejszej wadze niż <h1>, standardowo używany dla podtytułów. Również jest istotny dla pozycjonowania strony.

<h3<...</h3>

Nagłówek o mniejszej wadze niż <h2>. Aczkolwiek również bywa istotny dla pozycjonowania strony.

<img..../>

Tym tagiem deklaruje się obrazy.

src="..."

Tym atrybutem określa się adres zawartości elementu. Np. <img src="/upload/other/zdjecie_sukienki.jpg" /> wskazuje, że obraz <img>, który ma zostać wyświetlony znajduje się <src> w tym miejscu. Ważne jest, aby wprowadzając lokalizację pliku nie zapomnieć o cudzysłowie.

Wskazówka!

Zobacz tutaj jak wgrać plik na serwer sklepu i pozyskać jego adres.

Najprościej mówiąc jest to atrybut do tworzenia hiperłączy. Pomiędzy cudzysłów wprowadza się adres zasobu, do którego ma nastąpić przekierowanie. Np. <a href="/c/produkty" oznacza, że po kliknięciu na wskazany obszar otworzy się strona zawierająca kategorię "Produkty".

Wskazówka!

W przypadku linkowania wewnętrznego nie ma potrzeby wprowadzania całego adresu URL, wystarczy fragment j/w. Natomiast dokonując linkowania poza obszar sklepu należy uwzględnić cały adres URL (np. htttps://www. portalspolecznosciowy.pl/najnowsze-trendy).

Więcej nt. budowy linków w sklepie przeczytasz w dedykowanych instrukcjach.

Podsumowanie

Dzięki tym podstawowym informacjom widzisz najważniejsze elementy w kodzie. Teraz możesz samodzielnie wprowadzać drobne zmiany nawet, jeśli jest to Twoje pierwsze spotkanie z html.

Chcesz zadbać o wygląd swojego sklepu internetowego, ale nie wiesz jak się za to zabrać? Zobacz serię artykułów poświęconą tej tematyce: DESIGN i UX sklepu internetowego.

Wskazówka!

Należy pamiętać, aby zawsze dokonywać zapisu wprowadzonych zmian oraz czytać komunikaty i wyskakujące okienka. Nie uzupełnienie pól oznaczonych * blokuje wykonanie następnego kroku. Oraz zawsze po konfiguracji nowych ustawień dobrą praktyką jest sprawdzenie czy działają one poprawnie.

Spis treści

Następny wpis

Konfiguracja sekcji Info na stronie głównej

Poprzedni wpis

Konfiguracja sekcji Układ na stronie głównej

Dodaj komentarz

Odpowiadasz na komentarz

Imię i nazwisko

Komentarz

Dodaj komentarz

Dziękujemy, komentarz zostanie dodany po zaakceptowaniu przez administratora.