1. Početna
  2. WordPress
  3. Kako da kreiram child temu u WordPress-u?

Kako da kreiram child temu u WordPress-u?

Child tema za WordPress može se kreirati ručno ili pomoću plugin-a (dodatka). Da ne biste instalirali dodatne pluginove na Vašem sajtu, preporučujemo Vam da je kreirate ručno.

Pre nego što budete mogli da kreirate child temu, morate imate odabranu osnovnu temu za vaš sajt. Child tema je proširenje i modifikator glavne teme pomoću koje možete promeniti dizajn vašeg sajta bez promene datoteka glavne teme.

1. Novi folder za child temu

Napravite novi folder u direktorijumu tema - /wp-content/themes.

Njegovo ime mora sadržati ime glavne teme plus reč “-child”, na primer “maintheme-child”.

Folder child teme u /wp-content/themes.

Struktura foldera u child temi treba da bude ista kao i kod glavne teme. Na primer, ako glavna tema ima datoteku main-theme/dir/file.php, koju želite da promenite, morate je kopirati u isti direktorijum u child temi, na primer theme-child/dir/file.php.

2. Datoteka style.css

U direktorijumu child teme postavite datoteku style.css. U ovoj datoteci vrše se promene u dizajnu stranice.

Izgled style.css datoteke u child temi.

U ovoj datoteci unesite sledeće:

/*
 Theme Name: My SuperTheme Child
 Theme URI: https://goodexample.eu/mysupertheme-child/
 Description: Child theme for My SuperTheme
 Author: I'm the author.
 Author URI: https://goodexample.eu
 Template: mysupertheme
 Version: 1.0.0
*/

/* ------- Insert custom styles below this line ------- */
Theme Name: My SuperTheme Child - Zadajte ime za child temu.
Template: mysupertheme - Ime direktorijuma osnovne teme.

Ovi redovi u WordPress-u ukazuju da je ovo child tema navedene glavne teme.

Nije potrebno uneti sve navedene redove, ali se moraju dodati sledeća dva:

/*
 Theme Name: My SuperTheme Child
 Template: mysupertheme
*/

Dodajte i red sa verzijom child teme (Version:), kako bi se keširane informacije mogle obnoviti nakon izvršenih promena u temi. Kada unesete promene, u child temu možete zadati sledeću verziju (1.0.1, 1.0.2 …), radi lakše preglednosti izvršenih promena.

3. Datoteka functions.php

Datoteke functions.php sadrže funkcionalnosti postavljene teme, (jedna za glavnu i jedna za child temu).

Kreirajte datoteku functions.php u direktorijumu child teme.

U ovoj datoteci morate registrovati stil za child temu i uključiti učitavanje stila glavne teme.

Izgled functions.php fajla u child temi.

U datoteku functions.php unesite sledeće redove:

<?php 
/* Load theme stylesheets */
add_action( 'wp_enqueue_scripts', 'mysupertheme_styles' );
function mysupertheme_styles() {
 
    $parent_style = 'mysupertheme-style';
    // load parent style
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    // load child style
    wp_enqueue_style( 'mysupertheme-child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
mysupertheme-style - Ime stila osnovne teme
mysupertheme-child-style - Ime stila child teme

Još jedan način koji se ranije koristio za dodavanje stila glavne teme u child temu je dodavanje sledećih redova u datoteku style.css:

/* Import CSS style sheets from Parent Theme */
@import url("../maintheme/style.css");

Ovaj način se više ne preporučuje za dodavanje style.css datoteka u child temu. Umesto toga, koristite wp_enqueue_scripts sa funkcijom wp_enqueue_style() u datoteci functions.php.

Unesite ispravke u uzorak koda

1. Redosled učitavanja stila glavne teme wp_enqueue_style( $parent_style…:

a) Zamenite mysupertheme-style imenom koje se koristi za registraciju stila glavne teme.

Ovo ime možete pronaći u datoteci functions.php u direktorijumu osnovne teme, u redu sa funkcijom “wp_enqueue_style”.

Ime stila glavne teme, u datoteci u direktorijumu glavne teme.

Drugi način da vidite ovo ime je da pretragom koda Vašeg sajta, potražite sledeći red u kome je definisan stil teme:

<link rel='stylesheet' id='mysupertheme-style-css' href='..themes/mysupertheme/style.css…

Uklonite poslednji deo imena “-css”.

Učitani stil aktivne teme.

b) Zamenite /style.css punom putanjom i nazivom datoteke stila glavne teme.

Datoteka style.css mora postojati u direktorijumu glavne teme, ali ne mora biti aktivna.

Na primer, glavna tema je možda navela drugu datoteku iz koje će učitati podešavanja stila. Datoteka stila glavne teme može se videti u datoteci functions.php, u redu za registraciju stila:

wp_enqueue_style( 'mysupertheme-style', get_stylesheet_directory_uri() . '/css/style.css

2. Da bi se uključio stil child teme:

'mysupertheme-child-style', get_stylesheet_directory_uri()…)

zamenite /style.css punom putanjom i datotekom stila child teme.

4. Aktivacija child teme

Child tema se može videti u administraciji Izgled > Teme.Možete je aktivirati kao i bilo koju drugu WordPress temu - Uključi.

Aktivacija child teme.

Možete da postavite sliku za child temu u njen direktorijum pod nazivom screenshot.png. Ova slika će biti vidljiva na administratorskom panelu u Izgled »Teme.

Obnovljen: 12. децембра 2020.

Da li Vam je ovaj članak bio koristan?

Slični članci