Weebly - elementy w układzie strony

Jakoś tak 2 miesiące temu odkryłam darmową platformę weebly i zauroczyłam się nią bez pamięci. Można powiedzieć, że to prawdziwa miłość od pierwszego wejrzenia. [Przeczytaj: Platformy blogowe - którą wybrać?]

Na weebly możemy tworzyć strony, blogi, a także strony połączone z blogami - do wyboru, do koloru. Przepiękne nowoczesne szablony, prostota, łatwość obsługi, bardzo ciekawe elementy strony - i to właśnie tym ostatnim poświęcony będzie dzisiejszy post. 

Jeżeli jesteśmy przyzwyczajeni do gadżetów w układzie bloggera lub widgetów wordpressa, na weebly możemy przeżyć nie lada zaskoczenie. Tym bardziej przeżyją zaskoczenie ci, którzy wcześniej, przed weebly, nie mieli żadnego bloga ani strony.

Do elementów strony dostęp mamy w trybie edycji, co możemy zaobserwować na poniższych screenach:

Weebly - Edytuj witrynę

Weebly - Edytuj witrynę

Weebly - Edytuj

W trybie projektowania mamy dostęp do arkuszy CSS, w trybie stron możemy dodawać wybrane przez siebie podstrony, zaś w trybie ustawień zmieniamy np. tytuł witryny, format daty, opis SEO - to tak na marginesie. :)

A więc przechodząc już do sedna: elementy w trybie edycji podzielone zostały na 5 zasadniczych grup:
  • Główne moduły
  • Architektura
  • Media
  • Commerce
  • Więcej
Jak nietrudno się domyślić, elementy oznaczone gwiazdką są płatne, więc nas w tym momencie nie interesują. 

Do głównych modułów zalicza się: nagłówek, tekst, zdjęcie, galeria, slider, mapa, formularz kontaktowy i kod osadzania. Na szczególną uwagę zasługuje ten ostatni, gdyż pełni funkcję podobną do gadżetu HTML/JavaScript na bloggerze. [Przeczytaj: Co może się przydać na blogu?] Innymi słowy, w kodzie osadzania możemy umieścić dowolny kod lub skrypt, np. własny skrypt cookies.

Weebly - elementy posta

Do zdjęć możemy dodawać obramowania, do tekstów - linie punktowane. Możemy określać, w jakiej odległości od siebie mają znajdować się elementu.

Z dość interesującymi rozwiązaniami mamy do czynienia w grupie elementów zwanej "Architektura". Mamy tutaj do wyboru: separator, przekładkę i przycisk. Przekładka służy do oddzielania elementów od siebie, robienia między nimi przerwy, jednak nie tylko. Można ją również umieścić z boku elementu i w ten sposób zmodyfikować położenie tegoż elementu.

Weebly - główne moduły

Separator to po prostu linia oddzielająca od siebie elementy, występuje również na niektórych elementach w bloggerze. Warto również wspomnieć, iż w języku CSS oznaczamy separator jako border. W zależności od potrzeb może być border jako całość obramowania, ale także border-top (linia na górze), border-bottom (linia na dole), border-left (z lewej) oraz border-right (z prawej). Odległości od elementu modyfikujemy za pomocą polecania "padding". Przykład: 

#NazwaGadżetu {border-top: 2px solid #ffcc0d; padding: 10px !important; border-bottom: none;}  


Powyższy kod określa, że dany gadżet ma mieć linię ciągłą na górze o grubości 2 px i w kolorze żółtym podchodzącym pod pomarańczowy. Odległość linii od gadżetu ma wynosić 10 px, a na dole linii brak. Fajne są te kody, nie?

Wracając jednak ściśle do elementów strony na weebly, w architekturze został nam jeszcze przycisk (button). Możemy go wykorzystać np. jako odnośnik. Jego wygląd możemy zmieniać w wyżej omówionym trybie projektowania. Jak to zrobić? Wystarczy odnaleźć nazwę (id) HTML danego elementu. [Przeczytaj: Jak odnaleźć nazwę elementu w CSS?]. Po odnalezieniu nazwy wystarczy już tylko pozmieniać wybrane parametry, a następnie cieszyć się efektami naszej pracy.

Weebly - elementy strony

Weebly - elementy strony

Weebly - elementy strony

Dzięki elementowi "youtube" możemy umieszczać filmiki z youtube bezpośrednio na naszej stronie. Musimy jedynie wpisać adres URL wybranego filmu i... gotowe.

W ostatniej grupie elementów znajdują się ikonki social mediów. Mogą się one różnić od siebie w zależności od wybranego przez nas szablonu. Wybieramy ikonki, ustalamy ich kolejność, no i oczywiście dopisujemy do nich własne profile społecznościowe. [Przeczytaj: Gdzie warto promować blog? 4 podstawowe miejsca] Można także powstawiać na stronę własne ikonki za pomocą kodu osadzania z głównych modułów - nic nie stoi ku temu na przeszkodzie. Można nawet mieć i domyślne i własne, jeżeli ktoś sobie tak zażyczy. W końcu po co się ograniczać? Wszystko zależy od inwencji.

Weebly - ikony social

Weebly - elementy witryny

Na weebly mamy również możliwość dołączenia aplikacji do naszej strony. Dodane aplikacje będą widoczne na dole listy i oznaczone jako "osoby trzecie".
2013 © Introwertyczka w sieci. Obsługiwane przez usługę Blogger.