Kjo u ndodh të gjithëve.

Ju gjeni një temë që ju pëlqen, e instaloni dhe kaloni disa muaj duke shijuar pamjen e faqes tuaj. Por më pas, pas disa muajsh, tema fillon të duket bajate. Pak i mërzitshëm.

Problemi i vetëm është se nuk doni të kaloni disa orë duke kërkuar diçka të re. Sikur të kishte një mënyrë për t'i shtuar pak erëz temës suaj, pak ndezje për ta bërë atë të dallohej.

Para se të ngrini duart lart në dëshpërim, më lejoni t'ju tregoj një mënyrë të thjeshtë për të shijuar temë pa shumë përpjekje dhe pa shtuar imazhe të panevojshme që mund të ngadalësojnë faqen tuaj.

Fut Dashicons. Dashicons janë ikona të shkronjave që u prezantuan në WordPress 3.8. Ato janë ato ikona të mrekullueshme dhe të lezetshme që shihni kur hyni në pultin tuaj. A nuk do të ishte mirë nëse mund t'i shtoni ato në temën tuaj gjithashtu?

Epo, ju mundeni dhe unë do t'ju tregoj se si.

Si mund t'i përdorni Dashicons në tuaj menyja e navigimit?

Le të fillojmë me një shembull të thjeshtë. Dashicons janë përfshirë tashmë në WordPress që nga versioni 3.8, por ju duhet t'i përfshini ato për t'i bërë ato të shfaqen siç duhet në pjesën e përparme të faqes tuaj; që është, tema juaj.

Hapi 1: Bëjeni gati Dashicons-in tuaj të temës

Për ta bërë gati temën tuaj Dashicons fillimisht hapni skedarin tuaj functions.php (gjendet te Appearance> ;Redaktori – si parazgjedhje do të hapë skedarin CSS të temës suaj aktuale. Vazhdoni dhe kërkoniskedarin functions.php dhe klikoni mbi të për ta ngarkuar në Redaktues.)

Hapi 2: Vendosni skriptin në radhë

Lëvizni deri në fund dhe ngjitni këto rreshta i kodit në fund:

//Enqueue the Dashicons script add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' ); function load_dashicons_front_end() { wp_enqueue_style( 'dashicons' ); }

Në rregull! Tani tema juaj është gati për të përdorur Dashicons.

Hapi 3: Shtimi i Dashicons te artikujt e menysë

Le të shtojmë një Dashicon për lidhjen tuaj të Shtëpisë. Shkoni te faqja e internetit e Dashicons dhe zgjidhni ikonën që ju pëlqen.

Përditësim: Dashicons ishin fillimisht të disponueshëm në GitHub.io, por që atëherë ato janë vënë në dispozicion në WordPress.org.

Hapi 4:

Klikoni në ikonën e dëshiruar (në këtë rast zgjodha ikonën e shtëpisë) dhe më pas klikoni në Kopjo HTML. Do t'ju japë një dritare kërcyese me kodin që ju nevojitet.

Hapi 5:

Kthehuni te paneli juaj i WordPress-it, kliko te Paraqitja > ; Menu dhe ngjit kodin pikërisht aty ku thotë Etiketa Navigimi.

Nëse ende dëshiron që fjala të shfaqet, shtype atë pas mbylljes së kllapave div.

Kliko në ruajeni dhe ngarkoni faqen tuaj kryesore. Lidhja juaj e shtëpisë tani duhet të shfaqë një Dashicon të bukur dhe të qartë.

Këtë mund ta bëni për të gjithë artikujt e menysë së navigimit ose vetëm për shtëpinë. Thjesht përsëritni hapat e mësipërm me ikonat që përputhen. Ishte e lehtë apo jo?

Si i përdorni Dashicons në post meta?

Mund të shkoni një hap më tej dhe të shtoni Dashicons në meta-në tuaj të postimit, ose me fjalë të tjera të shtoni Dashicons përballë metës së autorit emri, data, kategoria ose etiketa; varet ngatemën tuaj dhe informacionin që shfaq.

Meqenëse tashmë keni vendosur Dashicons në temën tuaj, gjithçka që duhet të bëni tani është të hapni skedarin tuaj style.css (ose të përdorni redaktuesin e personalizuar CSS që është gjithmonë një opsion më i mirë, kështu që ju mos i humbisni ndryshimet pasi tema juaj të përditësohet!), gjeni përzgjedhësin që përputhet dhe shtoni kodin CSS.

Le të themi se dëshironi të shtoni një ikonë përpara emrit tuaj ose emrit të autorit tuaj.

Hapi 1:

Së pari do të zgjedhim një ikonë që do të donim.

Hapi 2:

Më pas klikoni mbi të dhe këtë herë zgjidhni Kopjo CSS. Përsëri, do t'ju japë një dritare kërcyese me kodin që duhet të ngjitni.

Hapi 3:

Tani hapni stilin tuaj.css dhe gjeni përzgjedhësin përkatës, në këtë rast – .hyrje-autor. Duke shtuar :para dhe më pas duke ngjitur kodin CSS që keni kopjuar nga faqja e internetit Dashicons, emri i autorit do të ketë një ikonë të bukur përpara tij. Ju gjithashtu duhet të specifikoni se jeni duke përdorur fontin Dashicons. Kodi i modifikuar duket kështu:

.entry-author:before { font-family: "dashicons"; content: "\f110"; }

Le të shtojmë edhe pak stil, dhe tani kodi i përfunduar duket kështu:

.entry-author:before { font-family: "dashicons"; content: "\f110"; color: #f15123; display: inline-block; -webkit-font-smoothing: antialiased; font: normal 20px/1; vertical-align: top; margin-right: 5px; margin-right: 0.5rem; } 

Rezultati përfundimtar

Pra çfarë do të duket kështu në fund?

Diçka si kjo:

Ka shumë mënyra se si mund të përdorni Dashicons – lëreni kreativitetin tuaj të pushtojë dhe shikoni se çfarë mund të bëni.

Duke i bashkuar të gjitha së bashku

Përveç shembujve të mësipërm, mund të përdorni Dashicons në backend tuaj për të specifikuar të ndryshmeikona për lloje të ndryshme postimesh, ose mund t'i përdorni në titujt e postimeve tuaja, titujt e miniaplikacioneve ose nëse po krijoni një faqe të personalizuar uljeje, mund të dalloni midis faqeve të ndryshme të faqes tuaj.

Këtu është një shembull bazë i asaj që ju mund t'i përdorni ato për të krijuar: