Skripta društvenih dugmadi. Dugmad društvenih medija

Jer neću ponovo objašnjavati šta je u njemu napisano, ali ću se morati na to pozivati ​​u toku članka.

Dakle, hajde da počnemo i počnimo sa samim JavaScriptom, možda. Rad skripte u vezi sa šalterom podijeljen je u dva dijela:

• Brojač mora biti dodat svakom dugmetu sa društvenih mreža kada se stranica učita;
• Na događaju, kliknite na dugmad da promijenite broj dijeljenja.

Da bismo implementirali prvi dio logike skripte, moramo dodati metodu init ():

Init: funkcija (element) ($ (dokument) .ready (funkcija () ($ (element)) .each (funkcija (idx) (var countApiUrls = (twitter: "https://urls.api.twitter.com/1) /urls/count.json?callback=?&url= ", vk:" https://vk.com/share.php?act=count&index= "+ idx +" & url = ", facebook:" https: // graph .facebook.com /? callback =? & ids = "); var pageUrl = $ .parseJSON ($ (element +" div: eq (0) "). attr (" data-share-data ")). url ; if (pageUrl) (share.getCountLikes ($ (element) .find (". twitter"), countApiUrls.twitter, pageUrl, "twitter"); share.getCountLikes ($ (element) .find (. vk") , countApiUrls .vk, pageUrl, "vk"); share.getCountLikes ($ (element) .find (. facebook"), countApiUrls.facebook, pageUrl, "facebook"););));)); return false; ;)

GetCountLikes: funkcija (kutija, apiUrl, pageUrl, tip) (if (apiUrl && pageUrl) (if (type == "twitter")) ($ .getJSON (apiUrl + pageUrl, funkcija (podaci) (var num = data.count | | 0; if (num> 0) (share.setCountLikes (kutija, broj););));); if (tip == "vk") ($ .getScript (apiUrl + pageUrl); if (! Prozor. VK) (window.VK = ();); window.VK.Share = (count: funkcija (idx, count) (var num = count || 0; if (num> 0) (share.setCountLikes (kutija, br. ););));); if (type == "facebook") ($ .getJSON (apiUrl + pageUrl, funkcija (podaci) (var num = data.shares || 0; if (num> 0) (dijeli) .setCountLikes (kutija, broj););)););); vrati false;)

Metoda getCountLikes () uzima 4 parametra:

• kutija - omot za svako dugme društvenih mreža;
• apiUrl - API adresa na kojoj se vrši poziv;
• pageUrl - adresa stranice o kojoj želimo da primamo podatke;
• type - tip društvene mreže.

Koristimo metodu jQuery $ .getJSON () za pristup generiranom url = apiUrl + pageUrl. Ovisno o društvenoj mreži, dobijamo odgovor (uglavnom json) i obrađujemo ga. Izuzetak je "Vkontakte", jer na zahtjev dobijamo obradu metode VK.Share (), što uzrokuje prirodnu grešku na našoj stranici, jer nemamo VK objekat, već uz pomoć "jednostavnog" štaku izvlačimo rezultat koji nam je potreban.

Posljednje što nam preostaje je da nacrtamo brojeve na dugmadima. Ovaj problem rješavamo pomoću nove metode setCountLikes (). Ova funkcija uzima dva parametra: specifikaciju omota i sam broj.

SetCountLikes: funkcija (kutija, broj) (box.append (" "+ broj +""); vrati false;)

Popup: funkcija (kutija, url) (var countBox = box.find (. Count"); if (! CountBox.length) (share.setCountLikes (box, 1);) else (countBox.text (parseInt (countBox. tekst ()) + 1);); window.open (url, "", "traka sa alatkama = 0, status = 0, širina = 626, visina = 436"); vrati false;)

Dodali smo novi okvir parametara, prethodno opisan, i interno, koristeći uslovni operator if (), povećavamo brojač, ovisno o broju prethodno dijeljenih dionica. Ovo završava samu skriptu, naravno, također morate ažurirati liniju u metodama twitter (), vk (), facebook ():

Share.popup (url);

Share.popup ($ this, url);

Sada, što se tiče HTML markupa, ispitali smo metodu init() iznad, a pošto je ovo tačka ulaska/pokretanja skripte, pozivamo je na stranici nakon povezivanja datoteka:

Takođe je vredno dodati span sa klasom ikona dugmetu:

Također je došlo do manjih promjena u CSS-u. Nadam se da ste dok pročitate ovaj paragraf već preuzeli arhivu s primjerom, ako ne, onda je preuzmite i koristite - sve radi. I sam koristim ovo rješenje u nekoliko projekata i nisam primijetio nikakve probleme.

Zdravo prijatelji! Danas će članak biti vrlo dugačak, ali u isto vrijeme izuzetno koristan. Zašto sam odlučio napisati ovaj članak? Činjenica je da me stalno pitaju kako da pridobim više fanova na ovu ili onu društvenu mrežu? Zašto se malo ljudi pretplati na moju Facebook stranicu? Zašto niko ne prati kompaniju na Twitteru?

Gotovo svaka kompanija danas ima web stranicu, pa čak i blog. Imate li web stranicu? Nadam se! Ako još niste, onda morate hitno razmisliti o tome! Pa, kod blogera i vlasnika slobodnih profesija (konsultanti i freelanceri), i tako je jasno, moraju imati svoju adresu na internetu - web stranicu. Prijatelji, problem je što je malo stranica stvarno optimizovanih za društvene mreže. Mogu proizvesti gomilu vrlo korisnih i zanimljivih sadržaja, ali ih niko ne vidi i ne čuje. SMO (optimizacija društvenih medija)- da li ste čuli za takav izraz? Dakle, ovaj isti CMO (optimizacija sajta za društvene mreže), niko nije uključen. Ali uzalud! Postoji bezbroj načina na koje stručnjaci znaju da kreiraju ono što je rečeno, pokret na web stranici. Jednostavne manipulacije + prisustvo ideja i kreativnosti mogu značajno pomoći vašoj kompaniji u promociji. To vam garantujem!

Dakle, u nastavku ću vam reći, kako instalirati zvanične društvene gumbe i widgete na web stranicu... Ovo će biti samo službeni gumbi i widgeti - bez usluga ili dodataka!

Društvene mreže su se jako potrudile i stvorile ogroman broj različitih dugmadi i widgeta. Za mnoge niko nije ni čuo, iako su besplatno dostupni svima. Ovdje ćemo razmotriti samo one najpotrebnije i najefikasnije koji će vam pomoći da povećate bazu obožavatelja, kao i da distribuciju vaših članaka i drugog sadržaja učinite jednostavnom i jednostavnom za posjetitelje vaše web stranice.

Ako želite da instalirate iste dugmad kao na mojoj stranici, onda je više o tome napisano.

Odaberite društvene mreže mreže čije dugmad želite da instalirate:

Vrste društvenih dugmadi

Prije nego što pređemo na upute za instaliranje dugmadi, želim da vam skrenem pažnju na činjenicu da postoje različite vrste dugmadi:

Facebook, kao i druge društvene mreže. mrežama postoji veliki izbor društvenih dugmadi i widgeta. Svaki od njih ima svoju funkciju i svrhu. U ovom odeljku ćemo razmotriti samo one koje se najčešće koriste i koje su najpotrebnije. Ostalo možete vidjeti i testirati na stranici programera na Facebooku.

Bilješka: Hajde da se odmah dogovorimo. U opisu svakog odjeljka dat ću vezu do stranice programera razmatrane društvene mreže. mreže. Na takvim stranicama možete pronaći linkove do svih postojećih dugmadi i widgeta. Stoga, odmah otvorite stranicu programera u posebnoj kartici i dalje pročitajte ovaj članak.

Facebook stranica programera: https://developers.facebook.com/docs/plugins

Dugme Like

Kako instalirati?

Instaliranje dugmeta "Sviđa mi se" je veoma jednostavno! Morate otići na stranicu programera na Facebooku (kao što smo se dogovorili, veza se nalazi na početku ovog odjeljka). Prije nego počnete kreirati nove gumbe i widgete, morate kreirati novu aplikaciju u meniju Aplikacije. Ovo je obavezno, jer bez ovoga Facebook vam neće dozvoliti da kreirate dugmad!

Ako imate bilo kakvih problema s kreiranjem aplikacije ili generiranjem skripti, javite mi se u komentarima, a ja ću vam dati još detaljnije upute kako instalirati dugmad.

Dakle, da postavite dugme "Sviđa mi se" na stranici za programere, u lijevoj koloni kliknite na " Dugme Like (mreža)«. Sada morate da izaberete neku od opcija koje nudi Facebook da biste dobili upravo onaj widget koji želite.

1) Url za lajk- unesite link do stranice, publikacije, odredišne ​​stranice za koju kreirate dugme "Sviđa mi se". To može biti bilo koja vrsta sadržaja, čak i slika ili video. Glavna stvar je da navedete link koji će korisnici dijeliti.

2) Širina- Ako imate ograničen prostor za dugme, tada možete odrediti širinu vidžeta u pikselima. Sama dugmad su mala, ali ako odaberete standardne tipke, tekst zauzima puno prostora. O tome ću govoriti u sljedećem paragrafu.

3) Izgled- Prikaz vidžeta. Facebook nudi 4 opcije za izbor: standardne (kao na slici), sa velikim brojačem, sa malim brojačem i samo dugmad. Sve zavisi od vašeg ukusa, stila sajta, raspoloživog prostora za dugmad, kao i od želje da se prikažu brojači (tj. koliko je ljudi kliknulo na dugme).

4) Vrsta akcije- tip radnje, odnosno tip dugmeta koji želite da instalirate: "Sviđa mi se" ili "Preporuči". Pisao sam detaljno o razlikama između ovih dugmadi - i općenito widgeta na Facebooku - u mom.

5) Pokažite lica prijatelja- ako želite da dugmad pokažu posetiocu vaše stranice avatare njegovih prijatelja koji su već kliknuli na dugme "Sviđa mi se", označite ovo polje. Ako niko od prijatelja nije lajkovao stranicu, članak itd., Facebook neće prikazati fotografiju, ali će u tekstu ponuditi korisniku da postane prvi kome se sviđa. Ako vam prostor dozvoljava, onda preporučujem da uključite ovu opciju, jer lica prijatelja pozitivno utiču na percepciju sadržaja od strane čitaoca, povećavajući njihovo poverenje i često ih gurajući da kliknu na dugme, makar samo iz solidarnosti .

Nakon što ste popunili sva polja, kliknite na dugme Uzmi kod da generišete kod koji ćete instalirati na sajt. Prvi dio skripte je postavljen na oznaku stranicu, a drugi dio je umetnut tamo gdje želite da instalirate dugme.

Stranica bi se trebala otvoriti na ruskom, ali ako je iz nekog čudnog razloga na engleskom, onda možete promijeniti jezik na samom vrhu stranice.

Kako instalirati?

Tweet dugme

Još jedno dobro poznato dugme na Twitteru je "Tweet", koje omogućava korisnicima da dijele vaš sadržaj sa pratiocima na Twitteru.

Kako instalirati?

Sva Twitter dugmad su instalirana na gore spomenutoj stranici programera. Proces za sve tipke je gotovo identičan - odabiremo željeni tip gumba, popunjavamo parametre i kopiramo kod, koji zatim zalijepimo na web stranicu.

Hashtag dugme

Ovo je veoma zanimljivo dugme, za koje, siguran sam, skoro niko ne zna. Ja lično nikada nisam vidio da ga neko na RuNetu koristi. Međutim, vrlo je dobar za određene zadatke. Na primjer, takvo dugme se može koristiti za promociju bilo kakvih događaja, webinara, Twitter diskusija pod određenom oznakom, marketinških kampanja, takmičenja. Bilo šta! Ovdje ima puno prostora za kreativnost!

Logično je ako je dugme "hashtag" instalirano na stranicama koje se odnose na ovaj hashtag. Na primjer, recimo da ste napisali članak o novom koji hostujete za fanove na Twitteru. Da biste učestvovali u takmičenju, morate koristiti određeni hashtag. Koristeći takvo dugme, olakšavate život osobi, jer će se klikom na njega otvoriti tweet sa željenim hashtagom. Može samo dodati malo teksta i poslati tweet da slobodno pluta. I on se osjeća dobro, a ti ćeš imati novog člana. Zar to nije sjajno? Jednom rečju, potrebno je kovati gvožđe bez napuštanja kase, odnosno dok je čitalac pod emocijom onog što je pročitao. Dvije minute kasnije, on se omesti i može potpuno zaboraviti ono što je upravo pročitao.

Dok mi je mašta krenula, podijelit ću s vama još jednu ideju. Recimo samo da ste domaćin događaja (online ili offline). Da biste ga promovirali, kreirate poseban članak ili stranicu posvećenu ovoj temi. Upravo tamo, u tekstu, umetnete dugme "Hashtag" i pored njega umetnete poseban widget koji će u realnom vremenu prikazati sve tweetove koji koriste ovaj hashtag. Nakon što pogledate diskusiju drugih korisnika, možda će vaš ne baš aktivan čitalac biti zreo da u njoj učestvuje. Ovdje je cilj skrenuti pažnju čitaoca na ono što se dešava, uključiti ga u diskusiju i, naravno, zadržati na stranici.

Kako instalirati?

Dugme "Hashtag" se instalira sa iste stranice o kojoj sam pisao gore.

Dugme za spominjanje

Na kraju ću vam reći još jedno dobro dugme koje niko, nažalost, ne koristi. Ali uzalud! Ovo je, moglo bi se reći, običan tvit upućen unaprijed određenom profilu. Mislim da je dugme malo korišćeno jer mnogi ne znaju kako i gde da ga instaliraju. Evo par primjera koji mi padaju na pamet. Ako znate da je vaša ciljna publika na Twitteru i da aktivno koristi ovu društvenu mrežu. mreže, zašto ne ohrabrite ljude da vam tvituju direktno sa stranice? To može biti tvit autoru članka, tvit sa stranice O nama ili Kontakt, tvit direktno Twitter podršci, itd. Vidite li koliko prilika propuštate za revitalizaciju vašeg Twitter naloga?

Ako osoba dođe na vašu stranicu, onda već ima neku vrstu interesa za vas, pa ga morate odmah potaknuti na akciju. Moglo bi biti prekasno za minut! Avaj, došla su vremena da vrlo brzo nešto zaboravimo da uradimo, jer svakog minuta prebacujemo pažnju s jedne na drugu. I što je vaša publika mlađa, to se ovaj fenomen više manifestira, stoga ne zaboravite na postojanje ovog gumba i pokušajte ga koristiti gdje je to prikladno.

Kako instalirati?

Sve dugme instaliramo sa iste stranice. Ako ste pročitali uputstva za prethodna dugmad, onda bi vam svi parametri dugmeta "Spomeni" na Twitteru trebali biti jasni.

U nastavku pogledajte kako funkcionira takvo dugme. Ne zaboravite da mi tvitate šta mislite o ovom članku 🙂 Važno mi je da znam šta moji čitaoci misle, pa bih voleo da čujem od vas.

Primjer dugmeta "Spomeni".

Twitter Widgeti

Shvatili smo Tviter dugmad. Sada bih vam ukratko ispričao o zvaničnim widgetima koje Twitter ima. Skripte za sve widgete, ovo možete dobiti veza.

Widgeti su sljedećih tipova:

• Redovni widget sa najnovijim tvitovima;
• Search widget, koji prikazuje rezultate pretrage za dati ključ u realnom vremenu. Ova vrsta widgeta je vrlo korisna za pretraživanje, na primjer, po hashtagu vašeg brenda. Pogledajte primjer njegove upotrebe u Twitter hashtag dugmetu;
• Omiljeni widget- prikazuje tweetove koje ste dodali u svoje favorite. Ova vrsta widgeta može se koristiti, na primjer, za prikazivanje pozitivnih recenzija o kompaniji. Zašto ne?
• Kolekcije widget- kolekcije su nešto između favorita i lista. Možete ručno odabrati koji će tvitovi biti uključeni u kolekciju. Imajte na umu da svaka kolekcija ima svoju vezu i opis. Ova funkcija se vrlo malo koristi na Twitteru, iako je vrlo zanimljiva.
• Listovi widget prikazuje liste profila koje ste kreirali. I ovdje možete biti kreativni i učiniti nešto zanimljivo i korisno za čitaoca, što će, ujedno, koristiti i vama. Šta kažete na listu partnera, račune vaše kompanije (ako ih ima mnogo), portfolio Twitter naloga kojima upravljate (za agencije i slobodnjake) ili, na primjer, listu članova vašeg kluba? Opet, prostor za kreativnost ovdje nije ograničen.

Primjer običnog Twitter widgeta

U kontaktu sa

Društvena mreža Vkontakte, kao i druge, ima čitavu gomilu različitih dugmadi i widgeta. Potpuna lista njih može se vidjeti na web stranici programera: https://vk.com/dev/sites

Opet ću proći kroz samo najvažnije, inače ovaj članak neće biti članak, već cijela knjiga... Mislim da će VK widgete biti mnogo lakši za razumijevanje, jer se web stranica i sva potrebna dokumentacija također nalaze u ruski.

Dugme Like

Kako instalirati?

Prvo treba da odete na widget stranicu. Dao sam vezu na listu widgeta na samom početku odjeljka Vkontakte.

Kako instalirati?

Da biste umetnuli widget Zajednice na stranicu, prije svega morate unijeti vezu na svoju stranicu ili grupu na Vkontakteu. Zatim birate da li želite da widget prikazuje lica članova benda ili obožavatelja stranice, kao i najnovije vijesti sa stranice, ili želite jednostavan dodatak sa dugmetom "Sviđa mi se". Budući da je VK widget vrlo sličan Facebooku, preporuke za vrstu dodatka ostaju iste. Neću se ponavljati, pa ako ste zainteresovani pogledajte odjeljak Facebook dodataka.

Sljedeći su parametri koji se odnose na veličinu i izgled dodatka. Sve ovisi o paleti boja vaše stranice i dostupnom prostoru za dodatak. U principu, možete odabrati bilo koju boju, ali se ipak preporučuje da zadržite originalnu paletu boja, jer su takve boje poznatije korisnicima i ne plaše ih. I konačno, došli smo do posljednje točke - ubacili smo kod u stranicu. Kao što se sjećate, prvi dio koda ulazi u oznaku stranice, a drugi dio na mjestu gdje će stajati plugin.

Nedavno sam napravio blog stranicu "O SMM-u" u Vkontakteu. Stoga, ako želite primati najnovija ažuriranja na ovoj društvenoj mreži. mreže, a zatim se pridružite!

Primjer dodatka "Zajednica" Vkontakte

Pretplatite se na autorski vidžet

Kao i njegov sličan Facebook dodatak, ovaj widget se preporučuje svima koji žele da razviju svoj lični brend. Ako ste, na primjer, autor knjige ili bloga, novinar, advokat, agent za nekretnine itd., zašto ne instalirate takvo dugme na svoju web stranicu? Potencijalnim kupcima je lakše uspostaviti kontakt sa stvarnom osobom nego, na primjer, sa stranicom ili grupom iza kojih nije jasno ko stoji. Ovako smo uređeni, osoba je društveno stvorenje, a volimo lični kontakt, pa će vam ovakav widget dobro doći svakom profesionalcu, u kojoj god oblasti da se bavite.

Kako instalirati?

Instalacija je jednostavna kao ljuštenje krušaka! Idite na widget stranicu u VK i unesite adresu svog profila. Zatim odaberite dugme koje želite da instalirate. Ponavljam još jednom da je poželjno instalirati samo dugmad preko skripte (na primjer, dugme ili svjetlo dugme). Ako vam je potrebna samo veza, onda je bolje to učiniti preko HTML koda, kako ne biste preopteretili stranicu skriptama, bez kojih možete vrlo lako. Učinak će biti isti, a stranica će se brže učitavati.

Ostali Vkontakte widgeti

Ljudi, gore sam naveo najčešće i najefikasnije VK widgete, ali lista nije ograničena na ovo. Vkontakte također ima čitavu gomilu različitih vidžeta koji mogu biti korisni u datoj situaciji. Na primjer, Anketa widget, koji skoro niko ne koristi. Ako ste kreirali anketu na svojoj VK stranici, zašto je ne biste umetnuli u članak na tu temu? Čitaoci vašeg sajta će moći da glasaju za svoju verziju direktno na vašoj veb lokaciji, a informacije o tome će ići na VK. Nije loše, zar ne?

Tu je i zanimljivo Vidžet za preporuke koji donosi najzanimljivije članke na vašem blogu ili web stranici. Stepen interesovanja za određeni sadržaj određuje se brojem klikova na dugme "Sviđa mi se". Ukratko, Vkontakte će automatski prebrojati koliko je korisnika kliknulo na gumbe "Sviđa mi se" i prikupit će sve najzanimljivije članke u ovom bloku. Ako je vaša ciljna publika dobro zastupljena na društvenim mrežama. mreže Vkontakte, trebali biste pokušati instalirati ova dva vidžeta: "Sviđa mi se" i "Preporuke". Siguran sam da rezultati neće dugo čekati!

LinkedIn

Hajde sada da pričamo o - LinkedIn-u. Ova mreža kod nas samo raste u popularnosti, tako da još uvijek malo ljudi razumije kako se može koristiti za postizanje pozitivnih rezultata. U Americi, odakle je ova mreža, malo profesionalaca ili kompanija nema LinkedIn profil. Tamo će vas iskosa pogledati, ako barem niste registrovani na društvenim mrežama. mreže. U Evropi je upotreba društvenih. mreža je veoma različita u zavisnosti od zemlje. Na primjer, Velika Britanija i Švedska su lideri u uključivanju LinkedIn-a u svoje marketinške strategije. Oni ne samo da preporučuju zaposlenicima da imaju online profile, već i zapošljavaju ljude preko LinkedIn-a, oglašavaju kompanije i proizvode, traže potencijalne klijente i partnere i još mnogo toga.

Ali danas o tome ne govorimo. Govorit ćemo o društvenim dodacima koje je LinkedIn razvio za nas i gdje i kako se mogu koristiti. Nemojte žuriti da kažete da vam ova mreža nije zanimljiva! A ako radite u oblasti konsaltinga, b2b, onda jednostavno morate pročitati ovaj odjeljak.

Dakle, LinkedIn, kao i svi društveni mediji. mreže, postoji posebna stranica na kojoj možete vidjeti sve postojeće gumbe i dodatke: https://developer.linkedin.com/plugins

Stranica za programere, nažalost, postoji samo na engleskom jeziku, pa ću pokušati što detaljnije objasniti instalaciju svakog dodatka i gumba.

Kako instalirati?

Kako instalirati?

Dugme "Pretplati se" instalirano je sa iste stranice programera, vezu na koju sam dao na početku odjeljka. U lijevoj koloni kliknite na " Pratite društvo»I LinkedIn će vam pokazati odjeljak koji želite. Prvo odaberite koju tipku želite da instalirate: sa vertikalnim ili horizontalnim brojačem ili možda najčešćim i kliknite na Uzmi ga... Zatim morate unijeti naziv kompanije za koju instalirate dugme. U odgovarajuću kolonu počnite pisati ime, slovo po slovo, i ono bi trebalo da se pojavi na listi. Ponekad je potrebno dosta vremena da se lista učita, pa ne zaboravite. Ime mora biti napisano tačno onako kako je napisano na stranici kompanije. Zatim odaberite jezik dugmeta - ruski, vrstu dugmeta i kliknite na dugme " da dobijem kod". Sada samo zalijepite kod gdje god želite na web mjestu i gotovi ste! Na ruskom, inače, dugme će se zvati "Track", što mi se baš i ne sviđa. Ja bih lično ostavio englesku verziju. Na sreću, svi već znaju šta znači riječ "prati" 🙂

Još nisam napravio stranicu kompanije na LinkedInu, tako da još nema pravog primjera. Ako u budućnosti napravim stranicu, svakako ću je ubaciti kao primjer u članak.

Dugme za lični profil

Ovo je još jedan dobar, ali opet nedovoljno iskorišten dodatak. Ovo dugme prikazuje ličnu fotografiju profila, naslov i prikazuje prijatelje korisnika koji vide ovaj dodatak. Naravno, da bi LinkedIn pokazao profesionalne veze čitaocu vaše stranice, on - čitalac - mora biti prijavljen (ako mogu tako reći) na LinkedIn. Ukratko, korisnik mora biti prijavljen na LinkedIn da bi dodatak funkcionirao u potpunosti.

Kome je ovaj dodatak koristan? Mislim da će ljudima koji rade u b2b sektoru to biti najkorisnije. Iako ga možete koristiti bilo gdje: na stranici o autorima stranice, na stranici o zaposlenima kompanije, na stranicama o vašim klijentima i partnerima (naravno uz njihovu dozvolu) - postoji mnogo opcija. Glavna stvar je da se takvi profilni gumbi organski uklapaju u vašu web stranicu i strategiju kompanije. Ako vaši zaposleni imaju napola popunjene profile, jednom godišnje se prijavljuju na LinkedIn i imaju 10 veza, onda nema smisla prikazivati ​​takve profile. Ako se, naprotiv, vaša kompanija aktivno promoviše na društvenim mrežama. mreže, takav dodatak može vam biti od velike koristi.

+1 dugme

Kako instalirati?

Kako instalirati?

Sva Pinterest dugmad i widgeti su instalirani sa gornje veze. Da biste instalirali dugme "Pin it", morate odabrati odgovarajuće dugme u lijevoj koloni.

Pinterest dugmad je malo teško podesiti jer imaju mnogo različitih opcija, ali je ipak sasvim moguće da ih sami postavite.

1) U prvom redu “ Tip dugmeta»Možete odabrati tip dugmeta koji želite da instalirate na sajt: datu sliku, bilo koju sliku sa stranice ili dugme Pin it koje će se pojaviti na slikama stranice/članka.

2) Drugi red je “ Izgled", To jest, vrsta dugmeta. Ovdje Pinterest nudi mnogo opcija za izbor: velike ili male; pravokutni ili okrugli; crvena, siva ili bijela; tekst na engleskom ili japanskom.

3) Treći red je brojač. Ovdje možete odabrati pult odozgo, sa strane ili ga potpuno ukloniti.

U zavisnosti od tipa dugmeta koji odaberete, njegove opcije će se promeniti.

• dugme " Jedna slika»Podrazumeva da želite da postavite određenu sliku koju čitalac sajta može da zakači za određeni link. To jest, čitatelj neće imati izbora, čak i ako na vašoj stranici postoje druge slike. Ako odlučite postaviti sliku za dugme, onda se takvo dugme mora instalirati zasebno na svaku stranicu, jer zahtijeva vezu do stranice / članka. U prvu kolonu potrebno je ubaciti link do stranice koju će korisnici dijeliti, odnosno link koji će pokrenuti. Zatim navedite vezu do slike. Usput, ovo može biti bilo koji izvor, čak i izvan vaše stranice. U posljednjoj koloni možete odrediti tekst za sliku koju će korisnik dijeliti. To može biti, na primjer, naslov stranice ili naslov članka. Prije slanja pina, korisnik po želji može zamijeniti vaš tekst svojim.
• dugme " Bilo koja slika„Ili bilo koju sliku. Ovo dugme je veoma jednostavno i ne zahteva nikakve dodatne parametre. Potrebno je samo da odaberete veličinu i tip dugmeta, kao i da odlučite da li vam je potreban brojač ili ne.
• dugme " Prebacite sliku“, odnosno dugme koje će se pojaviti na samoj slici kada kursor miša lebdi preko nje. Možete isprobati kako ovo funkcionira s Pinterest uzorkom slike.

Sad par riječi o kodu koju trebate instalirati na stranicu. Pinterest, kao i druge društvene mreže. mreže, ima dva koda: prvi dio se ubacuje u oznaku , a drugi dio na mjestu gdje je ugrađeno samo dugme. Ako imate više Pinterest dugmadi na istoj stranici, tada trebate samo jednom instalirati prvi kod.

Primjer dijela koda koji se postavlja samo jednom po oznaci stranice:.

Dugme za pretplatu

Pinterest, kao i Google+, ne pravi razliku između ličnih naloga i naloga preduzeća, tako da se dugme Pretplati se za oba kreira na istom mestu. Ovo dugme se veoma lako instalira. Sve što treba da uradite je da unesete link svog profila i date naziv dugmetu.

Kao što sam gore napisao, ne mogu umetnuti Pinterest dugmad zbog konflikta skripte, pa ako želite da se sprijateljite sa mnom na Pinterestu, samo slijedite ovaj link.

Bonus: hiperveze

U nastavku ću dati primjere kako se takve veze kreiraju ručno. Također možete isprobati namjenski generator linkova - Share Link Generator. Na ovoj stranici možete kreirati linkove za Facebook, Twitter, Google+, Pinterest i LinkedIn. Biće lako razumjeti stranicu, pa neću objašnjavati šta i kako. Međutim, pogledajte moje savjete, budući da generator linkova ne pruža potpunu vezu za format HTML + koda, kako da se link otvori u novom prozoru. Sve ovo plus primjeri društvenih veza. Vkontakte mreže, naći ćete u ovom odjeljku.

http://www.facebook.com/share.php?u= tvoj link «> tekst hiperveze

Vjerovatno nema web lokacija na internetu koje nisu hostovane. dugmad za objavljivanje materijala na društvenim mrežama. Potonji su dugo i čvrsto zauzeli mjesto u našim životima. Tamo komuniciramo, upoznajemo se, promoviramo posao, čitamo vijesti i tako dalje. Kompletan asortiman. Nije iznenađenje da webmasteri žele proširiti svoje prisustvo na društvenim mrežama na bilo koji način. Na kraju krajeva, postoji tona potencijalnog prometa koji je apsolutno svima potreban. Tok posetilaca je novac, reputacija, rast. Sve je izgrađeno oko njega. Ukusan zalogaj.

Dugmad za društvene mreže su, očigledno, neophodna. Pitanje je drugačije - koje odabrati? Testirali smo za vas TOP 5 različitih usluga za dodavanje koda dugmeta na stranice. Cilj je identificirati optimalni i detaljno ga prikazati. Krenimo od kvalifikacione faze.

Odabir najbolje usluge društvenih dugmadi

Izbor kandidata za poređenje pokazao se trivijalnim - uzeli smo najpopularnijih usluga , za koje je čula svaka osoba koja je blisko upoznata s temom izrade web stranice. Nisu rijetki, sve popularniji, samo iskusni starci.

Sastav tima atestiranih je sljedeći:

Kao rezultat testiranja odabranih socijalnih usluga - vođa je bio uSocial ... Sada biste željeli dobiti opravdanje za naš izbor. Naravno, nećemo ostati neosnovani.

Karakteristike uSocial dugmadi

Hajde da damo neke činjenice koji nas je uvjerio u ispravnost odluke.

Verbalno poređenje mnogima neće biti dovoljno. Stoga smo sastavili uporedna tabela dugmad od uSociala i drugih debitanata (koristi se ocjenjivačka skala od 1 do 5). Svi ovi podaci dobijeni su tokom testiranja.

Nadamo se da je provedena analiza uspjela razbiti vaše sumnje u ispravnost našeg izbora. Osim dobrog izgleda, dugmad za društvene mreže uSocial-a duboko su primijenjena u prirodi, te su prilično moćan alat za promociju bilo kakvih projekata.

Upute o tome kako instalirati dugmad društvenih medija na web stranicu

Da biste postavili dugmad društvenih mreža s uSociala na svoju web stranicu, trebate slijediti nekoliko jednostavnih koraka:

Korak 1

Korak-2

Sastavljanje skupa dugmadi za društvene mreže. Može birati prikazano usluge društvenih mreža, oblik i stil gumba.

Ovdje također možete aktivirati dugme "Gore", omogućiti podršku za mobilne uređaje, povezati usluge Viber, WhatsApp, Telegram, SMS.

Nakon završetka svih operacija, uđite adresa svoju stranicu i kliknite na dugme "Da dobijem kod".

Korak-3

Kopiraj kodscript u prozoru koji se pojavi. Morate umetnuti kod na onim stranicama svog resursa na kojima vam je potrebna ploča društvenih dugmadi. Na primjer, u podnožju prije završne oznake.

Korak-4

Nakon što instalirate društvenu traku sa vašeg uSocial ličnog naloga, možete pogledati statistika lajkova i repostova za odabrani period, kako odjednom za sve društvene mreže, tako i za odabrane. Podaci se prikazuju u obliku lako razumljivih grafikona ili grafikona.

Na vašem ličnom računu uSocial sve stvoreno setovi i statistika za lokacije na koje su bile vezane. U bilo kom trenutku možete se prebacivati ​​između lokacija i analizirati podatke primljene od šaltera.

Kako povećati efikasnost socijalnog bara?

Ako se prilikom ponovnog postavljanja materijala prikaže pogrešna slika i opis, možete ručno naznačiti šta, koliko i kako treba prikazati pomoću posebnih meta tagova koji su razumljivi svim društvenim mrežama. Ako se to ne učini, nasumične slike i opisi mogu biti prikazani na društvenim mrežama. Malo je vjerovatno da vam treba.

Pravilnim popunjavanjem društvenih meta tagova, objave će biti pravilno percipirane od strane društvenih servisa, jer ukazuju na vrstu materijala, relevantan naslov i link do željene slike. Sve ovo povećava efikasnost ponovnog objavljivanja: vaš materijal će biti ispravno indeksiran od strane društvenih službi.

Primjeri kod mikropodataka za popularne društvene mreže (kod mora biti napisan prije oznake):

1. Facebook i U kontaktu sa koristite Open Graph protokol:

3. Za Twitter kod izgleda ovako:

4. Za Google+ dakle:

- link do profila autora na Google+
- Naziv stranice
- tekst isječka (do 40 karaktera)
- opis stranice
- put do datoteke slike

Alati za rad sa mikro-oznakama.

Zdravo dragi prijatelji. Današnji članak će biti posvećen stvaranju bloka društvenih gumba bez usluga i dodataka. I ovaj blok će također uključivati ​​dugmad koja omogućavaju posjetiteljima web stranice da isprintaju stranicu, pošalju link na članak e-poštom i naprave oznaku za vaš članak. Takva dugmad se danas mogu naći na gotovo svakoj web stranici. Tek sada se implementiraju pomoću servisa ili dodataka. I pokazaću vam kako da to uradite sami.

Usluge koje sam koristio na klijentskim stranicama i na svom blogu - i. Ove usluge olakšavaju implementaciju zadatka.

Koja je prednost prilagođenih društvenih dugmadi u odnosu na usluge i dodatke

1. Naravno, brzina učitavanja web stranice je neosporan faktor. Tako, na primjer, usluga PLUSO koju koristim na blogu, u najboljem slučaju, dodaje 633 milisekundi učitavanju.

I u ovom bloku se koriste samo potrebne slike društvenih dugmadi, kombinovane u. Svi stilovi su svedeni na minimum. Plus jednostavan html okvir.

1. Metoda koju predlažem ne sadrži nikakve vanjske veze. Ne, postoje veze, ali će sve biti kao interne veze. Uvek ih možete imati ako želite. I tada se uopšte neće videti.

1. Vrlo jednostavna instalacija. Dovoljno je ubaciti html kod bloka u izvorni kod stranice web stranice, učitati sprite, dodati css stilove i instalacija je završena. Samo treba da ispravite putanju do datoteke sa slikama dugmadi.
2. Ova stavka prije nije plus ili minus u smjeru vlastitog bloka društvenih dugmadi. Trik je u tome što njegov sopstveni blok nema brojač klikova na dugme. I ovo se može računati kao minus. Ali, s druge strane, moguće je staviti svako dugme i tačno ćete znati koliko su puta vaši posetioci kliknuli na dugmad i podelili vaše članke na društvenim mrežama.
3. Statistike koje prikupljaju usluge na vašoj web stranici više se neće prosljeđivati ​​trećim stranama.

Umetanje bloka društvenih dugmadi u izvorni kod

Razmotrit ćemo klasičnu verziju, kada se gumbi nalaze iza članka.

Ovo se može učiniti otvaranjem datoteke odgovorne za prikaz članaka (single.php) i dodavanjem bloka društvenih dugmadi u izvorni kod. Alternativno, to se može uraditi preko funkcije funkcije teme (functions.php).

Ja ću pokazati obe opcije, a vi izaberite onu koja vam odgovara.

Umetanje bloka u single.php izvorni kod

Upozorenje: Pre nego što počnete, napravite rezervnu kopiju single.php fajla!

Otvaranje WordPress admin panela - "izgled" — "Urednik" — "Jedan unos (single.php)".

U izvornom kodu potražite mjesto gdje završava izlaz članka i počinju komentari ili navigacija po stranici. Ovo je mjesto gdje ćete morati umetnuti html kod bloka društvenih dugmadi.

Pažljivo pogledajte snimak ekrana, vodite se kodovima odgovornim za izlaz člankai komentari... I zalijepite kod ispod.

Naravno, postojaće neke razlike u vašim šablonima, ali siguran sam da ćete to shvatiti, u tome nema ništa teško. A osim toga, imate rezervnu kopiju, čega se ne treba bojati.

A evo i html koda samog bloka društvenih dugmadi:

Objašnjenja o kodu: to je jedan blok DIV sa class.share, koji sadrži linkove na društvene mreže. Veza se otvara u posebnom iskačućem prozoru, za to je odgovorna ova funkcija onClick = window.open. Zamjena linka na članak vrši se ovim kodom... Svaka veza ima svoju klasu kroz koju se dodjeljuje slika gumba.

Ovim se završava umetanje kroz izvorni kod. Zatim morate povezati css stilove.

Umetanje bloka u single.php izvorni kod preko funkcija teme

Upozorenje: prije početka rada napravite sigurnosnu kopiju datoteke functions.php!

Da biste koristili ovu opciju, morate otvoriti datoteku functions.php i dodati ovaj kod na samom kraju:

/ * Umetanje društvenih dugmadi * / add_action ("comments_template", "soc_button"); funkcija soc_button () (?> I budite oprezni nakon lijepljenja koda, ne biste trebali imati razmake i druge znakove. Ili samo zatvaranje php koda?>. U suprotnom, stranica će prestati s radom.

Objašnjenja o kodu: mjesto na kojem će biti prikazana dugmad društvenih medija definirano je putem API ključa comments_template. Ovaj ključ se koristi za određivanje mjesta prije komentara. Sam kod društvenih dugmadi je zatvoren u obrnutim php oznakama za otvaranje i zatvaranje. U kodu sam ih označio crvenom bojom. Ovo je trik umetanja html koda u php, preko funkcija teme.

Ova i ova metoda je završena, nastavljamo sa učitavanjem slika na stranicu.

Otpremanje slika dugmadi na server

Kao primjer, pripremio sam nekoliko sprijtova sa slikama društvenih dugmadi. Možete ih preuzeti.

Sprajt koji koristim kao primjer je samo 3,97 kb i sadrži samo dugmad koja su vam potrebna. A pošto je ovo sprite, onda postoji samo jedan zahtjev za bazu podataka, a ne za svako dugme posebno.

Preuzmite slike ili pripremite svoje i postavite ih na svoju web stranicu. Mislim da sa ovim ne bi trebalo biti nikakvih problema. Nadalje, veza do ovog sprite-a će biti potrebna za ukrašavanje dugmadi kroz css stilove.

Uključujući CSS stilove

Naravno, ovaj korak se može uraditi vrlo prvi, ali ja više volim da prvo obavim sve složene tehničke poslove, pa tek nakon toga da počnem sa prijatnim sitnicama sa css stilovima.

Dakle, otvorite datoteku style.css, koja je odgovorna za dizajn vaše stranice. I ubacite ove stilove:

Podijelite (display: inline-block; vertical-align: inherit; margin: 5px 0 0 2px; padding: 0px; font-size: 0px; širina: 40px; visina: 40px; background: url ("http: // test ..png ") no-repeat scroll 0px 0px transparent;) .share a.vkontakte (background: url (" http: //test..png") no-repeat scroll -168px 0px transparent;) .share a.google. (pozadina: url ("http: //test..png") pomicanje bez ponavljanja -252px 0px transparentno;) .share a.livejournal (pozadina: url ("http: //test..png") bez ponavljanja scroll -336px 0px transparentno;) .share a.twitter (background: url ("http: //test..png") no-repeat scroll -42px 0px transparent;) .share a.mail (background: url ("http : //test..png ") pomicanje bez ponavljanja -294px 0px transparentno;) .share a.odnoklassniki (pozadina: url (" http: //test..png ") pomicanje bez ponavljanja -126px 0px transparentno;) .share a.pinterest (background: url ("http: //test..png") no-repeat scroll -210px 0px transparent;) .share a.liveinternet (background: url ("http: //test..png") ") pomicanje bez ponavljanja -378px 0px transparentan; ) .share a.evernote (background: url ("http: //test..png") no-repeat scroll -420px 0px transparent;) .share a.bookmark (background: url ("http: // test .. png ") pomicanje bez ponavljanja -462px 0px transparentno;) .dijeljenje a.e-pošte (pozadina: url (" http: //test..png ") pomicanje bez ponavljanja -504px 0px transparentno;) .dijeljenje a.print ( background: url ("http: //test..png") pomicanje bez ponavljanja -546px 0px transparentno;) .share a.digg (pozadina: url ("http: //test..png") pomicanje bez ponavljanja -588px 0px transparentno;) .share a.spring (pozadina: url ("http: //test..png") pomicanje bez ponavljanja -630px 0px transparentno;)

Objašnjenja o kodu: klasa.share definiše opšti izgled bloka, veličinu svakog dugmeta, padding i postavlja jednu pozadinu. I tada svaka veza ima svoju klasu i svakoj takvoj vezi, kroz svojstvo pozadine, dodjeljuje se izgled dugmeta. Dugmad se izvode kao css sprite, a svako dugme ima širinu i visinu od 40px, sa razmakom od 2px između njih, što vam omogućava da precizno definišete sliku za svako dugme. Odnosno, prvo dugme je označeno kao 0, a drugo kao 42 i tako dalje. U kodu su ove vrijednosti označene narandžastom bojom. Veza do sprite-a je također istaknuta narandžastom bojom, promijenite je u putanju do vašeg sprite-a.

Ovim se završava cijeli proces kreiranja vlastitog bloka društvenih dugmadi. Možete bezbedno nastaviti sa provjerom.

A imam i video tutorijal u kojem je jasno prikazan cijeli proces, stub pokazuje rad samih dugmadi. Gledajte i ugradite na svoje web stranice i blogove.

To je to. On se nosio sa zadatkom. Želim vam svima puno sreće i vidimo se u novim člancima i video tutorijalima.

Sada postoji mnogo načina za dodavanje dugmadi društvenih medija na stranicu, postoji izbor i to je drago. Dugmad društvenih mreža igra važnu ulogu na stranici, uz njihovu pomoć, kao što mnogi već znaju, možete brzo repostirati bilo koju objavu na nekoj od odabranih društvenih mreža. Dugmad za društvene mreže sada se postavljaju bilo gdje i svuda, ali ponekad na pogrešnom mjestu.

Dugmad društvenih mreža za stranicu

Mnogi već znaju koliko su društvene mreže sada razvijene i kako je sjajno ako vaša web stranica ima takve tipke pomoću kojih možete dodati objavu koja vam se sviđa ili dio objave na svoj zid. Ovom akcijom ne samo da komentarišete ili ponovo postavljate poruke, već i dajete dodatni signal pretraživačima.

San svakog vlasnika sajta, ako će sve njegove objave čitaoci ponovo objaviti na svojim stranicama na jednoj od društvenih mreža. Danas je najveća potražnja za Vkontakte, Facebook, Twitter i Odnoklassniki. Dodao bih i LiveJournal, liveinternet i Blogger. Poželjno je dodati ove tipke na stranicu radi potpune pogodnosti korisnika.

Twitter posebno zaslužuje sve više pažnje danas, uz njegovu pomoć vaše nove publikacije se brže pojavljuju u indeksu pretraživača.

Ako ste vlasnik stranice, najvjerovatnije imate liveinternet ili LiveJournal nalog. Kako ne biste svaki put dodavali nove unose ovim uslugama, prisustvo njihovih dugmadi štedi vrijeme. Osim toga, mnogi ljudi koriste ove usluge i možda će htjeti ponovo objaviti vaš unos u svoj dnevnik.

Postoji nekoliko najboljih načina da brzo dodate dugmad društvenih mreža na svoju web stranicu. To možete učiniti pomoću online servisa koji će vam brzo i jednostavno pomoći u tome. Ili direktno preko svake društvene mreže posebno. Već postoji izbor za svakoga. Ranije su se gumbi dodavali odvojeno kroz svaku društvenu mrežu, sada sam instalirao pomoću usluge.

Postoji takva slična usluga, zove se share42... O njemu je napisano dosta materijala, koliko je dobar i kako ga treba koristiti. Dobro, ali za prosječnog korisnika koji ništa ne razumije u ovo, biće teško nositi se s tim.

Za tako malu lekciju, kopiranje foldera na hosting, a zatim znojenje sa stilovima, sada više ne vlada. Postoje i druge opcije u kojima morate kopirati i zalijepiti gotov kod bez ikakvih dodatnih foldera. Zato zaboravite na ovu uslugu.

Dodajte samo najosnovnije dugmad društvenih medija, koje koristi većina, nemojte oblikovati desetke nepotrebnih zaboravljenih dugmadi.

Šta danas možete koristiti za dodavanje dugmadi društvenih mreža za web lokaciju:

1. Uptolike service.
2. Yandex društvena dugmad.
3. Ručno dodavanje svake društvene mreže posebno.
4. Pluso service.
5. Korištenje WordPress dodataka (za lijene).

Vjerovatno nema potrebe da ulazite nigdje drugdje, nema boljeg načina da ga pronađete. Svaka od ovih opcija je dobra na svoj način. Ako znate pogodniji ili atraktivniji način, napišite u komentarima.

Dugme za društvene mreže moraju biti umetnute na kraju svakog članka, tako da nakon čitanja posjetitelj stranice može, po želji, ponovo objaviti vaš unos. Ne bi trebao da ih traži negdje na kraju stranice. Najoptimalnije mjesto, po mom mišljenju, gdje treba postaviti ovakva dugmad je u bočnoj traci i odmah na kraju svakog posta.

Uptolike

Trenutno koristim ovu uslugu, svidjela mi se. Pored pogodnosti, uptolike usluga ima nekoliko privilegija u odnosu na druge te vrste.

• Širok raspon dugmadi za društvene mreže;
• Tasteri su prilagođeni mobilnim uređajima;
• Mogućnost citiranja bilo kojeg dijela teksta na društvenoj mreži;
• Možete dodati dugme na vrh;
• Mogućnost dodavanja iskačućeg prozora za pretplatu na Vkontakte grupu;
• Odabir veličine ikona;
• Odabir stila ikona za stranicu;
• Dodajte efekat lebdenja;
• Promjena pozadine gumba, boje teksta, pozadine brojača;
• Povećajte ili smanjite tekst u brojaču.

Postoji dovoljno privilegija u odnosu na druge takve usluge da ga koristite. Ovo dodaje samo mali kod u obliku skripte i nekoliko linija sa stilovima. U isto vrijeme, nema vanjske veze, provjerio sam je putem usluge odlaznih veza. Ako griješim, možete me ispraviti.

Osim toga, šta još može da uradi uptolike servis.

Najvažnije postavke. Odabiremo dugmad društvenih mreža za stranicu koju želite vidjeti. Ako je potrebno, možete otvoriti listu i odabrati još nekoliko od većine. Stavljamo kvačicu na podršku. Nakon toga, na mobilnim telefonima, dugmad društvenih medija će uvijek biti prikazana na dnu ekrana.

Odabir horizontalnog položaja dugmadi, veličine i stila. Ukrasite ga kako god želite i dodajte efekat lebdenja. Ne morate ništa drugo da radite. Da biste generirali kod brojača, morate navesti adresu stranice i poštansko sanduče. Odmah nakon toga pojavit će se kod za umetanje društvenih dugmadi na stranicu.

Ako imate WordPress stranicu, otvorite single.php datoteku i zalijepite gotov kod odmah nakon što se sadržaj stranice završi. Osvježimo stranicu i vidimo šta se dogodilo. Nema ništa komplikovano.

Yandex.

Odabir potrebnih servisnih ikona. Twitter je dostupan samo u obliku ikona, bez brojača. Odabiremo izgled blokova i ispod će biti gotov kod za ugradnju. Kao što je ranije spomenuto, Yandexu ne dodajemo ništa drugo, sve je skromno i ukusno.

Metoda ručnog dodavanja

U ovoj metodi, trebate otvoriti svaku društvenu mrežu posebno i konfigurirati svako dugme za repost posebno. Da biste dodali dugme za facebook morate ići ovdje... Za drugove iz razreda i moj svijet, moram dodati podatke. Za twitter, sve se dešava. Da dodate dugme Vkontakte, idite na ovu stranicu .

Imaćete gotov kod samo sa društvenih mreža, bez ikakvih nepotrebnih skripti. Vjerojatno najbolji način za dodavanje dugmadi društvenih medija na web stranicu. Poteškoća nastaje u činjenici da je potrebno izrezati svako dugme posebno, zatim sve ubaciti na jedno mjesto i koristiti css stilove za poravnanje u jednoj koloni. Ako nemate poteškoća s ovim, možete pokušati.

U kontaktu sa

Da biste dodali dugme Vkontakte, kliknite na Poveži stranice i widgete, ispod će biti potpuna lista svih mogućih dodataka. Postoji i mogućnost dodavanja komentara na stranicu, objavljivanja na zidu, dodavanja vlastite grupe, preporuka, anketa, pretplate na autora i objavljivanja linkova. U našem slučaju odaberite Objavi veze.

Nema ništa komplikovano, biramo stil dugmeta (sa ili bez brojača), napišemo tekst na dugmetu, opciju logotipa i ispod će biti gotov kod za ugradnju. I sam sam koristio ovu metodu ručnog dodavanja, ali trenutno pokušavam koristiti uslugu treće strane. Da vidimo šta se dešava. Ako niste zadovoljni, odmah ću se vratiti na ručnu metodu.

Pluso

Drugi način za dodavanje dugmadi za web lokaciju koristeći Pluso service... Usluga je takođe dobra, mnogi su primetili dugmad sa nje. Izbor opcija dizajna je velik, osim amaterskih, postoje i velike veličine slika. Mogućnost dodavanja mreža ni na koji način nije inferiorna u odnosu na druge slične usluge. Za instalaciju nisu potrebni nikakvi fajlovi, samo kod.

Biramo bilo koji stil dizajna i dodajemo potrebne usluge. Malo ispod će biti prikazan gotov primjer kako će sve to izgledati na stranici. Možete odabrati veličinu ikona velike, srednje ili male. Takođe kvadratne ikone za sajt ili okrugle, u jednom redu ili u dva reda, horizontalne ili vertikalne. Sa ili bez brojača, bez pozadine ili postavite pozadinu koja odgovara dizajnu vaše web stranice.

Nakon svih ovih radnji, postojat će gotov kod za ugradnju u stranicu ispod. Ako trebate da ubacite na glavnu stranicu, mi ćemo proviriti u index.php fajl, ako u svim vašim postovima, dodajte kod u single.php fajl odmah nakon kraja posta.

WordPress

Ako ništa ne razumijete u ovom kodu, šta da kopirate gdje i kako sve funkcionira, postoji izlaz. Ako imate WordPress engine, možete instalirati dodatak koji će vam dati gumbe društvenih medija. Danas postoji mnogo takvih dodataka. Idite na admin panel - Plugins. Možete odmah napisati u potrazi za dodacima "društvena dugmad", "društveno" ili "VKontakte". Siguran sam da ćeš naći nešto.

Među većinom takvih sličnih WordPress dodataka, gledajući ocjenu, sljedeći su najomiljeniji:

1. Dugmad za dijeljenje na društvenim mrežama za WordPress.
2. Social.
3. Social Media Feather - lagana dugmad za dijeljenje i praćenje na društvenim mrežama.

U stvari, postoji mnogo sličnih takvih dodataka, potrebno je da instalirate i sredite koji vam se najviše sviđa, radi ispravno, šta prikazuje i kako ga možete prilagoditi sebi. Uzmimo primjer prvog takvog dodatka, Social Share Buttons za WordPress.

Sam plugin je na ruskom jeziku, s tim neće biti problema. Jednom instalirano, novo dugme "Share Buttons" će se pojaviti na lijevoj strani menija. U glavnim postavkama stavljamo logo stranice i ispisujemo tekst ispred društvenih dugmadi.

Obavezno uključite generiranje meta podataka, bit će uključeni naslov i opis stranice. Poravnajte dugmad vodoravno i odaberite gdje će biti. Biramo samo u objavama. Po želji možete isključiti tražene stranice. Na samom dnu morate navesti nadimak u triteru.

Na sljedećoj kartici Postavke dijeljenja biramo stil dugmadi. U nastavku možete omogućiti ili onemogućiti nepotrebne društvene mreže i dodati uvlake za cijeli blok na vrhu ili na dnu. Ne morate nigdje stavljati dodatni kod, dodatak će sve učiniti umjesto vas.

Izbor je na vama, koju metodu ćete koristiti. Dodajte ikone društvenih medija putem uptolike, Pluso ili Yandex. Ne biste trebali odmah instalirati dodatak na WordPress, pokušajte sve učiniti ručno ili pomoću usluge.

Ako znate neku drugu dobru uslugu ili način da dodate dugmad društvenih mreža za stranicu, bio bih vam zahvalan na komentaru.