Stvorite kratke kodove za našu WordPress temu

Otkad smo započeli s ovim projektom, uvijek smo željeli da on ima svoju etiketu, i zato je drugi predložak u kojem se koristimo FromLinux, stvorili smo ga mi 100%.

Zatim su uslijedile druge verzije, i premda možemo kupiti ili unajmiti određene web usluge da bismo kreirali svoje dizajne poput onih StudioDWeb.comili kupite predloške već kreirane u ThemeForest.net, oduvijek smo željeli imati svoje, prilagođeno našim potrebama i navratiti WebDevelopment.com može biti od pomoći 😀

U svakom slučaju, zaljubljujem se u web dizajn i razvoj i već radim na novoj temi za FromLinux i pokazat ću vam nekoliko snimaka zaslona kako to izgleda.

Ideja nije da izađemo iz onoga na što smo već prilagođeni, pa mnogi elementi ostaju isti ili na sličan način. Počinjem sa početnom stranicom

I ovako bi članci izgledali:

Kao što vidite, odgovara našoj mjeri, a mi smo uključili novo kratki kodovi za razradu članaka.

Zbog toga mi je palo na pamet da podijelim s vama kako stvoriti jedan od njih (onaj informativni) u slučaju da ih želite uključiti u svoje teme WordPress. Mislim, otprilike ovako:

Nisam stručnjak za programiranje s ovim CMS-om, pa neću pokušavati objasniti zašto i kako to funkcionira na ovaj način, nego ću vam pokazati kako se to radi, tačka.

Za to koristimo „švicarski vojni nož“ od WordPress, Mislim na datoteku function.php koje obično nalazimo u gotovo svim temama.

Primjer Function.php s kratkim kodovima DesdeLinux-a

U ovoj datoteci ćemo dodati strukturu našeg ShortCode-a i naravno oznaku koja ga prikazuje. Pa krenimo na to.

Unutar funkcije.php

Unutar naše datoteke function.php stavit ćemo HTML strukturu ShortCode-a, ali nije jednostavno staviti HTML oznake tek tako. Imali bismo otprilike ovako:

// Infokutija info funkcije ($ atts, $ content = null, $ code = "") {$ return = ' '; $ return. = $ sadržaj; $ return. = ' '; return $ return; } // Kratki kod add_shortcode ('info', 'infobox');

Odavde razjašnjavamo nekoliko stvari. Prvo, kada koristimo dvije trake, stoga komentiramo crtu // info to je samo komentar.

Ime funkcije, u ovom slučaju infokutija Može se promijeniti u bilo što što želimo, ali mora odgovarati imenu koji koristimo u posljednjem retku.

Primjer:

$ return. = $ sadržaj;

Promenljiva $ sadržaj gdje sadržaj koji stavimo u ShortCode ide prema zadanim postavkama, vratit će null vrijednost ako ništa ne stavimo.

Sada smo postavili ime ShortCode-a:

add_shortcode( 'info', 'infobox' );

Gdje se možete presvući info za ono što želimo. Sada, da bi izgledalo kao primjer, moramo dati:

[ info ]Este será el ShortCode de ejemplo[ /info ]

Iako naravno, bez razmaka, koje sam stavio, jer bi očito ShortCode bio aktiviran.

Stil kratkog koda

Ako pogledate gornji redak, bez PHP koda i varijabli, ShortCode u čistom HTML-u izgledao bi otprilike ovako:

<div class="alert-info"></div>

Dakle, moramo primijeniti samo CSS stil.

.alert.alert-info {background: # d9edf7 url (info.png) bez ponavljanja 7px 50%; radijus granice: 4px; obrub: 1px solid # bce8f1; boja: # 3a87ad; veličina fonta: 14px; marža: 15px 15px; popunjavanje: 15px 15px 15px 50px poravnanje teksta: lijevo}

I to je to .. Ponavljam, nisam programer ili nešto slično, a objašnjenje koje sam dao je kako razumijem da ShortCode radi 😛