Jak zrobić motyw podrzędny
Motyw potomny jest używany, gdy planujesz zmienić lub dodać do niego nowe funkcje.
Awatar Eduarda Ungureanu
Wpisany przez Eduard Ungureanu
Zaktualizowano ponad tydzień temu
Uwaga: jeśli używasz tylko dostosowań CSS, posiadanie motywu potomnego nie jest wymagane i możesz umieścić swój niestandardowy kod css w Divi> Opcje motywu> Karta Ogólne> Niestandardowy CSS. Jeśli planujesz zmodyfikować pliki szablonów kompozycji (style.css lub header.php), musisz utworzyć motyw podrzędny, aby zachować te zmiany podczas aktualizacji. Możesz również znaleźć świetny szczegółowy przewodnik z naszego bloga tutaj.
Istnieją dwa sposoby utworzenia motywu podrzędnego:
Korzystanie z wtyczki innej firmy
Kodowanie od zera
Korzystanie z wtyczki innej firmy – dla początkujących
Istnieje wiele wtyczek innych firm w repozytoriach wtyczek WordPress, z których można korzystać. Oto 3 najlepsze opcje:
Generator motywów potomnych: https://wordpress.org/plugins/child-theme-generator/ – Ta wtyczka wygeneruje motyw potomny w kilku krokach, szybko i bezpiecznie, nie spowolni twojej witryny ani nie spamuje bazy danych.
Kreator motywów podrzędnych autorstwa Orbisius: https://wordpress.org/plugins/orbisius-child-theme-creator/ – Ta wtyczka umożliwia szybką edycję plików motywów z wyglądu> Edytor motywów Orbisius (wpis dodany przez tę samą wtyczkę)
Posiada dwa edytory i możesz wybierać fragmenty z jednego motywu i wklejać do drugiego.
Konfigurator motywu potomnego: https://wordpress.org/plugins/child-theme-configurator/ – Konfigurator motywu potomnego to szybkie i łatwe w użyciu narzędzie, które pozwala analizować dowolny motyw pod kątem typowych problemów, tworzyć motyw potomny i dostosowywać go poza opcjami dostosowywania.
Oprócz tych trzech najczęściej używanych wtyczek innych firm do tworzenia motywu podrzędnego istnieje wiele innych, z których można korzystać. Aby uzyskać więcej informacji, przejrzyj tę stronę: https://wordpress.org/plugins/search/child+theme/
Kodowanie motywu potomnego od zera – średnio zaawansowany
Kodowanie motywu potomnego od podstaw jest w rzeczywistości łatwiejsze niż się wydaje. Wszystko, czego potrzebujemy, to edytor kodu, taki jak Sublime Text lub VS, lub dowolny inny edytor kodu będzie działał.
Na komputerze lokalnym utwórz nowy folder. Zwykle nazwa folderu to Divichildtheme lub motyw podrzędny Divi. Nazwa folderu może być dowolna.
W folderze utwórz pierwszy potrzebny plik, który będzie plikiem .css o nazwie style.css.
W style.css umieść ten kod:
/ *
Nazwa motywu: Divi Child Theme
Motyw URI: http://twojastrona.com
Opis: Motyw podrzędny dla Divi
Autor: Twoje imię
Identyfikator URI autora: http://twojastrona.com
Szablon: Divi
* /
Nazwa motywu: jest to nazwa motywu podrzędnego, może być dowolna, zwykle używam motywu podrzędnego Divi
URI motywu: reprezentuje stronę internetową autora, był adresem URL strony, na której ludzie mogą dowiedzieć się więcej o tworzonym przez nas motywie potomnym
Opis: krótki opis motywu podrzędnego, możesz dołączyć takie elementy, jak: zastosowany schemat kolorów, dodane funkcje itp
Autor: zazwyczaj jest to twoje imię i nazwisko, osoba, która utworzyła motyw potomny
Identyfikator URI autora: Może to być witryna Twojej firmy lub może to być rzeczywisty adres URL witryny, na której jest używany motyw podrzędny
Szablon: Jest to folder nazwy motywu nadrzędnego. Uwaga: ta nazwa powinna być dokładnie taka sama jak nazwa folderu motywu nadrzędnego, jeśli zmieniłeś domyślny folder Divi na inną nazwę, to powinno to znaleźć odzwierciedlenie w opcji Szablon.
2. Drugi plik, który będziemy potrzebować, nazywa się functions.php i będzie zawierał ten kod PHP:
<? php
/ * ================================================
# 1 Załaduj style nadrzędne
================================================ * /
funkcja dc_enqueue_styles () {
wp_enqueue_style (‘divi-parent’, get_template_directory_uri (). ‘/style.css’);
}
add Activity (‘wp_enqueue_scripts’, ‘dc_enqueue_styles’);
To wszystko, w tym momencie będziesz mieć motyw potomny dla Divi.
Uwaga: ten sam proces można zastosować do utworzenia motywu podrzędnego dla Extra, jedyną różnicą jest to, że w pliku style.css szablon: Divi zostanie zastąpiony szablonem: Dodatkowy.