Share
Astăzi, vom examina modul de utilizare a codurilor scurte împreună cu o varietate de servicii populare - inclusiv site-uri precum YouTube și Flickr, prin recaptarea în primul rând a modului de creare a unui shortcode și apoi a modului de a converti acest cod terță parte în ceva care pot fi repetate și manipulate.
Am acoperit scurte coduri deja aici la WPTuts +, discutând despre avantajele utilizării acestora și cum să le folosim de fapt. Codurile scurte sunt în mod eficient comenzi rapide (așa cum sunt definite de WordPress ele însele), care permit ca un rezultat să fie realizat în mod repetat, cu cea mai mică muncă posibilă. În forma lor cea mai simplă, un cod scurt include un cod pe care l-ați conectat la WordPress într-un alt fișier, uneori produsul unui terț, cum ar fi un videoclip YouTube sau un flux Flickr.
Dacă nu sunteți familiarizați cu codurile scurte, atunci ar trebui probabil să nu mai citiți acest articol și să verificați unul dintre celelalte articole pe care le avem aici la Tuts + despre codurile scurte din WordPress.
Un shortcode este creat adăugând o funcție la dvs. functions.php fișier și apoi conectându-l ca un scurtcod. Exemplul de mai jos creează o legătură cu hub-ul AppStorm.
Accentsconagua
funcția link_to_appstorm ($ atts, $ content = null) return 'AppStorm'; add_shortcode ('appstorm', 'link_to_appstorm'); Pentru a le folosi, folosim cea mai simplă formă de cod scurt, fără atribute.
[Appstorm]
Putem lua această idee mai departe prin introducerea unui atribut, în care să specificăm un anumit site AppStorm la care să se facă legătura.
funcția link_to_appstorm ($ atts, $ content = null) extract (shortcode_atts (array ('site' => 'www'), $ atts)); returnați "AppStorm"; add_shortcode ('appstorm', 'link_to_appstorm'); Timpul, shortcode-ul se leagă de un subdomeniu al AppStorm. Specificăm ce subdomeniu adăugăm teren atribut. Dacă nu există un atribut definit în codul scurt, codul scurt va fi setat la www care doar leagă înapoi la pagina de pornire principală. Exemplul de utilizare de mai jos ar fi legat de iPad.AppStorm.
[appstorm site = "ipad"]
După cum puteți vedea, codurile scurte sunt destul de explicative. Ceea ce vrem să facem este totuși să folosim același principiu de bază al unui link generat de un scurtcod cu un atribut care să fie utilizat împreună cu un serviciu terță parte cum ar fi YouTube sau Flickr.
Conversia unei bucăți statice de cod terță parte la un cod scurt este destul de similară cu metoda utilizată pentru a crea un link. Pur și simplu, vom crea o funcție care returnează codul ca un scurtcod și apoi aruncă câteva atribute pentru a-l personaliza.
Primul pas pe care ar trebui să-l luăm este să luăm codul de încorporare obișnuit și să creăm o simplă funcție de returnare.
funcția youtube_video ($ atts, $ content = null) return '„; add_shortcode ("youtube", "youtube_video"); [Youtube]
În același mod în care am creat prima legătură non-variabilă în primul exemplu, bucata de cod de mai sus încorporează un videoclip YouTube care nu se va schimba deloc. Și cum face acest lucru este destul de auto-explicative prea.
În esență, piesa de cod din pasul anterior va produce un rezultat identic cu cazul în care codul returnat a fost inserat în editorul propriu-zis. Cu excepția cazului în care intenționați să introduceți în mod regulat același videoclip deasupra și din nou, acest cod scurt este probabil inutil. De aceea, vrem să introducem câteva atribute care să traducă în parametrii pentru iframe.
Pentru a realiza acest lucru, folosim din nou extrage() funcția de a trage atributele din codul scurt. În codul de mai jos, facem acest lucru într-o formă de bază, creând doar un atribut care să înlocuiască ID-ul videoclipului.
funcția youtube_video ($ atts, $ content = null) extract (shortcode_atts (array ('id' => "), $ atts)„; add_shortcode ("youtube", "youtube_video"); [Youtube]
Și, la fel ca înlocuirea ID-ului video, putem face același lucru pentru lățimea și înălțimea. Acesta este momentul în care veți dori să vă asigurați că furnizați valori implicite, totuși, în cazul în care utilizatorul nu furnizează o valoare de lățime sau înălțime.
funcția youtube_video ($ atts, $ content = null) extract (shortcode_atts (array ('id' => ',' width '=>' 640 ',' height '=> '„; add_shortcode ("youtube", "youtube_video"); [Youtube]
YouTube are parametri suplimentari care pot fi adăugați la adresa URL, cum ar fi redarea automată. Evident, acestea pot fi aplicate și în codul returnat, cu propriul atribut, dacă este necesar. În general, acest lucru este explicabil și este demonstrat mai jos (părțile adăugate sunt boldate).
funcția youtube_video ($ atts, $ content = null) extras (shortcode_atts (array ('id' => ',' width '=> '), $ atts)); returnați'„; add_shortcode ("youtube", "youtube_video"); [Youtube]
Este într-adevăr atât de simplu și, așa cum veți vedea în următoarea prezentare, aceeași metodă de bază poate fi utilizată pentru a crea coduri scurte pentru alte servicii ale unor terțe părți.
Toate aceste încorporări de la terțe părți au fost create utilizând aceiași pași ca mai sus. Desigur, ca în etapa 2b, pot fi adăugați parametri suplimentari la alegere.
Un videoclip Vimeo este încorporat în exact același fel ca un videoclip YouTube, prin intermediul unui iframe cu variabile de lățime și înălțime. Singura adăugare este variabila de culoare pentru personalizarea playerului.
funcția vimeo_video ($ atts, $ content = null) extract (shortcode_atts (array ('id' => '), $ atts)); returnați'„; add_shortcode ("vimeo", "vimeo_video"); [Vimeo]
Widget-ul de profil Twitter este o bucată de JavaScript, cu o mulțime de atribute diferite, toate substituite pentru atributele de coduri scurte din codul de mai jos. Deoarece există atât de multe, este posibil să doriți să le eliminați și să le înlocuiți cu valori constante (cum ar fi stilul) în JavaScript-ul real sau pur și simplu să schimbați atributele implicite în matrice și să uitați să le folosiți în codul scurt.
funcția twitter_widget ($ atts, $ content = null) extract (shortcode_atts (array ('username' => 'width' => ' ','colorcolor' => '639ee3', 'hashtags' => 'true', 'bară de derulare' => 'true', 'loop' => 'false', 'stream' => 'false', 'avatars' => 'false', 'timestamp' => 'false' „; add_shortcode ("twitter", "twitter_widget"); Toate aceste atribute shortcode au valori implicite, cu excepția numelui de utilizator necesar. În ceea ce privește ceea ce trebuie să înscrii în atributul, toate acestea se explică prin toate hashtaguri în care restul sunt doar adevărate / false.
[stare de nervozitate]
Butonul Tweet este un buton popular de distribuire socială pentru Twitter.
funcția tweet_button ($ atts, $ content = null) extract (shortcode_atts (array ('username' => ',' url '=>'; reveniți 'Tweet„; add_shortcode ("tweetbutton", "tweet_button"); Primele două atribute ale butonului tweet nu sunt într-adevăr ambigue. Ultimul seta stilul pentru butonul tweet orizontală, vertical sau nici unul.
[Tweetbutton]
Ca butonul Tweet, butoanele Like și Send sunt butoanele de partajare socială pentru Facebook. Rețineți că aceste butoane au, de asemenea, nevoie de SDK-ul JavaScript referit undeva pe pagina curentă.
funcția facebook_buttons ($ atts, $ content = null) extract (shortcode_atts (array ('width' => '450', 'showfaces' => 'false', 'colorscheme' 'arial'), $ atts)); întoarcere ' Diferitele atribute pentru utilizare sunt explicate pe pagina asociată Facebook, dar, în esență, lățimea este scrisă în același format ca înainte, showfaces este o valoare adevărată / falsă de a arăta fețe ale "egalelor", schema de culori este fie întuneric sau lumină, iar fontul este, bine, un font.
Deoarece XFBML va viza în mod automat pagina curentă, nu este necesar să existe atribute în uz, adică codul scurt poate fi la fel de simplu ca exemplul de mai jos.
[ca]
Insigna Flickr este o modalitate de afișare a fotografiilor dvs. recente de pe Flickr. Din păcate, widgetul Flickr vine cu propriul CSS (deși poți muta cu ușurință acest lucru în foaia de stil) și folosește tabele pentru aspect. Odată ce terminat dvs. fiind foarte frustrat de această practică, iată codul scurt.
funcția flickr_widget ($ atts, $ content = null) extract (shortcode_atts (array ('userid' => ',' num '=> $ atts)); returnați ' | www.scuturar.com |
Dispozitivul Flickr are patru variabile de bază: numele de utilizator este ID-ul utilizatorului (în formatul 12345678 @ N01), Num este numărul de fotografii afișate, fel este ultima sau aleatorie și se referă la modul în care fotografiile afișate sunt determinate și mărimea este fie s (un pătrat mic), t (o miniatură) sau m (mediu).
[Flickr]
Sper că am explicat cum să creați un scurtcod în contextul unui serviciu terță parte. Este destul de simplu, trebuie doar să analizăm modul în care funcționează codul original și să schimbați variabilele statice pentru atribute. Acest lucru economisește timp, dar, poate mai important, înseamnă că codul poate fi modificat la o dată ulterioară, menținând în același timp parametrii care vă permit să schimbați, de exemplu, lățimea la o dată ulterioară pentru toate utilizările codului scurt.
