miercuri, 20 august 2014

Integrare Twitter, Facebook si Google+ in Wordpress

In acest articol va voi arata cum sa integrati manual trei dintre cele mai populare servicii media in site-ul tau: Twitter, Facebook si Google+. In primul rand va voi arata cum sa integrati aplicatia de comentarii facebook in wordpress.Apoi am sa va arat cum puteti afisa cele mai noi tweet-uri in sidebar si in final va voi arata cum sa cum sa adaugati butoanele de sharing in pagini si postari.In primul rand trebuie sa faci un backup fisierelor temei pe care vrei sa o modifici, astfel incat daca faci vre-o greseala sa fii asigurat ca nu faci vre-o prostie. Instalarea acestor modificari pe un site de teste este recomandata (eu fac toate modificarile intai pe un wordpress instalat pe computerul de acasa cu WAMP).
Integrare comentarii FacebookPentru ca majoritatea oamenilor sunt autentificati pe facebook in timp ceviziteaza diverse site-uri web, aceste comentarii facebook sunt grozave pentru a incuraja socializarea, dar nu in ultimul rand nu ve-i mai avea probleme cu spam-ul.
Stiu ca exista atatea solutii de prevenit spam-ul din comentariile wordpress, dar majoritatea sunt inaficiente sau te pun sa faci ceva in plus de fiecare data cand apar aceste comentarii.Sistemele de comentarii precum IntenseDebate si Disqus au anumite beneficii, pentru ca permit adaugarea de comentarii folosind Facebook sau alte servicii similare, dar inainte de a le folosii, vizitatorii trebuie sa permita accesul aplicatiei in contul lor, lucru ce ii descurajeaza pe foarte multi. Deci, integrarea sistemului de comentarii facebook permite discutarea fara pra mari probleme.

1.Aplicatie Facebook

Pentru a folosi sistemul de comentarii de la facebook trebuie sa creezi o aplicatie de pe pagina Facebook Application. Acest pas este necesar, indiferent ca folosesti un plugin sau adaugi sistemul de comentarii manual.Pur si simplu apasa pe butonul ” + Create New App” de pe pagina Facebook Application si scrie un nume unic pentru aplicatia ta in campul “App Display Name”, campul “App Namespace” poate fii lasat gol.Acum ai primit un cod numit “App ID/API key” si un cod numit “App secret key”, nu trebuie sa le memorezi pentru ca pluginul oficial de comentarii Facebook le adauga automat in codul pe care trebuie sa il adaugi in fisierele site-ului tau.2. Adauga codul in siteAcum, mergi pe pagina pluginului Facebook pentru Comentarii si obtine codul pentru site-ul tau. Fereastra aceasta iti va permite se setezi URL-ul site-ului pe care v-or aparea comentariile, numarul de comentarii, latimea si schema de culori (alb/negru).Nu trebuie sa iti faci griji din cauza setarilor pe care le faci aici pentru pot fi modificate ulterior manual, si nu conteaza ce URL pui pentru ca il v-om inlocui cu permalink-ul:Cand apesi pe butonul “Get Code” iti va fi afisata o fereastra cu codul plugin-ului (alege HTML5).  Asigura-te ca selectezi aplicatia pe care ai setat-o mai devreme pentru a seta automat ID-ul corect.Primul cod adaugal in fisierul header.php exact dupa codul <body>:
[cc name=”fbfcdht5″]
Al doilea cod il pui unde vrei sa apara sistemul de comentarii. Asigura-te ca URL-ul este inlocui cu permalink-ul WordPress ( <?php the_permalink(); ?> ) astfel incat comentariile v-or fi afisate corect pe fiecare pagina.
[cc name=”fbscdht5″]
Pentru a pune comentariile facebook deasupra comentariilor WordPress adauga codul de mai sus dupa codul </form>.
Daca vrei sa inlocuiesti complet sistemul de comentarii wordpress cu sistemul de la facebook nu trebuie decat sa inlocuiesti functia care apeleaza fisierul comments.php, de exemplu daca vrei sa inlocuiesti sistemul de comentarii din paginile cu postari inlocuieste codul <?php comments_template(); ?> cu codul de comentarii facebook in fisierul single.php, pentru pagini acelasi lucru in fisierul page.php
poza comentarii facebook din sectiunea freebies
Pentru a fii anuntat de fiecare data cand cineva lasa un comentariu trebuie sa te faci moderator al aplicatiei din pagina Comment Moderation tool .

Ultimele Tweeturi in sidebar

Afisarea ultimelor tweet-uri este o metoda foarte buna de a incuraja vizitatorii sa te urmareasca pe Twitter. C-ea mai des intalnita zona de afisat aceste tweet-uri este sidebar-ul, chiar daca pot fi adaugate in orice parte a site-ului.Afisarea Tweet-urilor manualAm incercat mai multe solutii de implementat tweet-uri manual pe site, dar preferata me-a este versiunea lui Chris Coyier (autor CSS-Tricks). Codul lui de RSS fetching reprezinta o metoda simpla si eficienta pentru a afisa cele mai noi tweet-uri din contul tau. Adresa contului tau de twitter este de forma http://api.twitter.com/1/statuses/user_timeline.rss?screen_name=xxxxx (unde xxxxx este numele de pe twitter), pentru rweet-urile tale favorite foloseste http://twitter.com/favorites/xxxxx.rss.[cc name=”tweet1″]Afisare tweet-uri cu widget-ul officialWidgetul Twitter official arata foarte bine si este usor de modificat. Poti selecta numarul de tweeturi, sau daca widget-ul sa se mareasca sau sa afiseze un scrollbar pentru a vedea toate tweet-urile.Dimensiunea poate fi ajustata manual sau din optiunea auto-width. Culoarea  poate fi schimbata din zona setarilor. O data ce a-ti setat dimensiunea si culoarea copiati codul in fisierul in care doriti sa apara din template.Afisare Tweeturi cu plugin-uri wordpressDaca nu vrei sa umblii in cod sub nici o forma sau nu vrei sa folosesti widget-ul official poti incerca unul din aceste plugin-uri wordpress:

Adauga butoane de social sharing

Butoanele de social sharing reprezinta una dintre cele mai bune metode de a indemna vizitatorii sa de-a mai departe articolul tau pe una dintre retelele de socializare. Nu trebuie decat sa copiati codul de pe paginile urmatoare:
Butoanele pe care le-ati gasit la adresele de mai sus sunt perfecte pentur paginile cu detaliile/comentariile articolelor (single.php). Dar nu v-or functina pe prima pagina a site-ului (index.php), sau un arhiva (archive.php).Pentru a functina corect asigurati-va ca fiecare buton foloseste permalink-ul articolului, nu URLul siteului.
Pentru a pune aceste butoane pe site nu trebuie decat sa alegeti tipul de buton si sa copiati codul in single.php sau pe page.php pentru pagini.
Pentru a functina pe prima pagina si pe pagina de arhiva urmeaza instructiunile de mai jos.FacebookButon Facebook Like vine cu o multime de optiuni.Un buton numit “Send” poate fi adaugat, poti seta latimea, poti alege sa fie afisate si imaginile de profil sub butoane, poti alege intre textul “Like” si “Recommand”, poti alege intre schema de culoare alba sau neagra, poti seta fontul.

Trebuie sa adaugi 2 coduri in site-ul tau. In primul rand SDKul JavaScript exact dupa tag-ul <body> (in header.php). Acest cod trebuie sa fie adaugat doar odata.Al doilea cod il pui unde vrei sa apara butonul de Like. Pentru a te asigura ca este selectata pagina corecta seteaza href=”<?php echo get_the_permalink($post->ID); ?>”, de genul:[cc name=”fblbop”]Google + Google+ vine cu butoane de 4 dimensiuni: mic, mediu, standard si inalt. Numarul de voturi pe care pagina le-a primit pot fi afisate inline, intr-un balon sau sa nu fie afisate.Sa faci legatura in permalink-ul articolului si buton este la fel de simplu ca in cazul facebook-ului, seteaza href=”<?php the_permalink(); ?>”, pentru un buton inalt codul va arata in felul urmator:[cc name=”gptb”]TwitterTwitter ofera 4 tipuri de butoane: unul pentru sharing de link-uri, unul pentru a invita oamenii sa te urmareasca, un buton pentru hash tag,  si altul pentru mentiuni. Butonul de care ai nevoie pentru a afisa numarul de tweet-uri ale unui articol se numeste “Share a link”.Pe pagina de edita butoanele poti alege daca doresti sa fie afisat numarul de retweet-uri si poti alege intre “Via”, “Recommend” si “Hastag”.Pentru a te asigura ca Twitter-ul va folosi titlul articolului tau si URL-ul articolului in mod corect adauga data-text="<?php the_title(); ?>" si data-url="<?php the_permalink(); ?>" in link. De exemplu, daca folosesti butonul mic vei avea urmatorul cod:[cc name=”twsvrhbtn”]
Pentru a afisa butonul mare schimba data-size la large: data-size=”large”. pentru a afisa butonul de popular vartical schimba data-count=”vertical”.

Concluzia

O multime de utilizatori de WordPress folosesc in continuare plugin-uri de social media sharing, dar am spus si mai sus, integrarea manuala a acestor medii de socializare poate fi o solutie mai buna.Integrarea sistemului de comentarii facebook dureaza decat cateva minute si procesul de instalare este mult mai simplu decat al pluginurilor.Nu stiu ce sa mai zic, deja m-am lungit prea mult, am acest articol in drafturi de aproape 2 saptamani…sper ca ai inteles ceva si sper ca ti-a fost de ajutor, oricum pentru orice nelamurire lasa un comentariu.

Niciun comentariu:

Trimiteți un comentariu