Kako kreirati WordPress child temu za 15 minuta (Vodič)

Šta je WordPress child tema i zašto ti je potrebna

Child tema (izvedena tema) nasleđuje sve funkcije i celokupan izgled od tvoje glavne, odnosno roditeljske teme. Svaka promena koju napraviš u izvedenoj temi, bilo da su u pitanju vizuelna pravila (CSS) ili sam kod, ostaje potpuno zaštićena čak i kada ažuriraš glavnu temu.

Bez nje, situacija izgleda ovako: ažuriraš popularne teme kao što su Astra, Hello Elementor ili Twenty Twenty-Four, i sve što si ručno menjao u fajlovima gubi se zauvek. Povratka nema.

Kada child tema nije neophodna

Ako koristiš Elementor Pro dodatak za kompletnu izgradnju sajta i nikada ne menjaš fajlove sa kodom niti ručno unosiš pravila za dizajn, child tema ti možda neće biti preko potrebna. Elementor čuva tvoj dizajn u bazi podataka, a ne u fajlovima same teme.

Međutim, čim poželiš da napišeš makar jedan red koda direktno u temu, njeno korišćenje postaje obavezno.

Česta zabluda o izvedenim temama

Mnogi misle da ovakav pristup usporava sajt. To jednostavno nije tačno. Child tema ne opterećuje tvoj sistem, ona se samo oslanja na glavnu temu i učitava isključivo one fajlove koje si ti lično izmenio.

Kako ručno napraviti WordPress child temu

Postoje dva načina da ovo uradiš: ručno, što ti pomaže da bolje razumeš proces, ili pomoću dodatka (plagina), što je brža opcija za početnike. Počećemo od ručnog pristupa jer je to korisno znanje na duže staze.

Korak 1: Pravljenje foldera za child temu

Pristupi svom hostingu preko programa za prenos fajlova (kao što je FileZilla) ili direktno kroz Upravnik fajlova (File Manager) na kontrolnoj tabli tvog hostinga. Otvori sledeću putanju:

/wp-content/themes/

Napravi novu fasciklu (folder). Pravilo za davanje imena je jednostavno: naziv-glavne-teme-child. Evo nekoliko primera:

• astra-child
• hello-elementor-child
• generatepress-child

Korak 2: Pravljenje style.css fajla

U novom folderu napravi fajl pod nazivom style.css i unesi sledeći kod, uz prilagođavanja za tvoj konkretan sajt:

/*
 Theme Name:   Hello Elementor Theme CHild
 Theme URI:    https://technologicweb.rs
 Description:  Izvedena tema za Elementor
 Author:       TechnoLogic Web
 Author URI:   https://technologicweb.rs
 Template:     hello elementor theme
 Version:      1.0.0
 Text Domain:  hello-elementor-theme-child
*/

/* Ovde pišeš sva vizuelna podešavanja (CSS izmene) */

Vrednost u redu gde piše Template: mora potpuno da odgovara nazivu foldera glavne teme. Obavezno koristi isključivo mala slova, bez razmaka.

Korak 3: Pravljenje functions.php fajla

Zatim, u istom folderu napravi fajl functions.php. On je neophodan kako bi tvoja nova tema pravilno preuzela izgled od glavne teme:

<?php
/**
 * Učitavanje pravila za dizajn iz glavne teme.
 * Napomena: Koristimo bezbednu WordPress metodu (wp_enqueue_scripts), a NE @import pravilo u CSS-u.
 * Korišćenje @import usporava sajt jer blokira istovremeno učitavanje fajlova,
 * što negativno utiče na korisničko iskustvo i metrike brzine.
 */
add_action( 'wp_enqueue_scripts', 'technologicweb_child_enqueue_styles' );

function technologicweb_child_enqueue_styles() {
    // Učitaj dizajn glavne teme
    wp_enqueue_style(
        'parent-style',
        get_template_directory_uri() . '/style.css'
    );

    // Učitaj dodatni dizajn iz tvoje izvedene teme (ukoliko imaš izmene)
    wp_enqueue_style(
        'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( 'parent-style' ) // Zavisi od glavnog dizajna
    );
}

Korak 4: Aktivacija child teme

Uloguj se na radnu tablu svog WordPress sajta i idi na Izgled, a zatim na Teme. Tu ćeš videti svoju novu temu. Klikni na dugme za aktivaciju.

Tvoj sajt će izgledati identično kao pre. Upravo tako i treba da bude, jer nova tema preuzima kompletan izgled i funkcionalnost od glavne.

Pravljenje child teme pomoću dodatka

Ako ti je ručni proces previše složen, postoje dodaci koji ceo posao rade umesto tebe. Najpoznatiji i najčešće korišćen je Child Theme Configurator.

Child Theme Configurator: instalacija i upotreba

Instaliraj ovaj dodatak direktno iz WordPress biblioteke. Kada ga aktiviraš, idi na opciju Alati i pronađi Child Themes. Ovaj dodatak će pregledati tvoju glavnu temu i automatski napraviti sve potrebne fajlove u samo jednom koraku.

Pored toga, dodatak samostalno prenosi sva pravila za dizajn, pa ne moraš da brineš o ručnom pisanju koda u glavnim fajlovima.

Kada koristiti dodatak, a kada raditi ručno

Ručni pristup je bolji ako razumeš osnove kodiranja i planiraš da praviš ozbiljnije izmene na sajtu. S druge strane, dodatak je idealan izbor ako ti je potrebna samo osnovna zaštita prilikom ažuriranja, bez komplikovanih i dubokih promena.

Šta sve možeš menjati

Korišćenje ove teme daje ti potpunu slobodu da prilagođavaš sajt bez ikakvog rizika. Evo šta najčešće menjamo tokom izrade web sajtova:

Izmene vizuelnog izgleda (CSS)

Sva pravila za dizajn pišeš direktno u fajl style.css tvoje nove teme. Promena fonta, boja, razmaka, kao i efekti pri prelasku mišem preko elemenata se unose ovde. Kod koji ovde napišeš obično je dovoljan da uspešno zameni originalni dizajn glavne teme.

/* Primer: Promena boje naslova na svim stranicama */
h1, h2, h3 {
    color: #1a2e4a; /* Tamno plava - TechnoLogic Web boja brenda */
}

/* Primer: Prilagođeni izgled dugmeta */
.wp-block-button__link {
    background-color: #00c853; /* Signalno zelena */
    border-radius: 4px;
    font-weight: 600;
}

Fajlovi za strukturu sajta

Ukoliko je potrebno da izmeniš samu strukturu stranice (na primer, zaglavlje sajta ili prikaz pojedinačnih članaka), jednostavno iskopiraj odgovarajući fajl iz glavne teme u svoju child temu, vodeći računa da folderi budu isti, i zatim izmeni tu kopiju. WordPress uvek daje prednost tvojoj kopiji fajla i automatski će nju prikazati korisnicima.

Dodatne funkcionalnosti

Napredne funkcije, prilagođeni kodovi, specijalni delovi sajta i modifikacije upita prema bazi podataka unose se u fajl functions.php. Ovo je od izuzetne važnosti kada je u pitanju profesionalno održavanje sajta, jer na taj način osiguravamo stabilnost celog sistema prilikom redovnih ažuriranja WordPress-a.

Child tema kao temelj profesionalnog rada u WordPress-u

WordPress child tema nije samo opcija rezervisana za napredne korisnike, već predstavlja apsolutni temelj svakog ozbiljnog projekta na ovoj platformi. Bez nje, gradiš sajt na nesigurnom terenu: samo jedno obično ažuriranje može da obriše tvoje sate uloženog truda.

Ulaganje od svega 15 minuta danas znači da nećeš imati glavobolje prilikom svakog narednog ažuriranja. Kada jednom pravilno postaviš osnove, dalji rad na sajtu teče glatko i bez neprijatnih iznenađenja.

Započeo si složeniji projekat i potrebna ti je stručna podrška? Kontaktiraj TechnoLogic Web. Od postavljanja izvedene teme do kompletnog prilagođavanja sajta, naš tim radi bez kompromisa.

Često postavljana pitanja