Në këtë artikull, ne do të mësojmë se si të krijojmë një temë wordpress. Së pari, ne do të krijojmë një shabllon HTML + CSS që do ta vendosim në strukturën e temës sonë të wordpress. Pasi të keni mbaruar së lexuari këtë artikull, mund të krijoni shabllonin tuaj për wordpress, ose më mirë, do ta krijoni ndërsa lexoni dhe përfundoni ushtrimet praktike. Ju do të dini se si funksionon tema dhe do të jeni në gjendje të zbatoni në mënyrë të pavarur thelbin e temës së wordpress nga shabllonet e tjerë HTML / CSS. Le të fillojmë?
Hyrje - struktura e temës së wordpress
Struktura e një teme wordpress është jashtëzakonisht e thjeshtë. Në temë kemi një dosje indeks.php, ai është përgjegjës për montimin e pjesëve të shabllonit. Të tjerët janë të lidhur me këtë skedar: kokë.php,fundi i faqes.php... Këto skedarë (pjesë të shabllonit) përdoren në çdo faqe të faqes. Ne e dimë që jo të gjitha faqet janë ndërtuar sipas të njëjtit shabllon, kështu që tema e wordpress ka skedarë të tjerë, si p.sh. arkivat.php ose beqare.php... Ju gjithashtu mund të krijoni llojin tuaj të faqeve nëse dëshironi që ato të jenë krejtësisht të ndryshme nga të tjerët në faqe. Është shumë komode.
Nëse shqyrtoni me kujdes strukturën e temës dhe lexoni përmbajtjen e skedarëve, do të kuptoni intuitivisht se çfarë është ajo. Por ka ende disa pika që ne do të shqyrtojmë. Gjithmonë mund të ktheheni në këtë faqe dhe të lexoni se si është bërë gjithçka.
Tani le të shohim krijimin e një shablloni në faza:
Hapi 1 - style.css
Një skedar CSS është një skedar i parametrave dhe zgjidhjeve të projektimit për elementët e shabllonit HTML. Ju duhet të riemërtoni skedarin kryesor css (nëse keni më shumë se një) në stil.css... Më pas, duhet të shtoni informacionin e komentuar në vijim në fillim të këtij skedari:
/ * Emri i temës: Typography Paramount Theme URI: http: // sajti / Përshkrimi: Një shabllon pa imazhe që fokusohet te Tipografia..0. Komentet e përgjithshme / Deklarata e Licencës nëse ka. ... * /
Ky kod do të tregojë informacionin e temës për administratorët. Sigurohuni që të jetë në fillim të skedarit dhe të mos ketë karaktere të hapësirës së bardhë përpara tij!
Më pas, krijova një skedar tjetër të quajtur 1. css, dhe vendoseni në dosje tipografia-parësore të cilin e kam krijuar në dosjen wordpress të temës. Është e nevojshme t'i përmbaheni rreptësisht kësaj strukture në mënyrë që wordpress të mund ta shohë këtë skedar.
Hapi 2 - koka dhe fundi
Në këtë hap, ne do të krijojmë dy skedarë: kokë.php dhe fundi i faqes.php përmendur më parë. Megjithëse nuk janë bazë dhe janë opsionale në temë, ato përdoren në shumicën e shablloneve, kështu që ne do t'i krijojmë ato.
Header.php
Le të fillojmë me këtë skedar. Krijoni një skedar dhe vendosni një emër kokë.php, më pas ngjisni kodin e dhënë në të dhe ruajeni. Ky skedar do të shfaqet në të gjitha faqet e shabllonit tonë.
Një shabllon pa imazhe që fokusohet në tipografi.
Tipografia është parësore
Deri më tani, nuk ka pasur asgjë të veçantë për një temë të thjeshtë html / css. Por tani do të zëvendësojmë disa nga elementët me etiketat e wordpress.
>
/">
Këto janë vetëm disa nga etiketat që njoh. Do të gjeni shumë më tepër në faqen zyrtare të internetit: codex.wordpress.org.
gjuha_atributet ()- Nxjerr llojin e gjuhës për etiketën .
bloginfo ()- Përdoret për të shfaqur informacione rreth sajtit, të gjithë parametrat mund të gjenden në kodin e WordPress.
wp_title ()- Kthen titullin e faqes.
wp_head ()- përfshin javascript dhe elementë të tjerë të nevojshëm.
get_option ()- merr opsionet e nevojshme për të punuar me bazën e të dhënave.
Footer.php
Tani le të krijojmë të ashtuquajturin "futer faqesh". Krijo një skedar fundi i faqes.php dhe vendosni kodin e mëposhtëm në të. Ky footer do të shfaqë vitin, emrin e faqes dhe lidhjet rss.
phpe_koha ("Y ");?>- tregon vitin aktual.
- emri i blogut.
- duke shtuar një lidhje në burimin rss të blogut.
wp_footer ()- kjo është e nevojshme për vetë thelbin e wordpress-it, i cili shton elementet që i nevojiten aty.
Hapi 3 - skedari kryesor i shabllonit të wordpress
Është koha për të krijuar një skedar bazë shabllon wordpress që do të përfshijë pjesën e sipërme dhe të poshtme të faqes. Krijo një skedar indeks.php... Ky është një nga dy skedarët e kërkuar me temë wordpress (tjetri është style.css). Ngjitni skedarin e krijuar rishtazi me kodin e mëposhtëm:
Ky kod e ndihmon wordpress-in të marrë informacion se ku të lidhet kokë.php dhe fundi i faqes.php... Le të shtojmë disa rreshta të tjerë midis këtyre etiketave:
">
në | |
Ups...
Na vjen keq, nuk u gjet asnjë postim.
Ky copë kodi merr informacione rreth postimeve të disponueshme në blog dhe, nëse ka, i shfaq ato. Nëse ato nuk gjenden, atëherë pjesa e kodit shfaqet pas gjë që na bën të kuptojmë se blogu është ende bosh.
Shtoi gjithashtu etiketën i cili shfaq lidhjet e navigimit në mënyrë që përdoruesit të mund të lexojnë postimet e shtuara më parë.
Një shembull se si funksionon një temë wordpress
Tani që kemi një pamje të ngjashme të një teme, le të shohim një shembull se si funksionon tema e krijuar e wordpress.
Ne kemi katër skedarë në temën tonë, kjo është mjaft e mjaftueshme për një fillim. Në artikullin tjetër, ne do të shtojmë skedarin beqare.php që do të shfaqet kur shfaqet një postim specifik. Ky skedar do të përfshijë, ndryshe nga skedari indeks.php.
Nëse keni ende pyetje ose keqkuptime në lidhje me krijimin e një shablloni (teme) të wordpress-it, shprehni shqetësimet tuaja në komentet më poshtë!Nëse dëshironi që faqja juaj wordpress të duket premtuese, atëherë së pari duhet të mendoni për krijimin e një teme unike për të. Ky proces është mjaft i mundimshëm, sepse lidhet drejtpërdrejt me kodime dhe skripte të ndryshme. Le ta heqim nga e para.
Pothuajse çdo temë wordpress është e instaluar në drejtorinë wp-content / themes dhe përbëhet nga 3 kategori skedarësh:
- skedarë të fletës së stilit;
- skedarë funksionaliteti shtesë;
- skedarët e shablloneve.
Skedarët e fletës së stilit janë style.css. Ata janë përgjegjës për ngjyrën, madhësinë, fontin dhe parametrat e tjerë të elementeve të faqes. Çdo sajt ka vetëm 1 skedar style.css. Nëse hapni këtë skedar, atëherë në krye mund të shihni informacione rreth titullit, autorit dhe një përshkrim të shkurtër të temës. Kur krijoni temën tuaj, mund të futni informacione për veten tuaj në style.css.
Kategoria tjetër janë skedarët e funksionalitetit shtesë. Këtu përfshihen funksionet.php, parimi i të cilit e bën atë të duket si një shtojcë. Falë këtij skedari, ju mund ta personalizoni vizualisht temën pikërisht në panelin e administratorit. Zakonisht, lista e cilësimeve nuk është shumë e gjerë (emri i faqes, ngjyra e navigimit dhe panelet anësore të faqes, e kështu me radhë). Nëse tema është shumëfunksionale, atëherë lista e cilësimeve do të jetë shumë më e gjerë.
Tani le të kalojmë te skedarët e shablloneve. Funksioni i tyre kryesor është të gjenerojnë faqe që kërkohen nga vizitorët e faqes. Skedarët e shabllonit kanë shtesën ".php". Shumica e temave bazë mund të përmbajnë vetëm një skedar shabllon të quajtur index.php. Në këtë rast, të gjitha faqet e faqes do të jenë identike. Ky dizajn përdoret më shpesh për të krijuar burime të internetit me baza të të dhënave, kur dizajni nuk luan një rol kyç.
Nëse nuk keni bërë kurrë një dizajn më parë, duhet të provoni fillimisht të krijoni një temë të thjeshtë. Për funksionimin normal të tij, ju nevojiten të paktën 2 nga skedarët e mëposhtëm: style.css dhe index.php.
Skedarët e funksionalitetit shtesë në këtë rast nuk mund të përdoren, siç e kuptoni. Ndër skedarët e shablloneve, index.php është një nga më fleksibilët. Mund të gjenerojë në mënyrë të pavarur tituj, blloqe të ndryshme, funde (futer), përmbajtje dhe elementë të tjerë të faqes.
Vlen të përmendet se ato parametra që nuk gjenerohen nga skedari index.php do të gjenerohen nga skedarët standardë. Për shembull, nëse tema juaj përbëhet nga vetëm 2 nga skedarët e mësipërm, por përdoruesi ka nevojë të gjenerojë një formular për shtimin e komenteve, atëherë ky funksion do të kryhet nga standardi comments.php. Prandaj, nëse dëshironi që tema juaj të jetë më unike, atëherë ia vlen të krijoni skedarë shtesë shabllonesh. Le të shqyrtojmë ato kryesore.
- Për të shtuar komente, e keni marrë me mend, përdoret shablloni comments.php.
- Nëse dëshironi të krijoni një dritare kërcyese me komente, atëherë për qëllime të tilla keni nevojë për komente-popup.php.
- Për të gjeneruar faqen kryesore, përdoret home.php.
- Skedari single.php është përgjegjës për shfaqjen e artikujve të sajtit. Nëse nuk keni një skedar të tillë, atëherë index.php do të ekzekutojë funksionin e tij.
- Skedari page.php gjeneron faqe individuale të faqes.
- Për të shfaqur informacione rreth autorit, ju duhet autor.php.
- Category.php është përgjegjës për kategoritë.
- Shfaqja e arkivave, datës dhe kërkimit kryhet nga skedarët archive.php, date.php dhe search.php përkatësisht.
- Në mënyrë që faqja juaj të shfaqë një faqe unike të gabimit 404, do t'ju duhet të shtoni 404.php tuaj.
- Fundi dhe fundi i faqes krijohen nga skedarët header.php dhe footer.php, përkatësisht.
Krijimi i një teme unike me dorë nga e para
Së pari ju duhet të instaloni një shabllon të përshtatshëm. Mund të gjendet si në faqen zyrtare të internetit wordpress.org ashtu edhe gjetkë. Rekomandohet përdorimi i faqes zyrtare, sepse çdo palë e tretë mund të përmbajë skedarë me qëllim të keq dhe lidhje të prishura.
Pasi të keni bërë zgjedhjen tuaj, mund të filloni të shkarkoni arkivin. Në fund të procesit, do t'ju duhet ta shpaketoni dhe të ngarkoni skedarët në dosje specifike në sit (arkivi zakonisht përmban një udhëzim të vogël). Shkarkimi mund të bëhet duke përdorur programin FileZilla ose direkt nga hosti, nëse e mbështet këtë opsion. Tani ju vetëm duhet të shkoni te seksioni "Tema", zgjidhni atë që keni shkarkuar dhe klikoni në butonin "Aktivizo".
Ju gjithashtu mund ta zgjidhni atë direkt në panelin e administrimit të wordpress. Në këtë rast, nuk keni nevojë ta shkarkoni. Thjesht duhet të klikoni në butonin "Instalo" dhe më pas "Aktivizo". Përpara instalimit, sugjerohet të kryeni një vrojtim.
Tani që tema është aktivizuar, mund të kaloni në unifikimin e saj. Hapi i parë është të mendoni për pjesën e sipërme të faqes (header). Kjo është gjëja e parë që bie në sy të vizitorëve tuaj, ndaj duhet ta merrni me përgjegjësi. Në mënyrë tipike, titulli përbëhet nga emri i faqes, logoja dhe informacioni i shkurtër rreth përmbajtjes. Kreu mund të krijohet në çdo redaktues grafik. Edhe në Paint standarde. Dizajnerët më të avancuar përdorin Adobe Photoshop.
Emri i faqes duhet të jetë i shkurtër dhe i lehtë për t'u mbajtur mend. Ka shumë stile të ndryshme nga të cilat mund të zgjidhni në Adobe Photoshop. Kur krijoni një logo, mund t'ju duhen forma të ndryshme. Ato mund të shkarkohen nga faqja zyrtare e Adobe Photoshop.
Pasi të bëni një vizatim të kokës në një redaktues grafik, do t'ju duhet ta ngarkoni në faqen tuaj të internetit. Kur shkarkimi të përfundojë, një URL do të shfaqet në të djathtë të imazhit dhe do të duhet të kopjohet. Pastaj duhet të shkoni te seksioni "Editor" dhe të zgjidhni skedarin që është përgjegjës për gjenerimin e kokës (header.php). Në të, do t'ju duhet të gjeni URL-në e imazhit aktual dhe ta zëvendësoni atë me atë që keni marrë kur ngarkoni imazhin e kokës. Pas kësaj, do t'ju duhet të përditësoni skedarin. Tani mund të vazhdoni të kontrolloni shfaqjen e kokës.
Nëse titulli juaj ka parametra të tjerë nga ai standard, atëherë ato mund të rregullohen në header.php. Gjerësia kontrollohet nga atributi gjerësi, dhe lartësia kontrollohet nga lartësia. Rregullimet mund të bëhen në piksel dhe përqindje. Pra, nëse thjesht dëshironi të zgjasni kapakun, atëherë vendoseni në 100%.
Nëse dëshironi, mund të shtoni lidhje aktive në faqet e faqes wordpress në kokë. Kjo mund të bëhet duke përdorur shërbime të ndryshme. Ka shumë prej tyre në internet. Shumica e tyre punojnë në të njëjtin parim. Ju përshkruani zonën e dëshiruar të kokës, e cila do të rezervohet për lidhjen dhe shërbimi do t'ju japë kodin që ju nevojitet. Pastaj do t'ju duhet të shtoni këtë kod në skedarin tuaj header.php. Kini kujdes kur e shtoni. Çdo pikë ka rëndësi. Nëse e shtoni kodin në vendin e gabuar, lidhjet aktive nuk do të shfaqen në kokë.
Pas zëvendësimit të kokës standarde, mund të filloni të zëvendësoni sfondin e parazgjedhur të faqes wordpress, miniaplikacionet, navigimin, fundin e faqes dhe komponentët e tjerë të sajtit wordpress. Ato gjithashtu mund të vizatohen në çdo redaktues grafik dhe të ngarkohen në sit në formën e një fotografie.
Me ju vlen të merret parasysh se nuk duhet të jetë e ndritshme. Shumica e webmasterëve preferojnë të përdorin një sfond të bardhë. Nuk i dëmton sytë dhe nuk shpërqendron nga përmbajtja kryesore.
Për të krijuar lundrim cilësor nga e para, ju duhet pak njohuri për etiketat si p.sh