Stvaranje WordPress predloška lakše je nego što mislite. Da biste to učinili, ne trebate imati veliko iskustvo u dizajnu ili programiranju web stranica. U ovom članku ćemo vas provesti kroz osnove stvaranja vlastitih WordPress tema od nule.
Zašto biste uopće morali izraditi vlastiti WordPress predložak kada možete koristiti predloške dostupne u bazi podataka? Evo nekoliko razloga koji bi to mogli potaknuti:
- Možete dobiti jedinstvenu web stranicu ili odredišnu stranicu koja se razlikuje od vaše konkurencije. S obzirom na milijune blogova izgrađenih na ovom CMS-u, svaki standardni dizajn korišten je najmanje sto puta.
- Potpuna sloboda djelovanja u fazi razvoja. Možete dodati vlastitu funkcionalnost radnim elementima koji su vam potrebni.
- Možete koristiti različite dizajne za različite dijelove web stranice, što nije moguće kada koristite gotov predložak.
- Možete napraviti nekoliko pogleda i posjetiteljima pružiti mogućnost prebacivanja između različitih tema, što će povećati interes i lojalnost web resursu.
- Jednostavnost rada na WordPressu čini ga dostupnim mnogima (video tutoriali na internetu će pomoći). To znači da ćete sami razvijati glavnu temu ili stvarati podređenu temu uštedjeti novac na angažiranju dizajnera i programera trećih strana.
- Možete iskoristiti mogućnost podređenih tema - kada se izvrše prilagodbe za dupliciranje listova stilova style.css, dok glavna datoteka ostaje netaknuta. To vam omogućuje da brzo poništite promjene ako su neuspješne, a također da ne izgubite posao prilikom ažuriranja glavne teme.
Kratke upute
Naravno, nećete moći u potpunosti naučiti kako izraditi predložak stranice sa samo jednim člankom. Za početak je važno razumjeti osnove – kako se izrađuju najjednostavnije teme. Na temelju njih već sada možete postati kreativni i izraditi landing stranicu ili web stranicu prema svojim željama. Sada ćemo vam dati kratku varalicu s uputama korak po korak - pomoći će vam da shvatite kako izraditi web stranicu.
Prvi korak: pripremni rad
Prije početka rada morate provjeriti imate li uređivač teksta (najjednostavniji je Notepad ili Nodepad++, tim više što ih možete besplatno preuzeti). Sljedeći korak je instaliranje pogona WordPress i paketa Denwer na vaše lokalno računalo. Denver je paket osnovnih alata za programere. Uz njihovu pomoć, proces izrade i izmjene web stranica uvelike se olakšava i ubrzava. Ovaj video će vam pokazati kako ga instalirati:
Drugi korak: stvorite novu tematsku mapu
Idemo u željeni imenik. Najčešće ide sljedećim putem: . Ovdje su pohranjene sve teme - i standardne i prilagođene. Ulazimo u njega i stvaramo novu mapu. Zovemo je, na primjer, "MyFirstTheme".
Sada idite u novu mapu i svakako dodajte dvije datoteke napravljene putem Nodepada++ ili nekog drugog editora. To su index.php i style.css. Za sada neka ti dokumenti ostanu prazni, a onda ćemo ih početi ispunjavati. Također dodajte mapu sa slikama u “MyFirstTheme”. gdje možete dodati slike za ukrašavanje predloška.
Naknadno možete dodati predloške u “MyFirstTheme” za pojedinačne dijelove stranice: bočnu traku (sidebar.php), stranicu (header.php), objave na stranicama (single.php), komentare (comments.php) itd. A skup dodatnih datoteka ovisi o strukturi koju planirate za svoj web resurs.
Treći korak: popunjavanje index.php
Prvo što trebate učiniti je ispuniti indeksnu datoteku (index.php). Evo primjera najjednostavnijeg koda, prema kojem će stranica imati četiri područja: zaglavlje, glavno, bočnu traku i podnožje.
Naslov stranice
U datoteku možete registrirati sve elemente koje želite vidjeti na svojoj web stranici. Više informacija o pisanju index.php koda za izradu tema u WordPressu možete pronaći u videu:
Četvrti korak: ispunite style.css
Sada trebate otvoriti style.css, dodati i ispuniti sljedeća polja (umjesto *** unesite svoje podatke o stranici i vlasniku). Uneseni podaci bit će prikazani u admin panelu.
/*Naziv teme: ***
URI teme: http:// ***
URI autora: http:// ***
Opis: ***
Naknadno će u ovu datoteku biti moguće unijeti razne podatke i pravila koja određuju izgled stranica. Na primjer:
(informacije u /**/ su komentari, a ne dijelovi koda)
U ovoj je fazi prerano za postavljanje strogih stilskih parametara, ali pri daljnjem radu s datotekom ovaj će video vodič biti koristan:
Peti korak: podijelite datoteke
Svi elementi navedeni u index.php trebaju biti duplicirani u zasebnim datotekama. U prvom koraku, u primjeru, osim glavnog dijela, navedeni su zaglavlje, bočna traka i podnožje - stoga za njih kreiramo vlastite dokumente u .php formatu.
Na primjer, stvorite datoteku header.php, otvorite index.php. Pronalazimo odgovarajući dio koda i zalijepimo ga u novu datoteku. Biti će:
Naslov stranice
Isto se radi za preostale dijelove. To bi trebalo učiniti radi lakše navigacije. Kada postoji mnogo elemenata budućeg web-mjesta, odvojene datoteke pomoći će vam da se bolje snađete radi provjere ili izmjena.
Kako bi glavna indeksna datoteka bila u skladu s dodatnim, u index.php ispod blokova za svaki dio mora biti napisano sljedeće:
Ispod je popis standardnih datoteka predložaka koje koristi WordPress. Ne morate ih koristiti ili dodavati vlastite odjeljke:
- Zaglavlje – stil zaglavlja vaše stranice.
- Komentari – predložak za kreiranje komentara.
- Početna – tema za glavnu stranicu.
- Stranica - definira temu ako izradite zasebne stranice na web mjestu
- Kategorija – predložak za raščlanjivanje kategorija
- Datum – definira stil prikaza datuma i vremena.
- Arhiv – predložak za arhivski odjeljak sa starom građom.
- Pretraživanje – datoteka koja specificira parametre za pretraživanje na stranici.
- 404 je predložak za stranicu koja prijavljuje pogrešku 404 Nije pronađeno.
- Podnožje – definira stil podnožja vaše stranice.
Kada naknadno doradite svaki element, trebat će vam vizualni video vodič. Evo nekoliko odabira koji bi vam mogli pomoći:
Zaglavlje u header.php:
Dodavanje sadržaja:
Stilski komentari:
Podnožje na stranici:
Kako sigurno napraviti promjene
Kada trebate napraviti promjene na stranicama web stranice, postoji rizik da nešto napišete netočno i da to ne možete "vratiti". Također se može dogoditi da unosi lista stilova nestanu kada se glavna tema ažurira.
Kako biste spriječili da se to dogodi, možete stvoriti dječju WordPress temu (podtemu) - ovo je duplikat style.css datoteke koja ne utječe na glavnu datoteku (promjene u jednoj ne poništavaju ažuriranja u drugoj).
Stvaranje podređene WordPress teme je jednostavno. Morate napraviti novu mapu u glavnom direktoriju C:\WebServers\home\localhost\www\NAME_SET_DUR_INSTALL\wp-content\themes. U novoj mapi stvaramo vlastitu datoteku style.css sa sljedećim sadržajem:
Naziv teme: NAZIV TEME
Predložak: NAZIV MAPE U TEMI DIJETE
URI teme: ISPUNITE
Opis: ISPUNITE
URI autora: ISPUNITE
/* uvoz stilova nadređene teme */
@import url("../NAME/style.css");
/* Vaši vlastiti dodatni stilovi */
Foo (boja:crvena; )
Sada možete otići na “Izgled›Teme” u administratorskoj ploči i aktivirati podređeni predložak. Ubuduće možete raditi u novoj datoteci. Osim toga, kratka video prezentacija na temu dječjih predložaka:
Danas ćemo detaljno pogledati proces stvaranja stranice postavki za WordPress temu, koristeći prekrasan WooFramework kao primjer.
Zatim ćemo malo zakomplicirati zadatak, koristeći snagu jQueryja, malo ćemo poboljšati funkcionalnost stranice.
WordPress je daleko najpopularniji sustav za upravljanje sadržajem (CMS). Mnogi programeri odabiru WordPress kao svoj CMS, bez obzira na vrstu projekta.
Ovaj sustav je vrlo jednostavan za korištenje, ali ga možete učiniti još lakšim omogućavanjem dodatnih kontrolnih ploča za korisnike. Umjesto otvaranja datoteka PHP predložaka i manipuliranja kodom, korisnici mogu koristiti uobičajenu stranicu postavki na upravljačkoj ploči za upravljanje vašom WordPress temom.
Na primjer, ako vaša tema ima crvenu, plavu i zelenu shemu boja, svaka s određenom CSS datotekom, bilo bi puno lakše kada bi korisnik mogao odabrati boju koju želi s padajućeg popisa. Dakle, danas ćete proći kroz proces stvaranja i poboljšanja stranice s dodatnim postavkama za vaš WordPress administratorski panel.
Korak 1
Prije nego počnemo stvarati nadzornu ploču, trebat će nam tema. Stoga preuzmite , s izvornim datotekama. Vidjet ćete malo izmijenjenu klasičnu WordPress temu. Kopirajte mapu "nettuts" (tako će se zvati naša tema) u mapu wp-content/themes. Mapa bi trebala sadržavati sljedeće datoteke:
- functions.php (prazno)
- indeks.php
- komentari.php
- podnožje.php
- zaglavlje.php
- rtl.php
- bočna traka.php
- stil.css
- screenshot.png
- mapa sa slikama koja sadrži dvije datoteke
Većina našeg koda nalazit će se u datoteci functions.php.
Tema po želji može koristiti datoteku funkcija koja se nalazi unutar mape teme, pod nazivom functions.php. Ova datoteka djeluje kao dodatak, a ako je uključena u vašu temu, automatski se učitava tijekom inicijalizacije WordPressa (i vanjske stranice i administrativna ploča).
Ova datoteka bi se trebala koristiti za:
- opisi funkcija korištenih u različitim datotekama predložaka vaše teme
- Instaliranje dodatnih kontrolnih ploča koje korisnicima omogućuju prilagodbu boja, stilova i drugih aspekata vaše teme.
Korak 2
Sada, nakon što ste preuzeli i instalirali predloženu temu, idite na stranicu “Izgled” - “Teme” i aktivirajte našu nettuts temu.
Sada moramo razmisliti o html oznakama za našu upravljačku ploču. Koristit ćemo ovu strukturu:
Dopustite mi da vam sve objasnim ovdje. Grupe postavki bit će omotane u blok s klasom "rm_wrap", a zatim u blok s klasom "rp_opts". Zatim unutar tih blokova otvaramo oznaku obrasca unutar koje će se nalaziti svi potrebni unosi. Svaki odjeljak postavki (Osnovne postavke, Postavke početne stranice, Postavke bloga itd.) nalazit će se u zasebnom bloku s nazivom klase "rm_section". Ovaj blok će sadržavati naziv (za odjeljak postavki) i nekoliko blokova s ulazima. Korištenje posebnih klasa za blokove, kao što je
Najvažniji dio svega ovoga je da nećemo morati ručno stvarati sav ovaj kod - koristit ćemo snagu PHP-a gdje god je to moguće. Nema smisla ručno pisati kod kada imamo petlje na raspolaganju.
3. korak
Otvorite datoteku functions.php u svom omiljenom uređivaču koda (ja koristim NotePad++) i zalijepite sljedeći kod:
Ovo su dvije PHP varijable koje sadrže naziv vaše teme (u našem slučaju Nettuts) i alias koji navedete (u našem primjeru nt). Pseudonim se koristi kao prefiks imena svih postavki teme i obično je jedinstven za svaku temu.
Zatim ćemo izraditi nekoliko redaka koda za automatsko generiranje popisa WordPress kategorija, umjesto da tjeramo korisnika da ručno unese svoj ID. Zalijepite sljedeći kod odmah nakon prethodnog:
$categories = get_categories("hide_empty=0&order_by=name"); $wp_cats = niz(); foreach ($categories as $category_list)( $wp_cats[$category_list -> cat_ID] = $category_list -> cat_name; ) array_unshift($wp_cats, "Odaberi kategoriju");
Ovaj isječak koda koristi ugrađenu wordpressovu funkciju get_categories za dobivanje svih kategorija, a zatim koristi foreach petlju za njihovo pohranjivanje u varijablu $wp_cats. Zatim se nizu dodaje opcija "odaberi kategoriju".
Korak 4
Sada je vrijeme da izradimo popis postavki za našu temu. Zalijepite sljedeći kod u svoju datoteku functions.php:
$options = array(array("name" => "Settings", "type" => "title"), array ("name" => "Basic settings", "type" => "section"), array ( "type" => "open"), niz ("name" => "Shema boja", "desc" => "Odaberite shemu boja teme", "id" => $shortname. "_color_scheme", "type" = > "select", "options" => niz ("plavo", "crveno", "zeleno"), "std" => "plavo"), niz ("name" => "URL logotipa", "desc" => "Unesite vezu na sliku logotipa", "id" => $shortname "_logo", "type" => "text", "std" => ""), array ("name" => ". Prilagođeni CSS ", "desc" => "Želite li upotrijebiti vlastiti CSS kod u ovo polje", "id" => $shortname . "_custom_css", "type" => "textarea", "std " => "" ), niz ("tip" => "zatvori"), niz ("ime" => "Početna stranica", "tip" => "odjeljak"), niz ("tip" => "otvori "), array ( "name" => "Slika u zaglavlju, na glavnoj stranici", "desc" => "Unesite URL slike koja će se koristiti u zaglavlju", "id" => $shortname ."_header_img", "type" => " text", "std" => ""), array ("name" => "Kategorija početne stranice", "desc" => "Odaberite kategoriju u kojoj će postovi biti published", "id" => $shortname ." _feat_cat", "type" => "select", "options" => $wp_cats, "std" => "Select category"), niz ("type" => "close"), niz ("name" => "Footment", "type" => "section"), array ("type" => "open"), array("name" => "Copyright text", "desc" => "Unesite tekst koji će biti objavljen na desnoj strani podruma. Možete koristiti HTML", "id" => $shortname."_footer_text", "type" => "text", "std" => ""), array("name" => "Google Analytics Code", " desc " => "Ovdje možete postaviti Google Analytics kod ili bilo koji drugi brojač", "id" => $shortname."_ga_code", "type" => "textarea", "std" => ""), array( "name" => "Favicon", "desc" => "Favicon je pikselna ikona koja predstavlja vašu stranicu. Umetnite URL slike s ekstenzijom .ico", "id" => $shortname."_favicon ", "type " => "text", "std" => get_bloginfo("url") ."/favicon.ico"), array("name" => "Feedburner URL", "desc" => "Feedburner je Googleova usluga koja kontrolira RSS feedove. Ovdje zalijepite svoj Feedburner URL kako bi ga čitatelji vidjeli na vašoj web stranici", "id" => $shortname."_feedburner", "type" => "text", "std" = > get_bloginfo(" rss2_url")), array("type" => "close"));
Ovo je bio prilično velik dio koda koji zaslužuje malo pojašnjenja. Tako:
- PHP varijabla $options pohranjuje cijeli popis postavki za našu temu.
- Popis postavki sastoji se od nekoliko nizova, od kojih svaki sadrži tipku tipa za određivanje vrste postavke i načina na koji se prikazuje.
- Naš popis postavki počinje s nizom “type” => “title” - koji će se koristiti za prikaz naziva teme i naslova u naslovu stranice.
- Svaki odjeljak (Osnovne postavke, Početna stranica, Podnožje) ima zaseban popis postavki.
- Novi odjeljak započinjemo zatvaranjem bilo kojeg od prethodnih odjeljaka i deklariranjem novog odjeljka pomoću array(“name” => “Footer”, “type” => “section”).
- Svaka opcija može sadržavati sljedeće postavke:
Ime: Naziv tekstualnog polja.
desc: Kratak opis polja za korisnika.
iskaznica: ID polja, s prefiksom pseudonima. Ovo će se koristiti za snimanje postavke i pristup njoj.
tip: vrsta unosa - tekst, odabir ili tekstualno polje
opcije: koristi se za deklariranje niza postavki za polje padajućeg popisa.
std: Zadana vrijednost polja, koja se koristi ako nisu navedene druge vrijednosti.
Korak 5
Pokušajte se prijaviti na nadzornu ploču WordPressa. Nigdje nećete pronaći postavke koje smo naveli, pa kako ih možemo prikazati? Dodajte sljedeći kod u datoteku functions.php:
Funkcija mytheme_add_admin())( globalno $themename, $shortname, $options; if($_GET["page"] == basename(__FILE__))( if("saved" == $_REQUEST["action"])( foreach ( $options as $value)( update_option($value["id"], $_REQUEST[$value["id"]]); ) foreach ($options as $value)( if(isset ($_REQUEST[$value) [ "id"]]))( update_option($value["id"], $_REQUEST[$value["id"]]); )else( delete_option($value["id"]); ) ) header( " Lokacija: admin.php?page=functions.php&saved=true"); else if("reset" == $_REQUEST["action"])( foreach($options as $value)( delete_option($) value ["id"]); zaglavlje("Lokacija: admin.php&page=functions.php&reset=true"); ; ) funkcija mytheme_add_init() ( )
Ova se funkcija koristi i za ažuriranje samih postavki i za dodavanje stranice na upravljačkoj ploči. Ako su postavke spremljene (određene skrivenom varijablom save), tada se sve postavke ažuriraju navedenim vrijednostima. Međutim, ako su postavke poništene (određene korištenjem druge skrivene varijable poništavanja), tada se sve postavke brišu.
Posljednji redak funkcije dodaje stranicu izbornika - parametre redom: ime i naslov, razinu korisničkih prava za pregled stranice, spremanje stranice i funkciju koja se koristi za prikaz/spremanje postavki (u našem primjeru nazvana mytheme_admin).
Primijetite da je funkcija mytheme_add_init prazna? Neka za sada ostane kako je, vratit ćemo se kasnije.
Korak 6
Stranica s postavkama na upravljačkoj ploči i dalje se ne pojavljuje? No, još nismo dovršili funkciju mytheme_admim, koja je gore spomenuta. Za izradu ove funkcije trebat će nam kôd iz koraka 6,7 i 8. Započnimo.
Funkcija mytheme_admin())( globalno $themename, $shortname, $options; $i = 0; if($_REQUEST["action"] == "save") echo "
postavke teme ". $themename ." bili spašeni
postavke teme ". $themename ." bili resetirani
postavke
Za praktičnije upravljanje temama, možete koristiti izbornik u nastavku
Ovdje se koristi PHP foreach petlja, svaka vrsta postavki se određuje pojedinačno za svaki slučaj. Da bismo to učinili, upotrijebit ćemo naredbu switch. Varijabla u naredbi switch je trenutni tip parametra, case je očekivani tip parametra. Vjerojatno ste primijetili izraz "slomiti" nakon svakog slučaja? Ovaj se izraz koristi za sprječavanje neispravne obrade uvjeta. Kada vrijednost slučaja odgovara varijabli, svi sljedeći slučajevi također će se izvršiti. Odnosno, ako smo definirali case3, tada će se osim njega izvršavati i case4, case5 itd. Ali ovo nam ne treba, pa koristimo break da prekinemo naredbu switch.
Ako je trenutna vrijednost parametra "otvoreno", ništa se ne događa. Ako je trenutna vrijednost "blizu", postavljaju se dva bloka za zatvaranje. Vrijednost parametra “title” koristi se samo jednom - u uvodnom tekstu prije postavki teme. Za svaku vrstu “text” (input type=”text”), “select” (padajući popis) i “textarea” (naziv govori sam za sebe), prikazuje se odgovarajući unos. Obratite pozornost na blok
Korak 8
Bližimo se kraju ove prilično velike značajke. Zalijepite sljedeći kod:
Velika i mala slova "odaberi" : ?>
/functions/images/trans.gif" class="inactive" alt=""/>
!}
Za vrstu postavke "odjeljak", koristimo varijablu brojača $i. To vam omogućuje da pratite broj odjeljka i kombinirate ga s nazivom gumba za slanje, dajući tako svakom gumbu jedinstveni naziv. Osim toga, obrazac se dodaje na kraj odjeljka za poništavanje svih postavki. Slika će se koristiti za daljnje izmjene jQueryja. Ovo je posljednji dio koda koji će staviti naše funkcije u akciju:
Add_action("admin_init", "mytheme_add_init"); add_action("admin_menu", "mytheme_add_admin");
Ovaj kod dodaje dodatnu stranicu na WordPress nadzornoj ploči.
Korak 9
Odlično, sada imamo vlastitu stranicu za upravljanje, s zasebnom stavkom izbornika. Međutim, nakon što smo posjetili ovu stranicu, vidimo da nije sve tako dobro kako bismo željeli. Ali nema veze, imamo sjajnog pomoćnika - CSS! Napravite novu mapu “functions”, unutar mape nettuts. Unutar ove mape kreirajte novu datoteku – functions.css i u nju zalijepite sljedeći kod:
Rm_wrap( width:740px; ) .rm_section( border:1px solid #ddd; border-bottom:0; background:#f9f9f9; ) .rm_opts label(font-size:12px; font-weight:700; width:200px; display :block; float:left; ) .rm_input ( padding:30px 10px; border-bottom:1px solid #ddd; border-top:1px solid #fff; ) .rm_opts small( display:block; float:right; width:200px ; color:#999; ) .rm_opts input, .rm_opts select( width:280px; font-size:12px; padding:4px; color:#333; line-height:1em; background:#f3f3f3; ) .rm_input input: fokus, .rm_input textarea:focus( background:#fff; ) .rm_input textarea( width:280px; height:175px; font-size:12px; padding:4px; color:#333; line-height:1.5em; background: #f3f3f3; ) .rm_title h3 (kursor:pokazivač; veličina-fonta:1em; transformacija teksta: velika slova; margina:0; težina-fonta: podebljano; boja:#232323; float:lijevo; širina:80%; padding: 14px 4px;) .rm_title(kursor:pokazivač; border-bottom:1px solid #ddd; background:#eee; padding:0; ) .rm_title h3 img.inactive(margin:-8px 10px 0 2px; širina:32px; visina:32px; pozadina:url("images/pointer.png") bez ponavljanja 0 0; float:lijevo; -moz-border-radius:6px; border:1px solid #ccc; ) .rm_title h3 img.active( margin:-8px 10px 0 2px; width:32px; height:32px; background:url("images/pointer.png") no-repeat 0 -32px; float:left; -moz- border-radius:6px; border:1px solid #ccc ) .rm_title h3:hover img( border:1px solid #999; ) .rm_title span.submit( display:block; float: desno; margina: 0; širina: 14px 0; .rm_table th, .rm_table td (border: 10px; text- align:center;) .rm_table th, .rm_table td.feature(border-color:#888;)
Mislim da ovaj kod ne zahtijeva nikakvo objašnjenje, sve je vrlo jednostavno i jasno. Naravno, možete ga promijeniti po svom ukusu.
Korak 10
Sada kada imamo spremnu CSS datoteku, kako ćemo je povezati sa stranicom ako nemamo izravan pristup odjeljku dokumenta?
? Sjećate se da smo stvorili praznu funkciju mytheme_add_init()? Ona je ta koja će nam pomoći. Promijenite ga na sljedeći način:Funkcija mytheme_add_init() ( $file_dir = get_bloginfo("template_directory"); wp_enqueue_style("functions", $file_dir."/functions/functions.css", false, "1.0", "all"); )
Ovaj će kôd uključiti datoteku functions.css u odjeljku dokumenta
. Mjesto datoteke određeno je mapom predloška.
Korak 11
Pogledajte našu stranicu. Izgleda prilično dobro, preostaje samo dodati funkcionalnost plus ikonama u zaglavljima odjeljaka. Za ovo ćemo koristiti jQuery. Napravite novu datoteku rm_script.js unutar mape nettuts/functions/folder. Zalijepite sljedeći kod:
JQuery(document).ready(function())( jQuery(".rm_options").slideUp(); jQuery(".rm_section h3").click(function())( if(jQuery(this).parent() .next (".rm_options").css("display")==="none") ( jQuery(this).removeClass("inactive").addClass("active").children("img").removeClass (" inactive").addClass("active"); ) else ( jQuery(this).removeClass("active").addClass("inactive").children("img").removeClass("active").addClass (" neaktivan"); jQuery(this).next(".rm_options").slideToggle("slow" ));
Što ovaj kod radi? Nakon što se DOM učita, svi blokovi s klasom "rm_options" su skupljeni. Zatim, kada kliknete na ikonu plus, "neaktivna" klasa se uklanja i dodaje se "aktivna" klasa, koja zamjenjuje ikonu znakom minus. Kada ponovo kliknete ovu ikonu, događa se obrnuti proces. Za skupljanje/proširivanje blokova koristi se prilično jednostavna funkcija jQuery slideToggle. Za povezivanje ove skripte sa stranicom koristit ćemo funkciju mytheme_add_init() s kojom smo već upoznati, promijenite je na sljedeći način:
Funkcija mytheme_add_init() ( $file_dir = get_bloginfo("template_directory"); wp_enqueue_style("functions", $file_dir."/functions/style.css", false, "1.0", "all"); wp_enqueue_script("rm_script", $file_dir."/functions/script.js", false, "1.0");
Nakon ovoga, skripta bi trebala raditi. Kako to izgleda pogledajte na stranici:
Korak 12
Sada kada je naša stranica s postavkama potpuno spremna, ostaje nam još malo popričati o korištenju samih postavki. Kod za korištenje parametara izgleda ovako:
$var = get_option("nt_colur_scheme");
Uz njegovu pomoć moći ćemo promijeniti shemu boja stranice. Prilično je jednostavno:
/* Promjena CSS datoteke ovisno o odabranoj boji */ /.css" /> /*Izlaz teksta u podnožje, možete koristiti HTML oznake */
Opseg primjene ograničen je samo vašom maštom.
Ovim člankom nastavljam seriju lekcija o izradi web stranica pomoću pogona WordPress. Nakon što instaliramo novu temu na blog, morat ćemo je prilagoditi našim potrebama. Ovo uopće nije teško učiniti. Ali za uređivanje WordPress predloška, trebate barem znati kako funkcionira i koje su datoteke za što odgovorne. Proučivši Struktura WordPress predloška i s osnovnim znanjem HTML-a i CSS-a, već možete uređivati predložak teme, mijenjajući njegov izgled i funkcionalnost. Ali prvo o svemu.
Odmah nakon instaliranja nove teme, vaš blog vjerojatno neće imati atraktivan izgled. Da biste to popravili, trebate prilagoditi svoju WordPress temu dodavanjem i organiziranjem svih potrebnih elemenata na stranicama vašeg bloga. Pa krenimo prilagođavanje predloška WordPress teme.
Postavljanje WordPress teme (template).
Idemo unutra Alatna traka() WordPress i nastavit će ga proučavati, detaljno ispitujući sve točke u odjeljku "Dizajn", koji je odgovoran za izgled i uređivanje WordPress predloška:
Sljedeća kartica je "Widgeti". Kada prijeđemo na njega, pred nama će se otvoriti sljedeća slika:
Na lijevoj strani vidimo sve" Dostupni widgeti“: RSS, arhive, kalendar, traženje, oblak oznaka, najnoviji postovi, naslovi, tekst itd. Bočna traka bloga shematski je prikazana s desne strane. Ovisno o strukturi WordPress predloška, može postojati jedna ili više bočnih traka. Na blogu izgleda kao bočna traka koja se nalazi s desne ili lijeve strane, a moguće i s obje strane u isto vrijeme.
Da bismo bočnu traku ispunili widgetima koji su nam potrebni, samo trebamo odabrati željeni widget lijevom tipkom miša i, držeći je, povući widget na bočnu traku koja nam je potrebna. Na isti način možete pomicati widgete gore ili dolje u samoj bočnoj traci.
Što svaki od widgeta znači dovoljno je jasno iz njihovih naziva. Widget "Tekst" zaslužuje posebnu pozornost. Pomicanjem na bočnu traku otvaraju se polja za unos podataka i naslova. Ovdje možete umetnuti i uobičajeni tekst sa slikama i razne HTML kodove. Na primjer, brojači statistike, reklamni blokovi i natpisi, obrasci za pretplatu itd. Nakon što ispunite ili uredite widget "Tekst", kliknite gumb "Spremi" kako bi promjene stupile na snagu. Nepotrebne widgete možete ukloniti klikom na gumb "Izbriši" ili povlačenjem natrag u odjeljak " Dostupni widgeti“. Ako trebate privremeno onemogućiti widget, dok spremate sve njegove postavke za buduću upotrebu, povucite ovaj widget prema dolje ulijevo u odjeljak " Neaktivni widgeti“. Možete ga vratiti u bilo kojem trenutku.
Sljedeća je kartica "Izbornik". Nakon što ga otvorimo, nalazimo se na stranici za kreiranje vlastitog blog izbornika s detaljnim opisom kako to učiniti. Možete uključiti kategorije, stranice i proizvoljne poveznice u izbornik tako da ih rasporedite u željeni redoslijed jednostavnim povlačenjem i ispuštanjem. Klikom na gumb “Spremi izbornik” kreirat će se izbornik bloga.
Kako bi se stvoreni izbornik pojavio na bočnoj traci, morate otići na karticu "Widgeti" i povući widget " Vlastiti jelovnik” na bočnoj traci. Sukladno tome, ako ste na svom blogu aktivirali widgete “Kategorije” i “Stranice”, oni se mogu deaktivirati. Moram reći da malo ljudi koristi jelovnik na blogu.
Zadnja kartica "Uređivač" omogućuje vam uređivanje datoteka WordPress predložaka. Nakon što ga otvorite, desno ćete vidjeti popis svih WordPress predložaka, odnosno njegovu strukturu. Kada kliknete na bilo koju od ovih datoteka, njen sadržaj će se otvoriti u prozoru za uređivanje. Nakon što napravite potrebne izmjene, ne zaboravite ih potvrditi klikom na gumb „Ažuriraj datoteku“.
Dakle, proučili smo odjeljak "Dizajn" u administratorskoj ploči našeg bloga i shvatili postavke WordPress teme (predloška).
Vrijedno je napomenuti da gotovo svaka moderna tema ima svoje postavke. Obično se postavljaju na administrativnoj ploči u zasebnom odjeljku s nazivom teme.
Ponekad se prilagođene postavke za predložak teme WordPress nalaze kao zasebne stavke u odjeljku "Dizajn".
Kako konfigurirati određenu temu treba biti detaljno opisano na web stranici programera ili lokalizatora predloška s kojeg ste je preuzeli. Individualne postavke WordPress teme omogućuju vam da jednostavno, bez uplitanja u izvorni kod predloška, promijenite elemente dizajna web stranice (logotip, pozadinu, fontove, izgled bočne trake itd.), umetnete bannere, gumbe za društvene mreže i RSS, brojače statistike, oglašavanje blokovi i još mnogo toga. Savjetujem vam da pažljivo proučite ove postavke, posebno ako ste novi u HTML-u i CSS-u.
Pažnja! Važno je znati da ako ste promijenili pojedinačne postavke predloška, tada se prilikom instaliranja nove teme te postavke moraju vratiti u prvobitno stanje. Obično za ove svrhe postoje gumbi "Poništi" ili " Vrati na zadano“, ovisno o WordPress temi koju odaberete.
Pogledajmo sada od kojih se datoteka sastoji predložak teme i proučimo njegovu strukturu.
Svaka od datoteka predloška WordPressa odgovorna je za dizajn pojedinačnih blokova na web stranici web mjesta. Zatim se, poput građevinskog seta, stranice bloga sklapaju iz tih blokova u jedinstvenu cjelinu. Budući da WordPress teme (predloške) stvaraju različiti programeri, struktura ovih predložaka može biti drugačija. Neke datoteke predložaka tema moraju biti prisutne na svakoj web stranici, dok se druge prikazuju samo u određenim slučajevima.
Na slici ispod možete vidjeti približnu strukturu WordPress predloška.
Ovdje je popis datoteka koje su obično prisutne u svim predlošcima i njihov kratki opis:
- header.php (zaglavlje) – nalazi se na svim web stranicama i odgovoran je za prikaz gornjeg dijela stranice.
- index.php – odgovoran je za prikaz sadržaja glavne stranice.
- single.php – prikazuje svaki određeni članak.
- page.php – sadržaj statične web stranice.
- category.php – datoteka koja prikazuje postove određene kategorije.
- tag.php – prikazuje arhivu objava po oznakama.
- archive.php – privremena arhiva članaka (za mjesec ili godinu). Ponekad ova datoteka zamjenjuje category.php i tag.php.
- search.php – prikazuje zapise rezultata pretraživanja za stranicu.
- comments.php – datoteka predloška komentara.
- sidebar.php – bočni stupac stranice u kojem se nalaze widgeti. Može postojati nekoliko bočnih traka, ovisno o strukturi WordPress predloška. Ova datoteka je prisutna na svim stranicama stranice.
- 404.php je datoteka s pogreškom 404 koja se pojavljuje ako se unese pogrešna adresa web stranice ili ona ne postoji.
- functions.php – ova datoteka obično sadrži funkcije koje se pozivaju prilikom prikaza stranice ili rada s administratorskom pločom.
- footer.php (footer) – donji dio stranice, prisutan na svim njezinim stranicama. Već smo pogledali ovu datoteku WordPress predloška kada smo uklonili neželjene .
- style.css je datoteka stilske tablice odgovorna za vanjski dizajn stranice.
Sada znajući Struktura WordPress predloška i za što je odgovorna svaka njegova datoteka, možete promijeniti izgled i funkcionalnost određenog dijela stranice.
Važno je razumjeti da je bez barem osnovnog znanja o HTML-u i CSS-u bolje ne pokušavati uređivati datoteke WordPress tema (predložaka). A ako i dalje trebate urediti datoteku predloška, prvo napravite sigurnosnu kopiju. Zatim, ako nešto pođe po zlu, uvijek možete vratiti izvornu datoteku.
Htio bih od sebe napomenuti da uredi WordPress predložak Praktičnije je ne s administratorske ploče bloga, već otvaranjem datoteke u Notepad++, koristeći vezu s hosting poslužiteljem putem FTP klijenta. O tome kako to učiniti možete pročitati u članku ““.
To je sve za danas. Sada će stranica koju ste izradili izgledati mnogo privlačnije. Vidimo se na stranicama bloga.
Ostavite svoje komentare i ne zaboravite kliknuti na gumbe društvenih medija na dnu članka, čime ćete pomoći razvoju ovog bloga. Hvala unaprijed!
Izdali smo novu knjigu, Marketing sadržaja društvenih medija: Kako ući u glave svojih sljedbenika i navesti ih da se zaljube u vaš brend.
Funkcioniranje podređenih tema (“kćeri”) temelji se na njihovom odnosu s roditeljskim temama (“roditeljima”). Važno je uzeti u obzir da su besplatne i plaćene teme u početku roditelji, stoga kćer kopira njihove parametre i svojstva, a također dobiva standardni skup svojih funkcija. U budućnosti, uzimajući u obzir potrebe određenog internetskog izvora, skup ovih opcija može se proširiti.
Ako se dotaknemo terminologije, onda je riječ o posebnoj temi koja poprima značenje druge, koja djeluje kao roditelj. Zašto su stvoreni? Modificirati postojeće WordPress teme i time povećati njihov broj.
Koja je razlika između "kćeri"
WordPress podređena tema omogućuje vam da napravite potrebne promjene i prilagodbe. Zatim ćemo pogledati kako ga izraditi, ali prije toga pogledat ćemo njegove ključne razlike:
- Promjene napravljene na nadređenoj modifikaciji ne utječu na podređenu modifikaciju. Iz ovoga slijedi da su nakon razvoja neovisni jedni o drugima.
- Izvedenica funkcionira samo ako je roditelj instaliran, a njegova aktivacija se događa kasnije.
- Podružnice su vezane samo za svoju bazu i nisu međusobno povezane ni s jednom ni s drugom.
Je li prikladno raditi
WordPress podređena tema izvrsna je ideja sa širokim rasponom prednosti. Osobno bismo ga preporučili kao standard uz premium proizvode. Nabrojimo samo neke od prednosti:
- Oni automatski spremaju izvršene prilagodbe. Zahvaljujući tome, možete izvršiti prilagodbe izravno u kodu, bez rizika da će se postavke izgubiti ili izgubiti tijekom ažuriranja.
- Rad s njima izvrsna je priprema za prelazak na pisanje glavnog koda za nadređene varijante.
- Poboljšan tijek rada. Sa samo jednim tematskim okvirom na raspolaganju možete izraditi web stranice različite složenosti i funkcionalnosti.
Budući da je ovo nastavak nadređenog, skup značajki i funkcija ovdje je identičan. Glavne komponente:
- Direktorij (mapa/lokacija komponenti datoteke).
- “style.css”, gdje su navedena glavna i dodatna svojstva.
- “functions.php”, gdje je zapisana definicija funkcija.
Nema ograničenja za dodavanje predložaka, ali navedene komponente moraju biti prisutne u bilo kojem.
Operacija
“Kćeri” su lokalizirane u vlastitu mapu i imaju zasebne “functions.php” i “style.css”. Uvijek možete pisati pomoćne datoteke, ali ovaj par je odgovoran za pravilan rad - bez padova ili problema.
Ako se ti formati pravilno koriste, možete urediti gotovo sve početne parametre, uključujući stil, pojedinačne stavke izgleda, skripte itd.
Tematski uređaj sličan je uređivačkim slojevima uređivača fotografija. Ako korisnik posjeti vaš internetski resurs, pred njim se otvara "kći", a zatim se opcije i stilovi koji nedostaju učitavaju od roditelja. U konačnici, većinu koda prenosi roditelj, ali ga je potrebno modificirati kako bi odgovarao djetetovim postavkama prije nego što se može koristiti.
Kako stvoriti
Prvo provjerite imate li sve što vam je potrebno na raspolaganju. Naime, pristup FTP-u ili upravitelj datotekama, otvaraju pristup samoj kontrolnoj ploči WordPressa. Pa krenimo.
Korak br.1. Stvaranje WordPress podređene teme
Ovo je prilično jednostavan postupak. Ako detaljno slijedite upute, svaki korisnik to može svladati.
Prije svega, kreiramo mapu za našu kćer u standardnom imeniku. Kako bi direktorij imao red i sadržaj bio sistematiziran, bolje je mapu imenovati prema primjeru “Ime roditelja + završno dijete”. Radi praktičnosti, možete dodati naziv određenog projekta za koji izrađujemo temu. Glavna stvar je da naziv direktorija nema razmake, inače može doći do pogrešaka. Upravitelj datoteka ili FTP klijent pomoći će vam da stvorite novu mapu. Danas se takav FTP klijent kao FileZilla dobro pokazao.
Na primjer, uzmimo "Twenty Seventeen", koji je mnogima poznat, kao osnovu. Više volim raditi s Upraviteljem datoteka, pa moj put do stvorene mape izgleda ovako:
Radimo sljedeće:
Sigurno ste se uvjerili da je stvaranje lagan proces. Samo trebate strogo slijediti upute i raditi s pravim pristupom.
Korak br.2. postavke
Da biste započeli, izmijenili, dopunili, prilagodili "kćer" zahtjevima i zahtjevima vaše stranice, morate ispravno postaviti postavke. S time ćemo se pozabaviti redom.
- Prvo morate prilagoditi izgled.
Da bismo to učinili, prilagodit ćemo "custom.css", koji se nalazi u direktoriju. To se može učiniti putem FTP klijenta, običnog uređivača teksta, upravitelja datotekama ili posebnog WordPress uređivača (možete ga pronaći tako da otvorite “Izgled”, zatim “Uređivač”). Ovdje će vam trebati barem minimalno znanje o pravilima korištenja CSS-a, kao i vještina provjere elemenata web stranice putem preglednika. Na primjer, za promjenu boje pozadine u "style.css", pišemo sljedeće CSS pravilo:
Sljedeća slika prikazuje kako će se promijeniti dizajn stranice nakon što se izvrše prilagodbe. Pozadina je postala svijetlo zelena:
Na taj način možete uređivati bilo koji postojeći element na stranici.
2.Rad s funkcijama.
Korištenje i rad s "kćerima" također pruža prednost mogućnosti održavanja dvije neovisne "functions.php". Podsjetimo vas da se ove datoteke koriste za uklanjanje starih i dodavanje novih funkcija. Ako su dostupni, ne morate brinuti o sigurnosti ili problemima u radu dokumenta. Čak i ako se baza ažurira, ostat će nepromijenjena.
Da biste dodali novu opciju, novi PHP kod također se upisuje u datoteku. Na primjer, kod u nastavku će ukloniti opciju pretraživanja WordPressa.
Posebne usluge koje programeru olakšavaju rad
Možete olakšati proces izrade pomoću brojnih posebnih dodataka. WordPress biblioteka nudi širok izbor dodataka, od kojih je većina besplatna za korištenje. Korištenje dodataka uvelike pojednostavljuje proces razvoja. Pogledajmo najpopularnije dodatke.
- Dijete Themify.
Ovo je najjednostavniji i najlakši dodatak s intuitivnim sučeljem. Mnoge se postavke ovdje mogu izvršiti pritiskom na gumb.
2. Konfiguracija dječje teme.
Ovdje također možete stvoriti "kćer", a to će trajati samo nekoliko klikova. CSS uređivač ovdje je prilično moćan, što vam omogućuje konfiguriranje naprednih funkcija. Dodatak automatski identificira ključna CSS pravila i ne utječe na njih prilikom uređivanja.
3. _child Theme Boilerplate.
Evo gotovih šablona za formiranje "kćeri". Predložak se zove jednostavno - “_child” - i dizajniran je posebno za pojednostavljenje rada. Predložak nudi intuitivnu temu i zahtijeva samo da navedete vezu na "roditelja". Ova vrsta predloška omogućuje vam stvaranje profesionalnih opcija - ovdje su već stvorene 2 gotove datoteke, standardne "functions.php" i "style.css".
Prvi ima posebnu funkciju pod nazivom “aa_enqueue_styles()”. Opcija vam omogućuje stvaranje reda čekanja listova stilova, gdje prvo idu roditeljski, a zatim potomci. Kao rezultat toga, stil potonjeg uvijek određuje prvi.
Većina programera povezuje ove tablice u CSS, ali to čini više štete nego koristi. Pregledniku je potrebno dosta vremena da učita stranicu, jer prvo morate učitati stilove iz "roditelja", a zatim iz derivata. Ako stavite listove stilova zasebno, zadatak preglednika bit će lakši, a brzina učitavanja će se povećati.
Evo koda pomoću kojeg možete dodati ovu opciju:
Druga datoteka ima osnovno zaglavlje koje sadrži posebne informacije. Ove informacije omogućuju WordPressu da ga prepozna kao "podređenu" tablicu stilova. Stoga je posebno važno napisati kod za “style.css”:
Sažmimo
Nije važna vaša razina znanja programiranja ili iskustvo s WordPressom. Stvaranje podređene WordPress teme jednostavno je i nema rizika da će se postavke izbrisati nakon izlaska. Pisanjem malog koda ili izmjenama onoga što ste već napisali i izvođenjem jednostavnih stvari s imenikom, možete promijeniti svoju stranicu. Glavna stvar je slijediti upute, postupno prelazeći s jedne točke na drugu. Ne zaboravite sljedeće: ako postoje ažuriranja za "roditelja", "kćer" se ne mijenja, ovo se pravilo primjenjuje na promjene učinjene u sadržaju, postavkama i tako dalje.
Eksperimentirajte, isprobajte različite opcije i potražite najbolju za sebe.
Ako koristite preuzete teme, onda ste vjerojatno naišli na stranicu koja je dostupna u admin panelu i uz pomoć nje možete prilagoditi temu bez uređivanja koda same teme.
Takve se stranice često stvaraju kako bi korisnicima određene teme olakšale život. Zahvaljujući stranici s postavkama teme, korisnik može sakriti određene blokove, promijeniti lokaciju bočne trake, sheme boja, dodati vlastite stilove, odrediti put do novih slika itd. Sve je ograničeno samo maštom osobe koja je stvorila takvu stranicu za temu.
Ako stvarate temu za prodaju ili jednostavno želite olakšati svoj život, onda bi vam ova metoda mogla biti korisna. U jednoj od lekcija napisao sam da možete prikazati metriku (brojače posjetitelja), oglašavanje itd. putem widgeta, stvarajući posebna mjesta za njih. Koristeći stranicu s postavkama teme, možete stvoriti ista polja u koja možete umetnuti bilo koji tekst, kôd ili veze.
Općenito, imat ćete dodatne opcije tema koje možete sami izraditi bez dodatka. Izgleda otprilike ovako:
Napisat ću o nekoliko elemenata takve stranice i objasniti kako ih koristiti. Napravio sam stranicu od hrpe drugih. Našao sam mnogo različitih, ali svaki je imao nešto što mi nije odgovaralo ili nije funkcioniralo. Jedan nije imao checkboxove ili checkboxove, drugi nije imao poruku da su postavke spremljene, puno nepotrebnog teksta itd. Nakon što sam malo sjedio i skužio što je što, dobio sam svoju stranicu na kojoj bez problema mogu dodavati i uklanjati elemente.
Počnimo s izradom naše stranice postavki.
Prvo morate odlučiti kako ćete točno povezati kod stranice. Postoje dvije mogućnosti.
Prvi je jednostavan, sve dodajemo na samom kraju funkcije.php nakon ?> i to je sve.
Drugi način je stvaranje datoteke postavke.php i dodajte mu sav kod, a zatim ga povežite s funkcije.php na sljedeći način.
Uključi("/postavke.php");
Kada stvarate postavke.php, prije nego što mu dodate kod, provjerite je li spremljen u ispravnom kodiranju - UTF-8 bez BOM-a. Datoteke je najbolje uređivati u programu Notepadd++.
Sada počnimo dodavati sam kod. Prvo, registrirajmo našu funkciju.
Dodajmo sada našu stranicu u admin ploču u izborniku s lijeve strane.
// Dodavanje stranice postavki u funkciju izbornika add_settings_page() ( add_menu_page(__("Opcije teme"), __("Opcije teme"), "manage_options", "settings", "theme_settings_page"); ) //Dodavanje radnji add_action( "admin_init", "theme_settings_init"); add_action("admin_menu", "add_settings_page");
Sada, kada odete na administratorski dio, vidjet ćete ovu stavku u administratorskom izborniku. Ovo će biti naša stranica s postavkama.
Dodajmo akcije i funkciju za spremanje opcija naše stranice
//Spremanje funkcije postavki theme_settings_page() ( globalno $select_options; if (! isset($_REQUEST["settings-updated"])) $_REQUEST["settings-updated"] = false; ?>
Sada ćemo početi dodavati kod koji će prikazati elemente naše stranice. Napravite div i dodajte blokove unutar njega.
Prvi element bit će naslov stranice koji će se prikazati na samom početku, zatim blok unutar kojeg će se pojaviti poruka da su postavke spremljene.
Postavljanje teme
postavke su spremljene
Sada cijeli kod
Postavljanje teme
postavke su spremljene
Stranica postavki je spremna. Možete pogledati gotov rezultat. Zatim moramo prikazati rezultate na pravim mjestima u temi, zatim ćemo odabrati ili unijeti opcije.
Da biste to učinili, prvo trebate omogućiti našu funkciju
Ovaj se redak mora napisati svaki put prije prikazivanja opcije
Odmah nakon pokretanja dodajemo izlaz same opcije. Izgleda gotovo isto za tekstualna polja i polja za unos, glavna stvar je ispravno navesti nazive, o čemu sam već puno napisao gore.
Za logotip, na primjer, to je ovako:
Gotov rezultat će izgledati ovako
Mislim da je ovo jasno. Ako želimo prikazati vrijednost sa stranice postavki, gornji kod umetnemo na pravo mjesto, samo ispravno navodeći nazive. Dakle, prikazujemo za metriku i banner, mijenjajući samo imena u praćenje i banner, ili one koje vi smislite, glavno je da se podudaraju s onima na stranici postavki.
Još uvijek možete izvesti još jedan trik. Na primjeru opcije - Tekst u podnožju, predlažem dodavanje uvjeta - Ako. Suština je sljedeća: u početku je tekst u podnožju napisan prema zadanim postavkama, ali ako korisnik unese nešto na stranici postavki, tada će se umjesto zadanog teksta pojaviti ono što je korisnik naveo.
Da bismo to učinili moramo napisati sljedeći kod:
/" title="" rel="homepage">. Sva prava pridržana. Svaka upotreba materijala dopuštena je samo uz aktivnu vezu na izvor.
Za prikaz sadržaja ako je potvrdni okvir označen, morate napisati sljedeći kod. Slično tekstu u podnožju, ali samo prva polovica koda
Sadržaj ako je potvrdni okvir označen.
Možete dodati bilo koji sadržaj. Sakrij barem polovicu stranice ako je potrebno.
Sada preostaje samo prikazati sadržaj onoga što korisnik odabere na popisu. Za nas je to bilo postavljanje bloka lijevo ili desno
Ovdje ćemo, kao i kod teksta u podnožju, koristiti uvjet - Ako. Postoje samo dva elementa na mom popisu, pa je uvjet sljedeći: ako je odabrana stavka broj jedan (s lijeve strane), prikazujemo blok koji ima svojstvo u stilovima - float:lijevo;, inače prikazujemo blok sa svojstvom - float:desno;.
Blok s lijeve strane
Blokiraj desno
U principu, pokazao sam vam osnove. Možete dodati i ukloniti elemente, promijeniti sve za sebe i stvoriti nešto. Lekcija nije laka i ovdje je glavna stvar ne zbuniti se, ali nakon što ste dobro razumjeli i proučili, lako možete stvoriti takve stranice za sve teme.
To je sve, hvala na pažnji. 🙂
