{"id":12879,"date":"2016-11-09T09:25:29","date_gmt":"2016-11-09T07:25:29","guid":{"rendered":"https:\/\/dev.optiweb.com\/?post_type=post&p=12879"},"modified":"2018-09-03T12:37:06","modified_gmt":"2018-09-03T12:37:06","slug":"uvod-v-wordpress-6-napotkov","status":"publish","type":"post","link":"https:\/\/dev.optiweb.com\/sl\/blog\/uvod-v-wordpress-6-napotkov\/","title":{"rendered":"6 napotkov za WordPress za\u010detnike"},"content":{"rendered":"
\n

Izdelava strani<\/a> v platformi WordPress se bistveno razlikuje od izdelovanja strani \u201ciz ni\u010d\u201d, saj nam WordPress za manj dela ponuja odli\u010dne rezultate. Dr\u017ei, da imamo pri razvijanju spletne strani od za\u010detka popoln nadzor nad tem, kar ustvarimo, saj z\u00a0izbranimi viri\u00a0prikazujemo to\u010dne tiste elemente, ki jih \u017eelimo, vendar za to porabimo neprimerno ve\u010d \u010dasa, kot \u010de bi jo izdelovali v platformi WordPress.<\/p>\n

Vsak za\u010detek je te\u017eak<\/h2>\n

Namen tega \u010dlanka je, da za\u010detnikom prihranimo nekaj mu\u010dnih uric iskanja znanja o WordPressu in prika\u017eemo tiste osnovne funkcionalnosti, s katerimi lahko izdelamo napredne spletne strani. Kako torej za\u010deti? Najprej ustvarimo bazo podatkov, na stre\u017enik prenesemo WordPress datoteke in opravimo namestitev. Prijavimo se v WordPress in nato ustvarimo nekaj strani z vsebino, ki jih enostavno uredimo v urejevalniku.
\nPlatforma WordPress je enostavna za uporabo, zato lahko strani z vsebino izdelujemo naprej in tisto, za kar smo prej s \u010distim HTML-jem potrebovali ve\u010d ur, sedaj izdelamo v manj kot eni uri. Ko izdelamo strani, jih moramo \u0161e preoblikovati.<\/p>\n

Osnovna tema<\/h2>\n

Na prvotni namestitvi WordPress je \u017ee name\u0161\u010denih nekaj tem. Bistveno je, da datotek teh tem ne spreminjamo, zato poznamo tako imenovane child teme. Taka tema se sklicuje na star\u0161evsko temo in uporablja njene datoteke. Vsaka datoteka, ki je ustvarjena v child temi, ima prednost pred tisto v star\u0161evski temi.<\/p>\n

Kako naredimo child temo?<\/strong>
\nTeme se nahajajo v mapi wp-content\/themes. Kreirati moramo novo mapo, kjer nato ustvarimo tri datoteke:
\nfunctions.php,
\nstyle.css,
\nscreenshot.png.
\nBistvena datoteka za delovanje teme je style.css. Da bo na\u0161a tema spoznala svojo star\u0161evsko temo, moramo v komentar na vrhu\u00a0zapisati ime direktorija, v katerem je star\u0161evska tema. To storimo na naslednji na\u010din:<\/p>\n<\/div><\/section>\n<\/div><\/div><\/main><\/div><\/div>

\n\n<\/p>\n<\/div><\/div><\/div><\/div><\/div>
\n

V komentar datoteke style.css lahko vklju\u010dimo \u0161e atribute, kot so Theme name, Theme URI, Description itd. Nujen je samo atribut Template.
\nNa\u0161a tema tako deluje. Dodamo lahko screenshot.png. \u2013\u00a0sliko, ki bo prikazana pri izboru teme. V functions.php zapi\u0161emo PHP ukaze za na\u0161o spletno stran.<\/p>\n

Oblikovanje strani<\/h2>\n

Sedaj lahko poljubno oblikujemo na\u0161o spletno stran, ki je z dopolnjevanjem videti vedno lep\u0161a. Pred tem smo uporabljali Javascript, jQuery in druge, sedaj pa moramo v mapi na\u0161e child teme ustvariti datoteko s kon\u010dnico .js. Lahko jo umestimo tudi v svojo mapo v child temi. Nato odpremo functions.php in napi\u0161emo naslednje:<\/p>\n<\/div><\/section>\n\n<\/div><\/div><\/div><\/div><\/div>

\n\n\n<\/div><\/div><\/div><\/div><\/div>
\n

Ukaz get_stylesheet_directory_uri() ka\u017ee na mapo na\u0161e teme. V na\u0161em primeru je Javascript datoteka v mapi js. Z znanjem Javascript tako lahko dose\u017eemo marsikaj. Kaj pa jQuery? V WordPress je ta \u017ee vklju\u010den. \u010ce \u017eelimo, da deluje, pred na\u0161o skripto vpi\u0161emo \u0161e del\u010dek kode. Na koncu je videti takole:<\/p>\n<\/div><\/section>\n\n<\/div><\/div><\/div><\/div><\/div>

\n\n\n<\/div><\/div><\/div><\/div><\/div>
\n

Po vseh teh korakih lahko uporabljamo CSS, Javascript in jQuery.<\/p>\n

Objava vsebine<\/h2>\n

\u010ce pobrskamo po WordPress administraciji, opazimo zavihek Prispevki, ki je tako imenovani post type. Obstajajo pa tudi custom post type. Zakaj jih sploh potrebujemo?<\/p>\n

Poglejmo na primeru spletne strani o urah. Kam vna\u0161amo ure? Kaj storiti, \u010de je ur 100 ali ve\u010d? Seveda ne bomo izdelali toliko strani, ampak bomo naredili custom post type.
\nUstvarimo ga na naslednji na\u010din:<\/p>\n<\/div><\/section>\n\n<\/div><\/div><\/div><\/div><\/div>

\n\n\n<\/div><\/div><\/div><\/div><\/div>
\n

Po tem koraku bomo lahko vna\u0161ali ure. Odpremo administracijo in kliknemo na gumb Ura, ki se nam je kreiral v levem meniju. Kliknemo na gumb za dodajanje nove ure in ugotovimo, da je okno za urejanje identi\u010dno. Uro dodajamo na spletno stran ravno tako, kot bi dodali novo stran. Vseeno \u0161e vedno nekaj manjka. WordPress pozna tako imenovano funkcijo custom fields. Ta polja dodajamo na\u0161im prispevkom, v na\u0161em primeru uri. S temi polji dose\u017eemo, da vna\u0161anje postane enostavno in vnesemo tiste podatke, ki jih od nas zahteva vmesnik. Kako to storimo?<\/p>\n

Nalo\u017eimo vti\u010dnik. Temu se je na\u010deloma priporo\u010dljivo izogibati, v tem primeru pa je vti\u010dnik v veliko pomo\u010d. Izberemo tak\u0161nega z najve\u010d prenosi in najbolj\u0161o oceno.<\/p>\n

Naslednja funkcionalnost, ki je zelo uporabna v WordPressu, je t. i. shortcode. To je bli\u017enjica do PHP funkcije, ki jo izvedemo neposredno iz WordPress urejevalnika. Na primer:
\n\u010de \u017eelimo znotraj glavnega DIV elementa prikazati 4 DIV elemente, tega ne bomo pisali v WordPress urejevalnik, ampak naredimo shortcode. Izdelamo ga na naslednji na\u010din:
\nV functions.php ustvarimo novo funkcijo.
\nNapi\u0161emo ukaze. V na\u0161em primeru tako:<\/p>\n<\/div><\/section>\n\n<\/div><\/div><\/div><\/div><\/div>

\n\n\n<\/div><\/div><\/div><\/div><\/div>
\n

Bistvena je zadnja vrstica, ki pove\u017ee shortcode z na\u0161o funkcijo.
\nV WordPress urejevalnik na \u017eelenem mestu napi\u0161emo [divs] oz. [imeShortcode].<\/p>\n

Struktura datotek<\/h2>\n

Za konec pa \u0161e nekaj besed o strukturi datotek. Vsaka tema ima definirane predloge, ki jih najdemo v mapi teme. Za za\u010detek so bistvene naslednje predloge:
\nheader.php prikazuje glavo strani,
\nfooter.php prikazuje nogo strani,
\npage.php prikazuje vsebino na\u0161ih strani,
\nsingle.php prikazuje vsebino prispevkov,
\narchive.php prikazuje seznam prispevkov.<\/p>\n

Vse te datoteke lahko ustvarimo v child temi. Imele bodo prednost pred tistimi v glavni temi. Ker bodo v child temi, jih lahko oblikujemo po svoje. Za na\u0161e custom post type prav tako lahko naredimo posebne predloge. Zraven imena datoteke samo dodamo ime na\u0161ega custom post type. Na primer single-ura.php.<\/p>\n

Spoznali smo teme, child teme in njihovo strukturo. S style.css datoteko v na\u0161i child temi oblikujemo spletno stran. Pokazali smo tudi, kako omogo\u010diti uporabo Javascript ter jQuery. V functions.php pi\u0161emo PHP ukaze, ustvarjamo custom post type, shortcode in ostale poljubne funkcije. S custom fields lahko dose\u017eemo bolje strukturiran vnos podatkov na spletno stran. Z dodajanjem novih datotek v na\u0161o child temo, kot je npr. single.php pa lahko spreminjamo postavitev elementov in nadzorujemo prikaz podatkov. WordPress je platforma, ki je enostavna in prijazna za uporabo, kljub temu pa ponuja veliko mo\u017enosti za ustvarjanje spletnih strani in manj\u0161ih trgovin.<\/p>\n

Viri:
\nhttps:\/\/developer.wordpress.org\/reference\/functions\/wp_enqueue_script\/ , 22. 7. 2016
\nhttps:\/\/codex.wordpress.org\/Post_Types , 22. 7. 2016
\nhttps:\/\/codex.wordpress.org\/Shortcode_API , 25. 7. 2016
\nhttps:\/\/codex.wordpress.org\/Site_Architecture_1. 5 , 25. 7. 2016
\nhttps:\/\/codex.wordpress.org\/Post_Type_Templates , 25. 7. 2016<\/p>\n<\/div><\/section>\n\n","protected":false},"excerpt":{"rendered":"

Izdelava strani v platformi Wordpress se bistveno razlikuje od izdelovanja strani “iz ni\u010d”, saj nam Wordpress za manj dela ponuja odli\u010dne rezultate. Preverite, kako za\u010deti.<\/p>\n","protected":false},"author":1,"featured_media":15485,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1030],"tags":[],"_links":{"self":[{"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/posts\/12879"}],"collection":[{"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/comments?post=12879"}],"version-history":[{"count":10,"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/posts\/12879\/revisions"}],"predecessor-version":[{"id":31579,"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/posts\/12879\/revisions\/31579"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/media\/15485"}],"wp:attachment":[{"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/media?parent=12879"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/categories?post=12879"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dev.optiweb.com\/sl\/wp-json\/wp\/v2\/tags?post=12879"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}