Jak zmienić wygląd strony WordPress nie znając CSS?

Jak zmienić wygląd strony WordPress nie znając CSS?
Wtyczka do edycji stylów CSS – Yellow Pencil
Co to jest explainer video? Kiedy warto zastosować tę formę video?

Jak zmienić wygląd strony WordPress nie znając CSS?

Jeśli chcesz zmienić styl strony internetowej WordPress, ale nie znasz języka CSS, to nie musisz się martwić. Istnieje rozwiązanie dzięki któremu szybko i łatwo zmodyfikujesz wygląd elementów oraz układ swojej strony. Nie mówię tu o edytorze “darg&drop”, który oczywiście pozwala na wprowadzenie zmian bez znajomości kodowania. 

Wtyczka do edycji stylów CSS - Yellow Pencil

Jeśli chcesz zmienić wygląd strony WordPress bez instalowania edytora typu “drag&drop”, możesz skorzystać z narzędzia do edycji stylów w postaci wtyczki.  Wtyczka Yellow Pencil od WaspThemes, umożliwia edycję stylów za pomocą prostego interfejsu graficznego. W ten sposób możesz zmieniać kolory, rozmiary i położenie elementów bez znajomości języka CSS.

Jak korzystać z wtyczki Yellow Pencil?

Aby skorzystać z wtyczki Yellow Pencil, należy ją najpierw zainstalować i aktywować na swojej stronie. W tym celu wystarczy wykonać kilka prostych kroków opisanych poniżej:

  1. Przejdź do panelu WordPress i wybierz z menu „Wtyczki” >> „Dodaj nową„.
  2. W polu wyszukiwania wpisz nazwę wtyczki, którą chcesz zainstalować, np. „Yellow Pencil„.
  3. Z listy wyników wyszukiwania wybierz wtyczkę, której szukasz, i kliknij przycisk „Zainstaluj„.
  4. Po zakończeniu instalacji kliknij przycisk „Aktywuj„, aby aktywować wtyczkę.

Po aktywacji wtyczka będzie dostępna w menu „Wtyczki” i możesz z niej korzystać według instrukcji dostarczonej przez jej twórców. Po zainstalowaniu i aktywacji wtyczki do edycji stylów CSS, można z niej korzystać. W tym celu należy:

  1. Otworzyć stronę, którą chcesz edytować, i kliknąć przycisk „Yellow Pencil” w pasku narzędzi, który znajduje się na samej górze strony.
  2. Strona otworzy się przez edytor Yellow Pencil i od tej pory można wprowadzać modyfikacje na stronie
  3. Zaznacz element strony, który chcesz edytować, np. nagłówek lub paragraf klikając na nim lewym przyciskiem myszy.
  4. W oknie edytora Yellow Pencil możesz edytować style elementu, takie jak kolor tekstu, tło, krawędzie i inne. Możesz również dodać efekty, takie jak animacje i przejścia.
  5. Po dokonaniu zmian kliknij przycisk „Zapisz” lub „Zapisz i zamknij”, aby zapisać zmiany.
  6. W przypadku darmowej wersji wtyczki Yellow Pencil nie ma możliwości zapisywania zmian z poziomu wtyczki. Wtedy należy podejrzeć i skopiować kod CSS wygenerowany przez wtyczkę. Kod znajdziemy po lewej stronie ekranu na pasku z dodatkowymi narzędziami wtyczki Yellow Pencil. Wystarczy kliknąć ikonę </>, aby wyskoczył nam ekran z widocznym kodem do skopiowania.
  7. Kopiujemy wygenerowany kod CSS, a następnie zamykamy edytor Yellow Pencil.
  8. Przechodzimy do standardowego widoku naszej strony, a następnie na górnym pasku WordPress klikamy opcję “Dostosuj” (możemy również przejść do sekcji “Dostosuj” w następujących krokach: Kokpit >>Wygląd >>Dostosuj).
  9. Wybieramy opcję “Dodatkowy CSS” i wklejamy nasz kod CSS, który wygenerowała nam wtyczka Yellow Pencil, a następnie klikamy przycisk “Opublikuj
  10. Po wprowadzeniu wszystkich zmian, możemy wyłączyć i zainstalować wtyczkę. 

Zmiany wyglądu powinny być już widoczne. Pamiętaj, że zmiany w stylach strony internetowej mogą mieć wpływ na działanie, dlatego ważne jest, aby zachować ostrożność podczas dokonywania jakichkolwiek zmian. Proces wprowadzania zmian przy pomocy Yellow Pencil pokazujemy w poniższym video. Jest to prosty i szybki zabieg, z którego często korzystają nawet programiści, znający język CSS.

Social media & sharing icons powered by UltimatelySocial