Blocarea butoanelor sociale. Butoanele rețelelor sociale

Revizuirea designerilor autohtoni și a scripturilor de butoane ale rețelelor sociale pentru site-uri web, precum și analogi străini. Scurt, clar și vizual.

Designeri de butoane de rețele sociale pentru un site web

2. Calea ușoară obține link-uri către site - QIP.RU
Plasați un buton pe site și oferiți vizitatorilor posibilitatea de a adăuga materialele preferate ale site-ului la marcaje, bloguri și rețele sociale. Trei pași: unde să plasați butonul (site web, Blogger sau WordPress), stilul butonului ( opțiuni gata făcute) și obțineți un buton.

3. Butoane pentru adăugarea de conținut în rețelele sociale - Pluso
Plasați butoanele și oferiți vizitatorilor posibilitatea de a partaja paginile lor preferate pe rețelele sociale, precum și de a imprima, trimite e-mail și adăuga marcaje.

4. Serviciu activitate socială— UpToLike
Butoane personalizate pentru rețelele sociale cu posibilitatea de a seta culoarea, forma, dimensiunea și efectele speciale. Caracteristicile suplimentare sunt widget-ul de partajare a imaginilor PicShare, funcția „Citat” și funcția personalizată Urmărire.

5. Un buton! — pentru toate serviciile de marcare și rețele sociale
Selectați un buton de vizualizare. Unde va fi instalat butonul: site web, Blogger sau WordPress. Adăugați un buton.

Scripturi pentru butoanele de rețele sociale pentru un site web

1. Butoane sociale frumoase pentru site - goodshare.js
Afișează butoanele pe aproape orice dispozitiv. Cod curat. Scurtă documentare. SEO prietenos.

2. Script buton marcajele socialeși rețele – Share42
Selectați dimensiunea și marcați pictogramele serviciilor pe care doriți să le utilizați pe site. Selectați opțiunile dorite. Vedeți cum va arăta și/sau descărcați scriptul terminat. Instalați scriptul pe un site web WordPress, Drupal etc.

3. Nasturi frumoși„Like” pe rețelele sociale de la folosind jQuery— Like-uri sociale
Script pentru butoanele „like” cu contoare stil uniform pentru rețelele sociale: Facebook, Twitter, VKontakte, Odnoklassniki, My World, Google+ și Pinterest.

Analogii străini ai butoanelor de rețele sociale pentru un site web

1. Butoane de partajare - AddThis
Butoanele de partajare vă vor ajuta să creșteți audiența site-ului dvs. prin atragerea de vizitatori din alte resurse și rețele sociale prin conținut distribuit.

4. Social Sharing - Po.st
Obțineți mai multe beneficii prin distribuirea pe rețelele sociale. Serviciul va face mai ușor pentru vizitatori să partajeze pe rețelele sociale, ceea ce va crește traficul organic către site.

5. Butoane de partajare pentru orice Site - AddToAny
Obțineți codul pentru butoanele rețelelor sociale pentru orice site web. Selectați tipul și stilul butoanelor, specificați e-mailul și alte opțiuni sau alegeți una dintre platformele: WordPress, Drupal, Tumblr, Joomla, Elgg, WordPress.com, Blogger, TypePad sau FeedFlare. Obțineți codul butonului.

la 8:00 Editați mesajul 6 comentarii

Pro:

Pluso XVersiune experimentală a constructorului butoane sociale Distribuie Pluso. Are un design îmbunătățit al pictogramei, fereastră pop-up cu lista plina rețelele sociale disponibile, iar butonul portocaliu enervant cu semnul „+” a fost și el schimbat; în locul lui este acum același semn plus, dar într-un design mai plăcut.
Potrivit dezvoltatorilor, noile butoane sociale sunt concepute pentru monitoarele Retina. Orice altceva, la prima vedere, rămâne la fel. Din păcate, în constructor printre Optiuni Disponibile Nu am găsit butoane cu contor, deși ediția standard Pluso le are.
Nu știu dacă îl vor înlocui pe cel vechi cu un designer nou, dar acest moment, ambele funcționează simultan prin link-uri diferite.

Add ThisAdd Acesta este un serviciu care oferă butoane sociale de înaltă calitate, elegante și flexibile. Această resursă este liderul în vest. Este mai puțin popular aici, dar adesea dau peste site-uri în limba rusă cu widget-ul Adăugați acest lucru.
Sunt plătite și widget-uri gratuite. ÎN cont gratuit doar cele mai disponibile opțiuni simple. Există mult mai multe concepte de design disponibile în versiunea plătită, precum: butoane adaptive, butoane cu diverse contoareși mult mai mult.
Cred că această opțiune nu este potrivită pentru oamenii noștri, deoarece va trebui să plătiți pentru clopoței și fluiere, dar piata interna puteți găsi toate aceleași lucruri, dar gratuit.
Constructorul Add This are o listă uriașă de rețele sociale disponibile, inclusiv Vkontakte, Moi Mir și Odnoklassniki. Există un plugin pentru .

Partajare bună Butoane de partajare ușoare și frumoase pentru site-ul dvs., cu un cod de încorporare mic, care este foarte atractiv. Din păcate, există o singură opțiune de design cu mai multe scheme de culori. Există toate cele populare în RuNet social media
Potrivit dezvoltatorilor, creația lor este optimizată și motoarele de căutare vor adora site-ul tău. Nu știu cât adevăr este aici.
Dacă nu aveți nevoie de clopoței și fluiere, această opțiune este pentru dvs.

Shareaholic Un serviciu occidental foarte interesant pentru crearea de butoane sociale, pe care l-am descoperit destul de recent.
Shareaholic oferă câteva concepte noi de buton de partajare. Personal, mi-a plăcut săgeata de deasupra butoanelor (săgețile sunt foarte puternice unealtă de marketing), dar, din păcate, inscripția este în limba engleză, deci nu este potrivită pentru oamenii noștri. Printre rețelele sociale disponibile se numără VKontakte.

Probabil că nu există site-uri rămase pe Internet care să nu conțină butoane de postare materiale pe rețelele de socializare. Acestea din urmă și-au ocupat de mult și ferm un loc în viața noastră. Comunicăm acolo, ne cunoaștem, promovăm afacerile, citim știri și așa mai departe. O gamă completă de. Nu este de mirare că webmasterii se străduiesc să extindă prezența site-urilor lor pe rețelele sociale prin orice mijloace posibile. metodele disponibile. La urma urmei, există tone de trafic potențial de care absolut toată lumea are nevoie. Fluxul de vizitatori înseamnă bani, reputație, creștere. Totul este construit în jurul lui. O bucată gustoasă.

Butoanele sociale sunt necesare, asta e evident. Întrebarea este diferită - pe care sa le aleg? Am testat-o ​​pentru tine TOP 5 diverse servicii pentru a adăuga codul de buton pe site-uri web. Scopul este de a-l identifica pe cel optim și de a-l arăta în detaliu. Să începem cu etapa de calificare.

Alegere cel mai bun serviciu butoane sociale

Alegerea candidaților pentru comparație s-a dovedit a fi banală - am luat cel mai servicii populare , despre care a auzit orice persoană care este deloc familiarizată cu subiectul creării site-urilor web. Nu unele rare care câștigă popularitate, doar bătrâni cu experiență.

Componența echipei certificate este următoarea:

Ca urmare a testării serviciilor sociale selectate - uSocial era liderul. Acum doriți să primiți o justificare pentru alegerea noastră. Desigur, nu vom rămâne nefondați.

Caracteristicile butoanelor uSocial

Să dăm unele fapte, care ne-a convins că decizia a fost corectă.


Pasul 2

Alcătuim un set de butoane sociale. Poți alege afișat servicii de rețele sociale, forma și stilul butoanelor.

Aici puteți activa butonul „Sus”, activați suportul pentru dispozitive mobile, conectați serviciile Viber, WhatsApp, Telegram, SMS.

Pasul-4

După instalarea barei sociale din contul personal uSocial, puteți vizualiza statistici despre aprecieri și repostări pentru perioada selectată, atât pentru toate rețelele sociale simultan, cât și pentru cele selectate. Datele sunt afișate în grafice sau diagrame clare.

Dacă metaetichetele sociale sunt completate corect, postările vor fi percepute corect servicii sociale, deoarece indică tipul de material, titlul relevant, un link către poza dorită. Toate acestea măresc eficiența repostării: materialul dumneavoastră va fi indexat corect de serviciile sociale.

Exemple cod de marcare micro pentru rețelele sociale populare (codul trebuie scris înainte de etichetă):

1. FacebookȘi In contact cu utilizare Deschideți graficul protocol:





3. Pentru Stare de nervozitate codul arata asa:



4. Pentru Google+ Asa de:

- link către profilul autorului de pe Google+
- Numele site-ului
- fragment de text (până la 40 de caractere)
- descrierea site-ului
- calea către fișierul imagine

Instrumente pentru lucrul cu micro markup.

Bună ziua, dragi cititori ai blogului. După cum probabil ați ghicit deja din titlu, vom vorbi despre așa-numitele butoane sociale, care pot ajuta foarte serios să atrageți articole pe site-ul dvs., cu o combinație reușită de circumstanțe și calitate superioară articolul în sine, un număr mare de vizitatori din rețelele și serviciile sociale.

Semnalele sociale sunt de asemenea luate în considerare motoare de căutare atunci când vă clasați site-ul. Un numar mare de partajările la conturi de calitate pe Twitter, Google+, Facebook (este posibil ca VKontakte și alte rețele să fie luate în considerare) vă pot permite să urcați cu un anumit număr de pași mai sus și, poate, să intrați în Top și să rămâneți acolo dacă factori comportamentali nu te voi dezamăgi.

În general, există o mulțime de servicii care oferă script-uri (butoane) pentru partajarea conținutului pe rețelele sociale de pe Internet, dar nu toate ar trebui să fie de încredere (vă pot folosi cu ușurință sau într-un alt mod din motive neplăcute). Și sunt capabili să „atârneze un site” dacă codul lor nu este foarte bine plasat și capabilitățile de calcul ale serverelor lor nu sunt foarte puternice. Deși există opțiuni decente care sunt libere de aceste neajunsuri, și le-am enumerat la sfârșitul acestei publicații.

De asemenea, este posibil să afișați pe butoane numărul de share-uri către o anumită rețea socială. Mai mult, toate postările sunt luate în considerare, și nu doar cele realizate folosind acest bloc (datele se încarcă prin API). Adevărat, nu toate rețelele sociale sunt acceptate (doar facebook, Google+, Moi Mir, Odnoklassniki.ru, VKontakte), dar cele mai multe dintre cele principale. Este trist că Twitter a fost eliminat recent din această listă pentru că... a încetat să furnizeze aceste date prin API.

De exemplu, aici puteți scurta titlurile pentru partajare pe Twitter, deoarece există o limită a lungimii lor (citiți mai jos cum să faceți acest lucru), configurați dacă să afișați sau nu contoarele de partajare, setați direcțiile de deschidere a meniului cu butoane suplimentare rețelele sociale și multe altele. În general, săpați și aruncați o privire.

În general, în comparație cu butoanele native de partajare, care oferă instalarea rețelelor sociale pe site (citiți despre asta mai jos), blocul Yandex câștigă în viteza de încărcare, compactitate și ușurință de instalare și configurare. De exemplu, în trecut, butonul meu oficial de Twitter nu se încărca adesea din cauza unor probleme cu serverul lor, așa că scriptul realizat în Java nu s-a încărcat mult timp meniul din stânga blogul meu. Este posibil ca această problemă să fi fost acum rezolvată, dar multe scripturi vor fi întotdeauna mai rele decât unul în ceea ce privește optimizarea vitezei de încărcare a site-ului.

Cred că este puțin probabil ca Yandex să aibă probleme cu accesibilitatea, deoarece este o organizație comercială bine câștigătoare, care este destul de sensibilă la imaginea sa. În plus, dacă ai, atunci poți urmări statisticile clicurilor pe aceste butoane, ceea ce poate fi util.

Pe lângă blocul cu pictograme mărime obișnuită puteți face un bloc cu contoare, iar Yandex sugerează, de asemenea, adăugarea unui meniu derulant cu rețele sociale suplimentare, care va fi ascuns sub un spoiler situat după afișarea numărului necesar de butoane pentru principalele rețele sociale (cum ar fi VKontakte, MoiMir, ):

Dacă doriți să adăugați contoare la butoanele din acest bloc (cu un meniu drop-down), atunci pur și simplu introduceți încă un atribut în codul său de pe site (între etichetele Div): data-counter="“ și atât. După cum am spus, nu ar putea fi mai simplu. Puteți utiliza contoare vor fi adăugate și la butoanele mici, care sunt discutate mai jos:

Data-services="vkontakte,odnoklassniki,facebook,gplus,twitter,moimir,blogger,digg,reddit,linkedin,lj"

De asemenea, puteți înlocui toate pictogramele cu miniaturile lor mai mici ale butoanelor, pe care personal le-am găsit utile atunci când inserez un bloc în top parte toate articolele de pe acest blog:

În prima parte, etichetele SCRIPT de deschidere și de închidere conțin calea către script, care va fi încărcată de pe serverul Yandex, iar a doua parte conține codul de inserare în sine, care va trebui să fie plasat în locul din șablonul dvs. acest bloc va fi afișat.

Cum să inserați butoanele sociale de la Yandex pe un site web

Prin urmare, inserez codul de apelare al scriptului împreună cu blocul Div în locul unde trebuie afișate butoanele rețelelor sociale. Ei bine, pentru ca încărcarea sa să nu afecteze viteza de încărcare a paginii principale, eu, urmând sfaturile date în documentația Yandex, i-am adăugat atributul async="async", inițiind-o astfel încărcare asincronă scenariu:

Problema poate apărea în găsirea dintre numeroasele fișiere ale motorului site-ului dvs. a celui care este responsabil pentru formarea părții de jos cod HTML cu eticheta de închidere /BODY sau cea care formează Capul. Și, de asemenea, găsiți un loc în fișierele teme în care trebuie să introduceți o bucată de cod Etichete div(pentru a plasa în sine butoanele).

În principiu, atât în ​​WordPress, cât și în Joomla, acest lucru se face într-unul dintre fișierele temei utilizate. Deoarece Acest blog rulează pe WordPress, așa că voi vorbi pentru el.

Dacă lucrați cu WordPress, atunci pentru a insera codul pentru apelarea scriptului va trebui să deschideți fișierul footer.php pentru editare (veți găsi eticheta Body de închidere sau header.php (o veți găsi acolo) Etichete pentru cap) din folderul:

/wp-content/themes/numele folderului_cu_tema_utilizată/footer.php

Acum, tot ce rămâne este să inserați a doua parte a codului butoanelor sociale Yandex, care este responsabil pentru locația blocului cu butoane pe paginile site-ului, în locul potrivit în șablonul site-ului dvs. sau direct în articol:

Apropo, voi face o rezervare din nou: dacă doriți să eliminați orice buton din acest bloc, nu trebuie să mergeți din nou la constructorul de pe site-ul Yandex. Puteți elimina pur și simplu intrarea din această listă (împreună cu virgula care vine după ea, de exemplu, „vkontakte”). Ei bine, înțelegi...

Ei bine, puteți modifica și poziționarea butoanelor în interiorul blocului folosind CSS.

Li.ya-share2__item (fond:nici unul!important;padding:0 7px 0 7px!important;)

Deoarece Eu folosesc adaptive under dispozitive mobile layout, apoi pentru dispozitivele cu rezoluție scăzută a ecranului am adăugat o linie similară, unde am setat indentări puțin mai mici, dar acestea sunt detalii:

Li.ya-share2__item (padding:0 3px 0 3px!important;)

În general, așa ceva este cazul când vine vorba de blogul meu WordPress. În Joomla, pentru a insera acest bloc, probabil că cel mai ușor va fi să utilizați modulul Custom Html Code, plasându-l în poziția șablonului undeva imediat sub textul articolului.

Butoane oficiale de rețele sociale

Multe rețele sociale oferă tuturor posibilitatea de a descărca codul butonului și, adesea, puteți chiar personaliza aspectul și funcționalitatea acestuia. De exemplu, puteți configura și primi codul de script pentru partajarea unei postări în .

După cum puteți vedea, există destul de multe setări și, pe lângă aspectul butonului VKontakte, puteți personaliza și afișarea unui contor care arată numărul de acțiuni.

Veți putea obține un buton Facebook. Este foarte flexibil personalizat pentru a se potrivi nevoilor dvs. și nu vă lăsați confundați cu inscripțiile în engleză de pe el, deoarece atunci când plasați codul său pe site-ul dvs. web, inscripțiile vor fi traduse automat în rusă.

Este mai bine să nu inserați nimic în câmpul URL, atunci pagina pe care se află acest cod va fi partajată.

Va arata cam asa:

Va arata cam asa:

Și, desigur, nu pot să nu menționez butonul oficial Twitter, care a apărut relativ recent. Constructorul său este localizat. Desigur, oferă posibilitatea de a număra numărul de retweet-uri și veți avea ocazia să-i setați aspectul:

Am modernizat apoi ușor codul rezultat conform principiului descris mai sus, astfel încât titlurile mele lungi să fie tăiate și să nu creeze probleme suplimentare utilizatorilor la partajare.

Alte opțiuni pentru obținerea butoanelor de rețele sociale pentru site-ul dvs

După cum am spus deja, există o mulțime de tot felul de servicii online în care puteți lua gratuit un script pentru butoanele rețelelor sociale și îl puteți pune pe site-ul dvs. web. Toate urmăresc scopuri diferite: „din inimă” (ca și în cazul serviciului Dimoxa), să colecteze date necesare funcționării altor servicii (ca în cazul ApTuLike) sau pentru profit (virusuri și alte fraude ilegale cu traficul pe care îl aveți pe site-ul dvs.) . Există, de asemenea, soluții pur și simplu plătite, de exemplu, cum ar fi pluginul menționat mai jos.

Este greu de spus ce să alegi din această varietate. Voi spune câteva cuvinte despre ceea ce am avut șansa să încerc și despre ce am scris deja înainte.

În general, priviți, comparați și alegeți singuri.

Multă baftă! Ne vedem curând pe paginile site-ului blogului

Puteți viziona mai multe videoclipuri accesând „);”>

S-ar putea să fiți interesat

Creăm butoane pentru adăugarea la rețelele sociale și marcaje pentru un blog WordPress (fără pluginuri și scripturi) Probabil - butoane sociale independente pentru site
Butoane pentru site-uri mobile de la Uptolike + capacitatea de a partaja link-uri în mesagerie UpToLike - un generator de butoane sociale pentru site-ul tău cu funcționalitate extinsă