Búðu til WordPress þema: skref fyrir skref fyrir sérsniðna þróun

Síðan upphaflega var hleypt af stokkunum árið 2003 hefur WordPress þróast úr einföldu bloggverkfæri í öflugan og vinsælan vefsíðugerðarmann og alhliða CMS (vefumsjónarkerfi) sem er notað af um 38% vefsíðanna á vefnum! Með hliðsjón af vinsældum sínum, ef síða þín þarf að skera sig úr hópnum, þarftu að búa til WordPress þema sem er einstakt fyrir síðuna þína.

Í raun og veru er ekki að furða að WordPress hafi náð að gera það hingað til og verða svo vinsælt.

Magn sveigjanleika sem það hefur og þeir eiginleikar sem það hýsir leyfa víðtæka notkun þess á mismunandi gerðum vefsíðna. Að auki er WordPress nokkuð auðvelt í notkun með litla sem enga fyrri reynslu af kóðun eða þróun alls staðar á vefnum.

Þetta eru ástæðurnar að baki velgengni sögu WordPress og eru einmitt ástæður næstum því 40 prósent af öllum vefsíðum á veraldarvefnum er knúið af þessum hugbúnaði. 

WordPress hefur fjölda handhægra eiginleika sem gera vefþróun og forritun less flókið og aðgengilegra fyrir alla.

Kynning á WordPress þemuþróun 

Annar vinsæll eiginleiki sem gerir WordPress svo vinsæl er þemu þess. Þemað er einfaldlega safn stílblaða og sniðmát sem skilgreina hvernig WP-knúin síða mun líta út og sýna.

Hugbúnaðurinn veitir notandanum fjölbreytt úrval af mismunandi klippimöguleikum þegar kemur að þemum frá WP admin svæðinu.

Hundruð WordPress þema eru alveg ókeypis eða með mörgum öðrum á sanngjörnu verði upp á nokkra tugi dollara.

Reyndar hýsir WordPress.org risastóran gagnagrunn þema í Þemaskránni sinni.

Aðrar vefsíður eins og Themeforest bjóða einnig upp á mikið af úrvalsþemum frá mismunandi forriturum.

búið til WordPress þema sérsniðið

Hvert þessara þema er með mismunandi útlit, hönnunarmynstur og eiginleika.

Það er notandans að finna einn sem hentar þörfum vefsíðu hans best. Í flestum tilvikum eru þemu gerð með tilteknar atvinnugreinar eða starfsgreinar í huga, sem þýðir að til dæmis veitingahúsaeigendur geta auðveldlega fundið þemu með bókunaraðgerðum.

Þó að það séu fullt af æðislegum þemum sem gætu hentað þínum þörfum, þá er óhætt að segja að ef þú vilt gera eitthvað framúrskarandi þarftu nokkurn veginn að gera það sjálfur. Ef þú getur ekki forritað, gott val möguleiki væri að fara í sjálfstæðan hugbúnaðargerð (verð getur verið mismunandi eftir ýmsum þáttum).

Í þessari grein munum við hins vegar fara yfir ÖLL skref sem nauðsynleg eru til að búa til þitt eigið sérsniðna WordPress þema fyrir WP-knúna vefsíðu þína. Við munum skoða alla mikilvæga þætti til að tryggja að þú fáir það besta sem WordPress hefur upp á að bjóða. 

Að byrja með að búa til þitt eigið þema sem byrjandi gæti við fyrstu sýn virst eins og risastórt verkefni.

Hins vegar er ekki of flókið að búa til sérsniðið þema frá grunni í WP. Þú þarft ekki að vera vefþróun, ef þú hefur grunnatriðin í kóðun með PHP geturðu auðveldlega lært hvernig á að búa til WordPress þema.

Þar að auki getur það verið mjög gefandi að búa til þitt eigið þema, sérstaklega þegar þú sérð lokaniðurstöðuna í beinni á vefsíðunni þinni.

Búðu til fyrsta sérsniðna WordPress þemað þitt

Til að byrja með að búa til WordPress þema þarftu nokkra grundvallaratriði:

  • WordPress vefsíða
  • Góð hýsingaráætlun
  • Smá fyrri reynsla af hlutum eins og staðbundnu sviðsetningarumhverfi
  • Grunnskilningur á CSS og PHP kóðunarmálum
  • Forréttarþema

 

Skilningur á WordPress sniðmátastigveldinu 

Í WordPress eru sniðmátaskrár (byggingareiningar þemans þíns) mátlegar og endurnýtanlegar.

Sniðmát skrár eru ábyrgir fyrir því að búa til síður á WP vefnum þínum. Sumar þessara skrár eru notaðar á næstum öllum síðunum þínum en aðrar eru aðeins notaðar við sérstakar aðstæður.

Líttu á skýringarmyndina hér að neðan - það útskýrir hvernig stigakerfi WordPress sniðmátanna er háttað.

stigveldi wordpress sniðmáts 

Sniðmátaskrár munu ákvarða heildarútlit efnisins á vefsíðunni. Ef þú vilt búa til haus notarðu a header.php skrá, eða ef þú vilt bæta við athugasemdarkafla, notarðu comments.php skrá. 

Til að skilja stigveldi sniðmáta ættir þú að vita að WordPress notar eitthvað sem kallast „fyrirspurnarstrengur“ til að ákveða hvaða sniðmát eða sniðmátasett á að nota til að búa til og birta ákveðna síðu.

Fyrirspurnarstrengurinn er upplýsingar sem eru geymdar í krækjunni á hverjum hluta vefsíðunnar sem þú ert að reyna að breyta. Í einfaldari skilmálum greinir WordPress upplýsingarnar og framkvæmir leit í gegnum stigveldi sniðmátanna til að finna sniðmátaskrá sem passar við upplýsingarnar í fyrirspurnarstrengnum.

Þetta er í grundvallaratriðum kerfi þar sem WP leitar að samsvarandi sniðmátaskrám í hvert skipti sem síðum er hlaðið.

Til dæmis, ef þú slærð inn eftirfarandi slóð http://example.com/post/this-post, WordPress mun finna nauðsynlegar sniðmátaskrár í eftirfarandi röð: 

  1. Skrár sem passa við snigilinn, í þessu tilfelli, þetta-innlegg.
  2. Skrár sem passa við auðkenni færslunnar.
  3. Almenn einskráning eins og single.php.
  4. Skjalasafn, í þessu tilfelli, archive.php.
  5. The index.php skrá.

 

Síðasta skráin (index.php) er krafist í hverju þema, þar sem það er sjálfgefið (eða galli) ef engar aðrar skrár finnast í samsvörunarferlinu. Underscores (WP forréttarþema) eru með algengustu skrárnar. Þessar skrár sem eru í þessu þema virka strax út úr kassanum.

Þú getur breytt þeim ef þér langar til að gera tilraunir eða þarft að búa til einhverja sérsniðna virkni á vefsvæðinu þínu.

Hvað er WordPress byrjendaþema? 

Forréttarþema er bein grundvöllur sérsniðins WordPress þema.

Þú getur notað það sem grunn til að koma þínu eigin einstaka þema í gang. Með byrjendaþema geturðu smíðað þitt eigið sérsniðna WordPress þema án þess að þurfa að hanna eða kóða heilt þema frá grunni.

Starfsþemu WordPress innihalda allar skrárnar eins og þær eru skilgreindar samkvæmt ofangreindu stigveldi.

Með því að nota forréttarþema gerir þú þér kleift að skilja betur hvernig WordPress virkar vegna þess að það sýnir þér grunnatriði, uppbyggingu þema og hvernig mismunandi hlutar vinna saman.

Sérsniðið WordPress þema er hægt að beita á fjölda mismunandi vefsíðugerða frá kynningum og möppum til netverslana byggt með WooCommerce, samfélagsmiðla eða hvað annað sem þú gætir þurft á vefsíðunni þinni að halda.  

Ef þú velur byrjunarþemu (svo sem UnderStrap, Underscores og Bones) mun það hjálpa til við að búa til WordPress þema sem opnar dyrnar að nota ýmsa mismunandi valkosti.

Notkun undirstrikana gæti verið besti kosturinn fyrir byrjendur þar sem það býður upp á mikilvægustu eiginleikana. Það kemur líka frá löngum tíma og áreiðanlegum verktaki. Þetta þýðir að það er líklegra að það sé samhæft, öruggt og áreiðanlegt og mun hafa betri stuðning til lengri tíma litið.

Af hverju ættir þú að nota byrjunarþema

undirstrikar s sérsniðið WordPress þema

Eins og fram kemur hér að ofan er forréttarþema grunnur, teikning sem hjálpar þér að koma með einstaka vefsíðu. Það virkar þegar að fullu en skortir samt lykilatriðin sem gera notendavæna vefsíðu. 

Í meginatriðum þarf það enn að vera stíll og rétt stilltur. 

Að því sögðu eru forréttarþemu tilvalin fyrir þá sem hafa litla sem enga reynslu af WordPress eða vefþróun almennt. Það er frábær leið til að kynnast efni þemagerðar og læra grunnatriði WP-knúinna vefsíðna. 

WordPress byrjendaþema sparar þér tíma og þarf litla sem enga bakgrunnsþekkingu í kóðun og afganginn af WordPress flækjum. 

Þú getur nýtt margra ára mikla vinnu verktaki byrjendaþemans og notað þessar leiðbeiningar til að fá betri skilning á því hvernig WordPress og þemahönnun virka.   

  • Underscores - Áreiðanlegt og frægt forréttarþema sem gefur byrjendum byr í þemuþróun. Undirstrik er frekar einfalt og fullkomið til að byrja strax ef þú hefur öll nauðsynleg tæki. Þemað er frábært til að skilja hugtökin þemaþróun. Undirstrikar snúast um að hefja nýtt verkefni sem ætti frekar að líta á sem verkfærasett sem er í stöðugri þróun og less eins og ramma.

  • Roots - Þetta forréttarþema veitir þér nálgun sem miðar meira að verktaki þar sem álagningin er byggð á HTML5 ketilplötunni. Það styður einnig fullkomnari verkfæri eins og Ræsi og Grunt. Rótarstjarnan þema inniheldur einnig þema umbúðir sem hjálpa þér að halda ferlinu straumlínulagað og útilokar að hringja í sömu sniðmát hlutana ítrekað.

Rætur nota einnig CSS forvinnsluvélar og styðja LESS, afturábak samhæfð tungumálalenging fyrir CSS, sem getur flýtt verulega fyrir þróun þema þíns.

Að því sögðu gefur Roots raunsærri nálgun og þarf aðeins meiri þekkingu frá verktaki.  

6 grunnskref til að þróa WordPress þema þitt

Eftir að hafa farið yfir grunnatriðin ertu loksins tilbúinn til að byrja með að búa til WordPress þema.

Þar sem þessi grein miðar meira að byrjendum munum við nota forréttarþema, en þér er einnig frjálst að búa til allt frá grunni án nokkurra byrjendaþemu.

Ef það er leiðin sem þú vilt fara, ekki gleyma að þú þarft miklu meiri tíma og þarft að sökkva þér aðeins dýpra í kóðun, og þróun vefsins almennt.

1. Setja upp þróunarumhverfið

Fyrsta skref þitt í ferlinu ætti að vera að skapa þróunarumhverfi.

Þetta er í grundvallaratriðum netþjónn sem þú þarft að setja upp á tölvunni þinni til að stjórna og þróa staðbundnar WP síður. Þróunarumhverfi gerir þér kleift að þróa vefsíðu þína á öruggan hátt, auk þess að gefa þér marga möguleika til að búa til nærumhverfi.

Notkun DesktopServer er ein af kjörnum leiðum sem þú getur farið. Það er auðveld leið til að fá staðbundna og hraðvirka útgáfu af WP sem er samhæft við bæði Windows og Mac. Veldu ókeypis útgáfuna, skráðu þig og halaðu henni niður og settu síðan hugbúnaðinn upp.

skrifborðþjónn

 

Þegar þú hefur sett upp skaltu opna forritið og stilla umhverfið þitt.

Það er frekar einfalt ferli og þú munt vera tilbúinn eftir nokkrar mínútur. Eftir uppsetningu muntu hafa vefsíðu og þróunarumhverfi sem bæði mun virka og líta út eins og hvaða lifandi WP vefsíða sem er.

2. Sæktu og settu upp ræsiþema

Einföldustu byrjunarþemu (eins og undirstrikanir) er auðvelt fyrir byrjendur að byrja með.

Andstætt flestum grunnþemum, undirstrikar gerir kleift að sérsníða valkosti með því Ítarkostir (eins og höfundur og lýsing) eftir að hafa nefnt þemað þitt. 

undirstrikar háþróaða valkosti

Þú getur líka bætt við Syntactically Awesome StyleSheets eða SASS sem er forvinnslu CSS tungumál sem gerir þér kleift að kynna eiginleika eins og hreiður, stærðfræðiaðgerðir, nýtingu breytna o.s.frv.

Eftir að þú hefur valið þarftu aðeins að smella á Búa til til að hlaða niður .zip skránni með byrjendaþemunni.

Nú skaltu setja upp skrána á staðnum. Ef þú hefur gert allt rétt, þá geturðu nú séð bein, grunnútgáfu af sérsniðna WordPress þema þínu.

Skilningur á meginreglum WordPress 

Nú þegar grunnatriðin eru sett upp geturðu farið að vinna. Hins vegar, áður en þú kafar í aðlögunarferlið, þarftu að kynna þér meginreglur og íhluti þess að búa til WordPress þema með meginreglum WP. 

Fyrst af öllu verður þú að læra um sniðmátaskrár, helstu byggingareiningar hvers þema í WP.

Sniðmátaskrár ákvarða í grundvallaratriðum hvernig útlit þitt og innihald birtist á vefsvæðinu þínu. Ef þú vilt búa til haus þarftu að nota header.php skrá, meðan comments.php væri notað til að birta einhverjar athugasemdir.

Eins og fjallað var um hér að ofan notar WP sniðmátstigveldi sitt til að ákvarða hvaða sniðmátaskrá það mun velja til að framkvæma það efni sem notandi er að biðja um / þarfnast. Þú getur unnið með þessar skrár eins og þær eru, en í ljósi þess að þú ert hér til að búa til WordPress þema verður meginhluti verksins að laga þessar skrár að þínum þörfum.

 

Þegar við erum að tala um meginreglur WP ættirðu einnig að skilja hugmyndina á bakvið The Loop.

Það er kóðinn sem WP notar fyrst og fremst til að birta efnið þitt og það er að finna í öllu efni sem sýnir sniðmátskrár, eins og index.php or skenkur.php. Það er nokkuð flókið viðfangsefni en sem betur fer fylgir það með byrjendastefinu (ef þú notar undirstrikanir) sem þýðir að ferlið þitt ætti að vera einfaldara. 

Þú verður að skilja hugmyndina og vinna með það. Skoðaðu nokkur dæmi í krækjunni hér að ofan til að skilja betur hvernig lykkjan er notuð og hvernig þú getur sérsniðið kóðann að þínum þörfum.

3. Búðu til þemaupplýsingar

Þemu eru ekki eingöngu snyrtivöruþættir.

Það er fullt af mismunandi eiginleikum sem þú getur bætt við síðuna þína sem getur bætt virkni. Við ætlum að ræða hvernig á að útfæra nokkra grunnþætti til að krydda vefsíðuna þína.

Bæti krókar getur gert þér kleift að keyra mismunandi PHP aðgerðir, birta aðrar upplýsingar eða setja inn stílgögn eftir þörfum.

Krókar eru kóðabútar sem eru settir í sniðmátaskrár. Flestir þeirra eru beint útfærðir sem hluti af kjarna WordPress, en sumir krókar eru ansi gagnlegir þegar einnig er að sérsníða þemu.

Hér er listi yfir algengustu krókana og hlutverk þeirra:

  • wp_head () - er bætt við frumefni í haus.php. Það gerir forskriftir, stíla og aðrar upplýsingar sem keyra þegar vefurinn byrjar að hlaðast.
  • wp_footer () - venjulega bætt við footer.php fyrir tag, oftast notað til að setja inn kóða fyrir Google Analytics eða annan kóða sem þarf að birtast á hverri síðu en er of þungur til að hlaða í hausinn.  
  • wp_meta () - Almennt að finna á sidebar.php og það er oftast notað til að fela í sér viðbótarforrit (til dæmis merkjaský).
  • athugasemdarform () - Bætt við comments.php beint áður en skránni er lokað tag til að sýna athugasemdir. 

Þegar þú notar Underscores verða þessir krókar þegar með þemað, en það er alltaf góð hugmynd að læra meira um þá og sjá alla krókana sem til eru. Krókar leyfa þér að auka möguleika sérsniðna þemans.  

4. Að bæta við stílum með CSS

Cascading Style Sheets eða CSS skilgreinir útlit efnisins á síðunni sem þú ert að búa til.

Með því að nota style.css skrá, sem þegar er innifalin í þema þínu, getur þú breytt einhverjum af þeim stílum sem finnast hér og vistað þá til að sjá hvernig það breytir hönnun þinni. Sjálfgefið er að það innihaldi aðeins grunnhönnunina.

CSS er notað til að gera kynningu og aðgreiningu efnisins á vefsíðunni kleift, allt frá útliti til leturgerða og efnis. CSS getur hjálpað til við að gera efnið á síðunni þinni aðgengilegra og sveigjanlegra.

Að fara í dýpt um hvernig á að nota stíl með WordPress þemum getur orðið ansi loðið og er utan gildissviðs þessarar greinar. Ef þú ert ekki of viss um þetta gætirðu viljað lesa meira um CSS áður en þú heldur áfram.

5. Að meðtöldum JavaScript

Að bæta JavaScript skrám við þemað þitt ef nauðsyn krefur getur aukið gagnvirka eiginleika og getu og haft betri virkni á síðunni. Það kemur sérlega vel þegar þú vilt fella viðbætur frá þriðja aðila inn á vefsíðurnar þínar, eins og tiltekna mynd- eða hljóðspilara, dót eins og renna, stuðning við sprettiglugga og önnur 3. bókasöfn til að búa til háþróaða virkni.

Til að nota Javascript við sérsniðnu síðuna þína geturðu hringt með setningafræði hér að neðan til að bæta handritsskránni við þemað.

Einnig er hægt að nota handritið beint í þinn header.php sniðmátaskrá milli metatákna og stílblaðstengils, eins og þú myndir gera ef um HTML síðu er að ræða. Þegar það er notað í hausskránni ætti það að líta svona út: 

Ef þú vilt nota JS skaltu bæta beint við símtalið fyrir skrárnar eins og hér að neðan. Ef þú vilt setja „sendu þetta til vinar“ lögun geturðu sett það undir titilinn á færslunni. Þetta myndi líkjast þessu: 

" rel="bookmark">

<!--

netpóstur ();

// ->

Þú getur einnig sett forskriftir í notkun með setningafræði sem birtist síðar í þessari grein.

6. Prófaðu þemað og fluttu það út

Þegar þú ert búinn með allt ofangreint er loksins kominn tími til að prófa búið til sérsniðna WordPress þema þitt til að tryggja að það gangi vel.

Í þessum tilgangi er hægt að nota Þemaeiningarpróf Gögn, sett af gervigögnum sem þú getur sett inn á síðuna þína. Gögnin samanstanda af stílbreytingum og öðruvísi efni sem gerir þér kleift að sjá hversu áhrifaríkt þema þitt tekst á við bæði fyrirsjáanleg og óútreiknanleg gögn.

Prófaðu allt vandlega (samkvæmt ofangreindum Codex hlekk) til að þú getir verið viss um að þemað sem þú bjóst til uppfylli nauðsynleg viðmið og standist væntingar þínar áður en það er flutt út.

Þegar þú ert viss um prófunina geturðu flutt þemað út.

Þú getur gert útflutninginn með því að finna staðinn sem þú settir upp vefsíðuþróunarumhverfið á staðnum.

Opnaðu möppuna og opnaðu  / Wp-content / themes /, þar sem þú getur fundið þemað sem þú varst að vinna að.

Nú skaltu búa til a með þjöppunartæki zip.skrá byggt á möppunni með því að þjappa henni saman. Þegar þú ert búinn er allt sem þú þarft að gera að hlaða því upp og setja það upp á hvaða WordPress-síðu sem er. Þú getur einnig sent það til WordPress Þemaskrá

Ítarleg WordPress þemahandbók

Nú þegar þú hefur gert grunnatriðin munu næstu skref telja upp nokkrar frekari upplýsingar um hvernig á að búa til WordPress þema.

Búa til sérsniðnar þemaskrár / möppur

Eins og þú veist nú þegar eru WP þemu búin til úr mismunandi sniðmátaskrám sem í það minnsta munu innihalda a sidebar.php, haus.php.og footer.php. Þú getur hringt í þetta með því að nota sniðmátamerkin (get_header (), þegar hringt er í hausinn, get_sidebar (), þegar hringt er í hliðarstikuna osfrv.).

Þú getur einnig búið til sérsniðnar útgáfur af þessum skrám með smávægilegum breytingum eins og þessum: hliðarstiku-{your_custom_template} .php, haus-{your_custom_template} .php og fótur-{your_custom_template} .php. 

Þú getur líka hringt í sniðmátamerkin með sömu líkingu við sniðmátanafnið sem breytu eins og þessi:

get_header ( 'þitt_sniðna_mynd' ); 

Síður eru búnar til með ýmsum skrám sem þýðir að þú getur líka búið til aðrar sérsniðnar sniðmátaskrár og hringt í þær á hverjum stað á síðunni með því einfaldlega að nota get_template_part (). Gefðu skránni bara viðeigandi nafn og notaðu sömu sérsniðnu aðferðina og með haus-, fót- og skenkurskrár. 

Segjum að þú viljir búa til sniðmát sem sér um efni þitt - þú þarft bara að búa til skrá sem heitir content.php og lengdu síðan skráarheitið til að bæta við sérstöku uppsetningu. Í þessu tilfelli, látum það vera content-product.php.

Að lokum, þegar þú hleður sniðmátaskránni í þemað, þá myndi hún líta svona út:

get_template_part ('content', 'product') ;.

Notkun framkvæmdarstjóra

Til að tengjast þemaskrám notarðu einfaldlega aðgerðina get_theme_file_uri ();

Þessi aðgerð skilar fullri URI í aðalmöppu þemans og þú getur notað það til að vísa í skrár og undirmöppur með því að nota eftirfarandi dæmi:

echo get_theme_file_uri ('myndir / logo.png');

Enqueue handrit og stílblöð

Þegar þú kemur með þitt eigið þema geturðu líka búið til sérsniðin stílblöð og eigin JavaScript skrár líka.

Alltaf þegar þú ert að gera þetta vertu viss um að hlaða þeim með venjulegu WordPress aðferðinni, annars eru líkur á að þema þitt og viðbætur virki ekki rétt undir öllum kringumstæðum.

Allt sem þú þarft að gera er að búa til aðgerð sem umlykur alla stíla og handrit. Fyrir þetta býr WP til bæði handfang og slóð til að finna skrána og ósjálfstæði (ef það er einhver), þegar þetta gerist þarftu að nota krók til að setja inn stílblöð og forskriftir. 

Grunn virka fyrir enqueing stíl:

wp_enqueue_style ($ handle, $ src, $ deps, $ ver, $ media);

Til að skrifa handrit:

wp_enqueue_script ($ handle, $ src, $ deps, $ ver, $ in_footer); 

Afritaðu Google leturgerðir

Google leturgerðir eru frábær ókeypis leturgerð fyrir vefhönnuði og þeim er einfaldlega hægt að bæta við sérsniðna þemað.

google leturgerðir opna sans

Í fyrsta lagi verður þú að finna leturgerð sem þér líkar við á leturgerðarbók Google. Þegar þú hefur fundið leturgerð sem þú vilt vinna með, smelltu einfaldlega á hnappinn „Veldu þennan stíl“ sem færir þig á nýja síðu.

Ef þú flettir hingað niður geturðu fundið leiðbeiningar um notkun þeirra í reit með nauðsynlegum kóða sem þú getur bætt við síðuna þína.   

Þú getur bætt við leturgerðunum annaðhvort með venjulegu og ráðlagðu aðferðinni, eða þú getur valið annað hvort @ import CSS aðferðina eða með Javascript aðferðinni.

Þú getur einnig bætt því við WP með því að setja leturgerðina í þemu þína aðgerðir.php.skrá eða með því að nota tiltekna viðbót.

virka wpb_add_google_fonts () {

wp_enqueue_style ('wpb-google-letur', 'https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,700,300', false);

}

add_action ('wp_enqueue_scripts', 'wpb_add_google_fonts');

Á flestum síðum verður haus, fótur og skenkur eins á öllum síðum. Það er rétt að í sumum tilfellum viltu aðlaga nokkra hluti en almennt eru þeir stöðugir.

Svo að skipta síðunni í haus og fót sem þú vilt klippa og líma úr index.php síðu, viðkomandi hlutar sem ættu að vera í haus / fót og hliðarstiku. Þetta fer svolítið eftir núverandi index.php.

Til dæmis, ef þú notar undirstrikanir, hefur haus og fótur verið þegar skilgreindur rétt í header.php og footer.php.

Höldum áfram þessu dæmi eins og við séum að búa til innihald fyrir hausinn.

Á flestum vefsíðum innihalda hausarnir nauðsynlegan hausstíl og flakk á vefsíðuna.   

Byrjaðu frá Bæta við fyrir lokun . Þú ættir að hafa eitthvað svona. Þetta er byggt á undirstrikunarþemunni en þú gætir viljað laga hausinn eins og nauðsynlegt er til að búa til þínar eigin sérsniðnar.

header.php

 

<?php
/ **
* Hausinn fyrir þemað okkar
*
* Þetta er sniðmátið sem sýnir öll kafla og allt fram til
*
* @hlekkur https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* @ pakki Daves_Theme
*/

?>

>

">


>




<?php
the_custom_logo ();
ef (er_front_page () && is_home ()):
?>
" rel="home">
<?php
Annar :
?>
" rel="home">
<?php
endif;
$ daves_theme_description = get_bloginfo ('lýsing', 'skjá');
ef ($ daves_theme_description || is_customize_preview ()):
?>




<?php
wp_nav_menu (
array (
'theme_location' => 'menu-1',
'menu_id' => 'aðalvalmynd',
)
);
?>

 

Sama ferli ætti einnig að gilda um fótinn.

Notkun Functions.php

Þemað functions.php skrá er sniðmátaskrá í WP þema sem virkar eins og "húsbóndi" sem hlaðast sjálfkrafa bæði fyrir stjórnendur og forsíður síðunnar.

Venjulega skilgreinir það aðgerðir, aðgerðir, síur og flokka sem aðrar sniðmátskrár nota í þemað. Einnig er hægt að nota það til að auka virkni þemans með viðbótar krókum, aðgerðum og síum.

Þú getur auðveldlega fundið functions.php skrána í þemamöppunni. Þú getur bætt innbyggðum WP og venjulegum PHP aðgerðum eins við síur og króka sem þegar eru skilgreind í WP kjarna.

Þú getur einfaldlega búið til function.php skrá með því að búa til texta með einfaldri texta sem þú nefnir functions.php og setja í skráarsafn þemans. Með þessari skrá er hægt að virkja póstsnið, flakkvalmyndir og smámyndir eftir WP aðgerðir og síur. 

Skoðaðu aðgerðirnar.php frá forréttarþema til að sjá nokkur dæmi um hvað er hægt að gera. Þú getur einnig leitað að greinum sem nota aðgerðirnar.php sem lengja aðgerðir WordPress síðu með því að nota aðgerðarskrána.

Notaðu aðalstillingar í þemað

Helstu stillingar gera kleift að breyta ákveðnum þemastillingum án þess að breyta þemaskrám eða þurfa að breyta kóða. Nákvæm lýsing á þessu er utan gildissviðs þessarar greinar, svo við munum vísa þér í nokkrar greinar sem útskýra þetta hugtak í smáatriðum.

  1. Stillingar API lýsing á WordPress Codex.
  2. Heill leiðarvísir fyrir Forritaskil WordPress stillinga

WordPress lykkjan

Eins og við höfum áður fjallað um er lykkjan sjálfgefið kerfi sem WP notar til að birta færslur í gegnum sniðmátaskrár.

Með því að nota lykkjubúnaðinn sækir WP færslurnar á núverandi síðum og formar þær í samræmi við „leiðbeiningarnar“ í lykkjunni.

Í grundvallaratriðum fer það í gegnum færslurnar fyrir núverandi blaðsíður í einu með því að framkvæma aðgerðina sem tilgreind er í þemað. 

Þú getur notað lykkjuna fyrir

  • Birtir efni og athugasemdir
  • Birtir titla og útdrætti á heimasíðu bloggsins
  • Sýna gögn frá sérsniðnum reitum og sérsniðnum pósttegundum
  • Sýnið innihaldið á einstökum síðum með því að nota sniðmátamerki.
  • Sérsniðið lykkjuna til að sýna og vinna með efni í sniðmátaskrám

Ef þú ert að nota undirstrikunarþema Underscores finnurðu WordPress lykkjuna sem er notuð í single.php og page.php skrárnar. Þú gætir viljað skoða þessar skrár til að skilja hvernig það virkar og / eða er hægt að nota.

 

get_header ();
?>

<?php
meðan (have_posts ()):
Pósturinn();

get_template_part ('sniðmát-hlutar / innihald', get_post_type ());

the_post_navigation (
array (
'prev_text' => ' '. esc_html __ ('Previous:', 'daves-theme'). ' % titill ',
'next_text' => ' '. esc_html __ ('Næst:', 'daves-þema'). ' % titill ',
)
);

// Ef athugasemdir eru opnar eða við höfum að minnsta kosti eina athugasemd skaltu hlaða upp athugasemdarsniðmátinu.
ef (comments_open () || get_comments_number ()):
comments_template ();
endif;

enda // Loka lykkjunnar.
?>

<?php
get_sidebar ();
get_footer ();

 

Valmynd og síður

Aðalvalmynd

Þú getur valið aðalvalmyndina þína í WP Menu Editor (staðsett á Útlit - Valmynd). Þemað þitt styður kannski fleiri en einn flakkavalmynd á mismunandi stöðum innan þemans. 

Það eru líka leiðir til að skrá fleiri matseðla, til dæmis gætirðu viljað búa til „fót“ valmynd.

Kíktu á WordPress codex til að skilja hvernig á að gera þetta: https://codex.wordpress.org/Navigation_Menus

Sérsniðin síða

WP leyfir að búa til síður og færslur sjálfgefið. Það stýrir útliti blaðsins í gegnum síðu.php sniðmátaskrá.

Þó að þessi skrá hafi áhrif á allar stakar síður í þema þínu, þá geturðu breytt útliti þeirra og útliti. Að breyta þessum sérsniðnu síðusniðmát í WP krefst smá HTML, PHP og CSS, en enn og aftur ætti það að vera nokkuð einfalt.

Index.php

Þetta sniðmát er sjálfgefið bakslagssniðmát í WordPress til að birta hvaða síðu sem er þegar stigveldi sniðmátsins finnur enga aðra síðu sem passar við þínar breytur.

Þú þarft að nota þetta til að koma til móts við allt sem ekki er meðhöndlað af restinni af sniðmátaskrám.

Archive.php

The archive.php sniðmát er notað til að sýna merki, höfund, flokk og aðrar sérsniðnar skjalasöfn.

Að búa til skjalasíðu getur verið góð leið til að draga allt innihaldið þitt inn á eina síðu.

Flokkur

Í WP vefþróun er ekki óalgengt að nota ýmis sniðmát fyrir flokka, sérsniðnar pósttegundir, flokkunarfræði og merki. Með því að búa til mismunandi sniðmátaflokka geturðu sett mismunandi eiginleika á hverja flokksíðu.   

Dæmigert category.php sniðmát mun líta svipað út og þetta:

<?php

/ **

* Einfalt flokkasniðmát

*/

get_header (); ?>

<?php

// Athugaðu hvort einhverjar færslur séu til sýnis

ef (have_posts ()):?>

Flokkur:

<?php

// Sýna valkvæða flokkalýsingu

 ef (flokkur_lýsing ()):?>

<?php

// Lykkjan

while (have_posts ()): the_post (); ?>

eftir

 <?php

  comments_popup_link ('Engar athugasemdir ennþá', '1 athugasemd', '% athugasemdir', 'athugasemdir-tengill', 'Athugasemdir lokaðar');

?>

<?php endwhile;

annað:?>

Því miður, engar færslur passa við skilyrðin þín.

Skenkur.php

Skenkurinn er svæðið þar sem þú getur sett græjurnar þínar í WP þema. Oftast en ekki er það hægra megin eða fyrir neðan efnið þitt á öllum síðum.

Skenkur eru notaðir til að sýna hluti sem eru ekki beint tengdir færslu eða innihaldi síðunnar en efni eins og krækjur á mismunandi svæði á síðunni þinni, skráningarform, auglýsingar, tenglar á samfélagsmiðla og svo framvegis.

Venjulega er skenkurinn notaður í tengslum við WP búnað.   

Hér er hvernig þú getur bætt við grænu tilbúinni hliðarstiku við þemað þitt:

virka wpb_widgets_init () {

    register_sidebar (array (

        'name' => __ ('Main Sidebar', 'wpb'),

        'id' => 'skenkur-1',

        'lýsing' => __ ('Aðal hliðarstikan birtist til hægri á hverri síðu nema forsíðu sniðmát', 'wpb'),

        'before_widget' => ' ',

        'after_widget' => ' ',

        'before_title' => ' ',

        'after_title' => ' ',

    ));

    register_sidebar (array (

        'name' => __ ('hliðarstika forsíðu', 'wpb'),

        'id' => 'skenkur-2',

        'lýsing' => __ ('Birtist á kyrrstæða forsíðu sniðmátinu', 'wpb'),

        'before_widget' => ' ',

        'after_widget' => ' ',

        'before_title' => ' ',

        'after_title' => ' ',

    ));

    }

add_action ('widgets_init', 'wpb_widgets_init');

Einstök póstsíður (single.php)

Segjum að þú viljir nota annað sniðmát eða útlit fyrir ákveðna grein á vefsíðunni þinni.

Fyrir þetta þarftu að búa til sérsniðið sniðmát fyrir eina færslu. Þetta er nokkuð svipað og að búa til sérsniðnar síður. Með því að fylgja grunnleiðbeiningunum sem þar eru notaðar geturðu auðveldlega búið til einstök innlegg líka. 

Til að bæta við stuðningi við úrvals myndir skaltu einfaldlega bæta eftirfarandi kóða við þemað functions.php file:

add_theme_support ('eftir smámyndir'); 

Nú geturðu farið á síðurnar þínar eða færslur og athugað hvort valkostur myndarinnar sé til staðar. Líkurnar eru á því að WP birti það ekki sjálfkrafa, svo að til að sýna myndina gætirðu þurft að gera smá breytingar á sniðmátunum þínum þar sem síður og færslur birtast með því að bæta þessum kóða:

Pagination 

Þessi aðgerð gerir þér kleift að fletta fram og til baka í gegnum vefsíðurnar þínar. Þú getur notað þennan möguleika þegar þú skoðar færslulista með fleiri færslum en geta passað á einni síðu eða þegar þú vilt brjóta upp lengri færslur með því að nota tag.

Einfaldasta form pagination er að setja posts_nav_link (). Virka í sniðmátinu á eftir lykkjunni. Þetta býr til tengla bæði á næstu færslusíðu (þegar þú ert að brjóta upp póstlista) og á fyrri færslur þar sem við á.  

posts_nav_link ();

Þú getur líka notað next_posts_link & prev_posts_link til að stjórna hvar fyrri og næsta póstsíðutengill birtist.

next_posts_link ();

previous_posts_link ();

Comments 

Athugasemdir eru nauðsynlegur hluti af hverju bloggi eða síðu. Það gefur gestum vefsíðu möguleika á að ná til þín, gefa álit, spyrja spurninga og almennt skapa dýpri tengsl við vefsíðu þína og innihald.

Allar athugasemdir birtast á admin svæðinu og það eru nokkrir möguleikar sem þú getur bætt við, allt frá því að gera athugasemdir aðeins mögulegar fyrir tiltekna notendur til að stjórna athugasemdum.

Þú getur notað comments.php skrána til að sérsníða útlit og tilfinningu ummæla í þema þínu.

Aðrar síður og skrár 

Það fer eftir þörfum þínum, þú getur fundið eða búið til mismunandi síður og skrár og getur sniðið þær að óskum þínum með því að nota sömu eða svipaðar leiðbeiningar og nefndar eru hér að ofan. 

Notkun foreldra / barnsþema

Foreldraþema

Foreldraþemu í WP eru þemu sem eru lýst yfir „foreldrar“ af öðrum þemum, þ.e. barnaþemum.

Barnþema er notað til að leyfa hönnuðum og forriturum að búa til sérsniðna þema án þess að brjóta möguleika á að uppfæra foreldraþemað. Þetta er vegna þess að ef verktaki breytir upprunalegu þemaskrám, þá tapast breytingarnar þegar hann framkvæmir þemauppfærslu.

Hins vegar miðla þemu foreldra eiginleikum sínum og virkni til barnaþema þeirra. Hönnuðum er frjálst að gera breytingar á virkni og þætti barnsþemans án þess að hafa áhrif á uppfæranleika foreldraþemans.

Barnaþema

Barnaþemu erfa virkni foreldraþemanna. Þeir eru fyrst og fremst notaðir til að breyta núverandi þema án þess að tapa neinum áður bættum sérsniðnum stíl við þemauppfærslur.  

Þemu barna flýta fyrir þróunarferlinu vegna þess að auðvelt er að búa til breytingar með þeim.

Flest þemu munu búa til barnþema og gera það aðgengilegt með þemað, svo að allir sem nota þemað geti sérsniðið það í gegnum barnþemað. Við skilgreinum hvernig á að búa til barnþema, í grein okkar hér.

Nota þróunarramma

Þetta hugtak vísar til kóðasafna sem notuð eru við þemagerð. 

Þróunarumgjörðir voru búnar til til að þjóna sem foreldraþemasniðmát með öllum virkni. Í grundvallaratriðum, eins og með þemu foreldra, eru rammar ósnortnir meðan verktaki getur framkvæmt breytingar á þemum barna.

Þetta gerir þróun hraðari og auðveldar að losna við villur í sérstökum þemaramma. Meðal athyglisverðra ramma um þróun eru: Umgjörð Genesis þema, Themify og Divi eftir Elegant Themes.

Umbúðir um hvernig á að búa til WordPress þema

Ofangreint hefur verið nákvæm skref fyrir skref leiðbeiningar til að byrja með að þróa þitt eigið WordPress þema.

Allt í allt, þó að þú þurfir að hafa góðan skilning á WordPress og PHP, þá er það ekki svo krefjandi ferli. Að þekkja grundvallaratriði vefþróunar er mikilvægt og þú getur skilið WordPress kjarna nánar þegar þú þróast. Ef þér líður ekki ennþá í því verkefni, þá er það allt í lagi, taktu þér tíma og gerðu smá tilraunir.

Þegar þú hefur gert nokkur mistök byrjarðu að læra meira og meira. Það er líka gott að skoða kóðagrunn annarra vinsælla þema til að skilja hvað þeir eru að gera og fá góða hugmynd um starfshætti sem eru skynsamlegir.

Láttu okkur vita ef þú hefur einhverjar spurningar í athugasemdunum hér að neðan.

Um höfundinn
David Attard
Höfundur: David AttardVefsíða: https://www.linkedin.com/in/dattard/
David hefur starfað í eða við net- / stafræna iðnaðinn síðustu 18 ár. Hann hefur mikla reynslu af hugbúnaðar- og vefhönnunargeiranum með því að nota WordPress, Joomla og veggskot í kringum þau. Sem stafrænn ráðgjafi er áhersla hans lögð á að hjálpa fyrirtækjum að ná samkeppnisforskoti með því að nota sambland af vefsíðu þeirra og stafrænum kerfum sem eru í boði í dag.

Eitt í viðbót... Vissir þú að fólk sem deilir gagnlegu efni á borð við þessa færslu lítur ótrúlega líka út? ;-)
vinsamlegast yfirgefa a gagnlegt skrifaðu athugasemdir við hugsanir þínar, deildu þessu síðan á Facebook hópinn þinn / hverjum sem myndu finnast þetta gagnlegt og við skulum uppskera ávinninginn saman. Takk fyrir að deila og vera fín!

Birting: Þessi síða getur innihaldið tengla á ytri vefsíður fyrir vörur sem við elskum og mælum af heilum hug. Ef þú kaupir vörur sem við leggjum til gætum við unnið okkur inn tilvísunargjald. Slík gjöld hafa ekki áhrif á ráðleggingar okkar og við tökum ekki við greiðslum fyrir jákvæða dóma.

Höfundur (ar) Valin þann:  Merki tímarits Inc   Sitepoint merki   CSS bragðarefur merki    vefhönnunarpottamerki   WPMU DEV merki   og margir fleiri ...