În următorul tutorial vom crea un plugin pentru a obține imaginile populare din fluxul principal al Instagram.
Pluginul nostru va funcționa cu [Instagradam]
cod scurt. Puteți să îl inserați în orice loc în care conținutul HTML poate merge, de exemplu. codul șablonului, codul editorului etc..
Ca rezultat, aproximativ 10-15 imagini miniatură vor fi afișate cu link-uri clicabile. Miezul pluginului se bazează pe un feed de la distanță, pe care îl vom recupera utilizând funcția API a WordPress.
Lista de date brute va arata astfel:
/ * theluxurystyle --- http://distilleryimage8.s3.amazonaws.com/c4c876f4780a11e2a15422000a9f19a4_5.jpg dragoste --- http://distilleryimage3.s3.amazonaws.com/0c2d3b20781911e2b92122000a9e0727_5.jpg jaredleto --- http: // distilleryimage8. s3.amazonaws.com/21d07bce781c11e2adc122000a1f9ace_5.jpg balloop --- http://distilleryimage11.s3.amazonaws.com/4fe04e66781411e2890222000a1fb0b2_5.jpg pinkshosho --- http://distilleryimage10.s3.amazonaws.com/abaef1b4781b11e2a2ce22000a1fa411_5.jpg * /
Acest pas este necesar pentru fiecare plugin nou. Înregistrați-l la Instagram pentru a obține o CLIENT_ID
și client_secret
. Numele pluginului ar trebui să fie caractere simple alfabetice din experiența mea (de ex. johnsplugin
).
Acesta este locul unde puteți descrie datele de bază ale pluginului, cum ar fi numele pluginului, adresa URL, numărul versiunii și autorul.
/ * Nume de plugin: Instagradam Plugin URI: http://wp.tutsplus.com/ Descriere: Un simplu și rapid Instagram shortcode plugin. Utilizați [instagradam] pentru a trage feed-ul principal! Versiune: 1.0 Autor: Adam Burucs URI autor: http://burucs.com/ * /
Aceasta va defini [Instagradam]
shortcode, care va funcționa pe baza instagradam_embed_shortcode
funcţie.
// înregistra codul scurt add_shortcode ('instagradam', 'instagradam_embed_shortcode');
Aceasta va descrie funcționarea principală a pluginului nostru. $ ATTS
și conținut $
ar trebui să fie definite așa cum vedem aici, dar nu le vom folosi în această lecție.
// definește funcția shortcode instagradam_embed_shortcode ($ atts, $ content = null) // ...
Avem nevoie de o variabilă helper pentru a face o ieșire pentru funcția noastră și o recuperare de date care utilizează API-ul Wordpress Function. Acesta este $ str
și $ rezultat
, respectiv.
// definiți ieșirea principală $ str = ""; // obține date la distanță $ result = wp_remote_get ("https://api.instagram.com/v1/media/popular?client_id=3f72f6859f3240c68b362b80c70e3121");
Selecția principală se ocupă de eroarea de alimentare (în unele cazuri se pot obține erori SSL, dar există o soluție pentru cea descrisă mai târziu în acest articol).
În cazul în care există o eroare, o vom reda la pagină: Ceva n-a mers bine:…
.
dacă (is_wp_error ($ rezultat)) // eroare de manipulare $ error_message = $ result-> get_error_message (); $ str = "Ceva a mers prost: $ error_message"; altceva // procesează mai departe // ...
Variabil $ rezultat
va conține datele principale, pentru procesare vom face un alt ajutor numit $ main_data
. Avem de asemenea nevoie de un contor pentru repetare.
// procesează în continuare $ result = json_decode ($ result ['body']); $ main_data = array (); $ n = 0;
Această buclă va colecta toate numele de utilizator și miniaturile de care avem nevoie. Anterior, am analizat feedul principal (structura alimentării), pentru a descoperi cum să obțin datele dorite. Deci, acesta este un pas important și, de asemenea, să nu uităm că Instagram poate schimba acest lucru mai târziu
și ar putea fi necesar să ne modificăm $ D-> user-> numele de utilizator
și $ D-> images-> thumbnail-> URL
.
// a obține numele de utilizator și miniatură reală foreach ($ rezultat-> date ca $ d) $ main_data [$ n] ['user'] = $ d-> user-> nume de utilizator; $ main_data [$ n] ['miniatură'] = $ d-> imagini-> miniatură-> url; $ N ++;
În liniile următoare, vom crea codul HTML care va conține imaginile și linkurile din feedul principal al Instagram. Link-urile se vor deschide într-o fereastră nouă, realizată cu target = "_ blank"
. Notați spațiul de la capătul șirului principal, acesta este pentru separarea de bază.
// a crea șirul principal, imaginile încorporate în linkuri foreach ($ main_data ca $ date) $ str. = ' „;
Acest cod standard (cod scurt) va returna conținutul nostru principal.
returnați $ str;
În unele cazuri wp_remote_get
funcția poate funcționa prost, pentru a rezolva acest lucru trebuie să folosim acest cod înaintea principalelor secțiuni de cod.
// remediați eroarea de solicitare SSL add_action ('http_request_args', 'no_ssl_http_request_args', 10, 2); funcția no_ssl_http_request_args ($ args, $ url) $ args ['sslverify'] = false; întoarcere $ args;
Codul terminat arată astfel.
/ * Nume de plugin: Instagradam Plugin URI: http://wp.tutsplus.com/ Descriere: Un simplu și rapid Instagram shortcode plugin. Utilizați [instagradam] pentru a trage feed-ul principal! Versiune: 1.0 Autor: Adam Burucs Autor URI: http://burucs.com/ * / // remediați eroarea de solicitare SSL add_action ('http_request_args', 'no_ssl_http_request_args', 10, 2); funcția no_ssl_http_request_args ($ args, $ url) $ args ['sslverify'] = false; întoarcere $ args; // înregistra codul scurt add_shortcode ('instagradam', 'instagradam_embed_shortcode'); // definește funcția de scurtătură instagradam_embed_shortcode ($ atts, $ content = null) // definiți ieșirea principală $ str = ""; // obține date la distanță $ result = wp_remote_get ("https://api.instagram.com/v1/media/popular?client_id=3f72f6859f3240c68b362b80c70e3121"); dacă (is_wp_error ($ rezultat)) // eroare de manipulare $ error_message = $ result-> get_error_message (); $ str = "Ceva a mers prost: $ error_message"; altceva // procesează în continuare $ result = json_decode ($ result ['body']); $ main_data = array (); $ n = 0; // a obține numele de utilizator și miniatură reală foreach ($ rezultat-> date ca $ d) $ main_data [$ n] ['user'] = $ d-> user-> nume de utilizator; $ main_data [$ n] ['miniatură'] = $ d-> imagini-> miniatură-> url; $ N ++; // a crea șirul principal, imaginile încorporate în legăturile foreach ($ main_data ca $ date) $ str. = ' „; returnează $ str;
Aceasta este o imagine care arată pluginul în acțiune. Pentru aceasta, codul scurt a fost introdus într-un articol.