Vi infogar "Gilla"-knappen från VKontakte. Din egen text för "Gilla"-knappen Vkontakte

Hej alla vänner! För några veckor sedan skrev jag och . Idag kommer vi att fortsätta att använda sociala nätverk för att marknadsföra sidan. I det här inlägget kommer jag att skriva hur knappen jag gillar VKontakte och knappen jag gillar facebook är installerade på sajten.

Hur man installerar "Gilla"-knappen från Vkontakte

För att du ska se en vacker knapp från VKontakte på din webbplats behöver du bara ta tre steg:

  1. Lägg till webbplats i sociala medier vkontakte nätverk;
  2. Ställa in utseende knappar;
  3. Kopiera koden och klistra in den på din webbplats.

Som du kan se installeras knappen jag gillar på webbplatsen väldigt snabbt. Och nu om allt i ordning.

1. Gå först här och anslut din webbplats om den inte finns där. För att göra detta, fyll i några fält. Så här görs det för mig:

2. Nu måste du anpassa utseendet på knappen. Nedan kan du alltid se vad du har. Jag valde till exempel en knapp med miniatyrräknare. Namnet på knappen "Jag gillar". Och lämnade höjden som 22 px.

3. När du har anpassat utseendet på knappen måste du kopiera koden och klistra in den på din webbplats. För att komma igång, kopiera den första delen av koden

och klistra in den i header.php före taggen /huvud(om sajten finns på wordpress-motorn). Kopiera sedan den andra delen av koden

Efter att ha infogat den andra delen av koden bör du se en knapp från VKontakte "Jag gillar" på din webbplats. Om du har några problem, skriv då i kommentarerna, jag ska försöka hjälpa: smile :.

Hur man installerar Facebook Gilla-knappen

För att komma igång, gå hit. Om du inte är behörig, gör det. Nu på denna sida måste vi fylla i några fält först. Fast de är på engelska språket, men det är okej, vi får reda på det :smile:.

  • URL att gilla - . Vi lämnar detta fält tomt, eftersom vi vill installera knappen på alla sidor;
  • Höjd - höjd. Du kan inte lämna något, som standard är höjden på knappen normal;
  • Layout - här måste vi ange utseendet på knappen. Jag valde det sista alternativet button_count, enligt min mening är det det bästa. Du kan prova att välja ett annat alternativ och se hur det ser ut. Om du gillar box_count eller standard mer, använd vad du vill.
  • Show Friends" Faces - show. Jag avmarkerade det eftersom jag inte vill visa avatarer.
  • Bredd - bredd. Jag har inte ställt in något, om knappens bredd inte passar dig kan du ange det.
  • Färgschema - färgschema. Lämnade standardljuset (ljus).
  • åtgärdstyp. Om du väljer gilla, kommer inskriptionen på knappen att vara "gilla". Och om rekommenderar, då "jag rekommenderar". Jag valde det första alternativet som (gilla).
  • Inkludera Skicka-knapp - Inkludera "Skicka"-knappen. Jag behöver det inte, så jag avmarkerade det.

Efter att ha fyllt i alla fält fick jag vattnet så här:


Klicka nu på knappen "Hämta kod" för att få koden.



Du måste placera den första delen av koden i filen footer.php före taggen /kropp. Och den andra delen till platsen där du vill se "Gilla"-knappen från Facebook på din sida. Du kan placera efter koden för "Gilla"-knappen från Vkontakte i filen single.php.
Det var allt för mig. Hur gillar du artikeln? 😉

Dödade några dagar tills jag räknade ut till slutet med alla klockor och visselpipor av "I like"-knapparna från VKontakte och facebook. Hur är det med dynamiskt innehåll? Hur ändrar man texten i inlägget på väggen?
Jag kommer att skriva om Facebook i detalj i en annan artikel, där är principerna annorlunda. Samtidigt som jag vill fokusera på det populära "Gilla"-knapp från Vkontakte.

Nu är det redan väldigt annorlunda från de första prototyperna, som bara var länkar till kontakthanterarsidor, och från de som redan hade räknare.

För närvarande är "gilla"-knappen en del av Vkontakte API, den ansluter bara till det enda widgetmärket, om jag inte har fel, och är en widget som använder Vkontaktes huvudsakliga API.

Detta innebär att vi säkert kan använda alla funktioner i detta API, och ofta tar vi bort begränsningen "endast widgets" när vi ansluter. Intressant nog, tills nyligen, fanns det ingen information om funktionernas funktioner VK.Widgets.Like() så jag fick lida själv. Men nu förklaras allt för oss på en speciell dokumentationssida för "gilla"-knappwidgeten.

Så för att ansluta jag gillar-knappen måste du gå till VK-webbplatsen "utvecklare" -> "Widgets och tredjepartswebbplatser" -> "Jag gillar det". Om det behövs, anslut webbplatsen och välj knappalternativ.

Vi har kopplat API-skripten och initieringen av applikationen för att fungera med själva VKontakte API och specifikt med det specifika fallet - widgeten "Jag gillar".
På rätt plats på sidan infogar vi widgetknappkoden:

Sedan, i rätt ögonblick, till exempel, på dokument redo, visar vi knappen:

VK.Widgets.Like("profprogru_vk_like", (typ: "knapp"));

Det var det, nu har vi en knapp med en räknare. Men det räcker inte för oss, eller hur?

Hur man gör en knapp "Jag gillar" Vkontakte för en webbplats med dynamiskt innehåll, var ändras sidans webbadress, eller bara några knappar med olika länkar? Det finns bara en princip, vi kommer att slutföra koden:

VK.Widgets.Like("profprogru_vk_like", (typ: "button", pageTitle: "Fri text", pageDescription: "Popup text",pageUrl:"här är en länk till sidan"),666);

Förklara nu, vi uppdaterar knappen. I lockiga hängslen, widgetparametrarna "Jag gillar", skriv: knapp med en räknare, VKontakte-inläggstext, popup-text, sidlänk och 666 är en unik länkidentifierare för att räkna likes. De där. vi kan installera flera "gilla"-knappar med olika identifierare och en länk, eller till och med flera helt olika "gilla"-knappar med olika länkar och display.

Jag hoppas att informationen inte var värdelös.




Hallå! Idag kommer jag att berätta hur du snabbt skapar en applikation och infogar en knapp " jag gillar"från socialt nätverk utan extra plugins.

Du kanske märkte det, häromdagen skruvade jag äntligen på den här knappen efter mina inlägg. "Äntligen" skrev jag inte för ingenting, eftersom det fanns problem med att ansluta den här knappen till VKontakte API, som ett resultat av vilket jag fick inskriptionen " Öppna API-säkerhetsbrott" och en oändligt löpande förloppsindikator. Det visade sig att allt handlade om banal skrivning av webbplatsadressen i inställningarna " Öppna API"i själva VKontakte (jag kommer att skriva om detta nedan).

Så låt oss skruva på knappen " jag gillar".

Låt oss först gå igenom vår profil i VK (nödvändigtvis genom vår egen, eftersom vi måste skapa en applikation). Gå sedan till sidan för att skapa widgetar och se ett liknande formulär:

Första fältet " Webbplats/app"- här kommer vi omedelbart att kunna skapa en applikation utan onödiga gester, men du vet, jag klackade så och det skapas på något sätt genom * oj snett.

Skapa och konfigurera en applikation

Så det är bättre att göra extra gester och gå till sidan för att skapa applikationer, ange vilket namn som helst i lämpligt fält och välj sedan typen: " Hemsida", och fyll i fältet med en beskrivning, men detta är inte nödvändigt. Klicka sedan på " Gå till app-nedladdning och ange captcha.

Allt! Ansökan har skapats och vi har ett formulär med dess inställningar:

Första fliken " Information", den är nu aktiv för dig, du kan ladda upp en ikon för applikationen, ange data, välja en grupp.

Nästa flik " inställningar", hon är den viktigaste! Observera att den är markerad med fet stil längst upp. ID numret på din applikation (den kommer att ansluta din knapp), följt av " Säker nyckel"Rör honom inte.

Webbadress: http://dinwebbplats.com/ (adressen som du ansluter Open API till. Om du använder den här applikationen på en annan webbplats eller på en lokal värd kommer den inte att fungera. Applikationen är helt knuten till adressen till webbplatsen som anges här .)

Ett extra snedstreck i adressinställningarna och din knapp kommer inte att ansluta, den kommer att visa ett felmeddelande " Öppna API-säkerhetsbrott".

Det är allt, spara ändringarna, du kan inte konfigurera resten av flikarna.

Konfigurera och infoga en knapp

Vi återgår till formuläret för att skapa en knapp och här redan i fältet " Webbplats/app" Din applikation bör visas i rullgardinsmenyn, välj den.

nästa objekt" Knappalternativ"- välj vilken som passar din design bäst, ett visuellt exempel på en knapp visas direkt under formuläret. det här ögonblicket Det finns 4 typer av knappar:

  • Knapp med texträknare
  • Knapp med miniatyrräknare
  • miniatyr knapp
  • Miniatyrknapp, bänk på toppen

Knapptyp vald, nu objekt " Knappens namn", hittills finns det 2 alternativ (välj något du gillar):

  • jag gillar
  • Det är intressant

Nåväl, äntligen kom vi till fältet" Inbäddade koden". När du har valt din applikation i det första fältet, infogas dess ID automatiskt i koden. Denna kod måste infogas på två ställen på din sida, utvecklarna kommenterade det speciellt, men jag kommer också att förklara för säkerhets skull.

Första koden:

måste infogas i taggen:

Och den andra biten:

måste infogas på den plats på platsen där knappen ska visas.

Klistra inte in min kod, jag gav den som exempel, speciellt eftersom jag har fel knappinställningar och ID inte är specificerat.

Och det är allt, din knapp är klar!

Knappomslag

Som du kan se är knappen placerad i div med ID" vk_like", där stilen för dess visning registreras. Och i denna stil infogade utvecklarna regeln:

klara: båda;

Som vi vet avbryter denna regel flödet runt elementet från höger och vänster kant, d.v.s. om du vill att din knapp ska vara i linje med resten av de sociala knapparna. nätverk, du kan inte drömma, kommer hon stolt stå på ny linje. För att undvika detta och fortfarande återställa knappen till raden, byt ut:

Så här avbryter vi ångra (:-D) lindningen runt elementet, och " !Viktig" ökar prioriteringen av din stil, d.v.s. din regel i webbläsarens ögon kommer att vara den viktigaste.

Tja, det verkar som att alla sa vad han ville)))) Jag hoppas att du förstod allt och att du lyckades sätta in en knapp!

Och om du fortfarande har lång tid på dig innan du sätter in knappen, eftersom du inte har din egen webbplats ännu, kanske skapandet av Cheboksary-webbplatser hjälper dig med detta.

Hur man lägger till en "Gilla"-knapp för kontakt på din blogg

Så för att installera den här knappen på din blogg

skapa , gå sedan till , anslut en ny webbplats och välj önskat knappalternativ:

Denna kod måste infogas i taggen (i header.php-fil):

Glöm inte istället för tecken ###### infoga dina individuella nummer!

Och klistra in den här koden på den plats där du vill placera din knapp:

Som du kan se placerade jag den här knappen efter varje blogginlägg (single.php-fil).

Hur man lägger till en Gilla-knapp på Facebook

Vi kom på widgeten för Vkontakte.ru, nu måste du installera widgeten för Facebook.

Gå till, vi ser detta fönster:

URL att gilla - lämna detta fält tomt

Layout Style - counter style (jag valde standarden).

Bredd - knappens bredd. Plocka upp det för din design (jag valde 450px).

Verb att visa - vilket ord kommer att visas på knappen: Gilla (Gilla) eller Rekommendera (Rekommendera). Jag bestämde mig för det första alternativet.

Teckensnitt (teckensnitt) och färgschema ( Färgschema) välj efter din smak.

När du har gjort de nödvändiga inställningarna klickar du på knappen Hämta kod:

Följande fönster kommer att visas:

Vi är intresserade av koden från det översta fältet iframe. Kopiera den här koden till den plats där du vill se knappen "Jag gillar".

Nu väldigt viktig poäng! Om du har en WordPress-blogg, så efter

http://www.facebook.com/plugins/like.php?href=

behöver sätta in

Min kod ser ut så här:

Uppdatering januari 2012: Bara häromdagen, på vissa webbplatser, slutade Gilla-knappen från Facebook att fungera, som installerades med metoden som beskrivs ovan. Här är en alternativ fungerande version av knappen med html5:

Denna kod infogas direkt efter taggen

Och här är denna kodbit, på den plats där du vill visa knappen:

Som du kan se tar det inte mer än 5 minuter att installera dessa knappar :). Och berätta inte för mig senare att du inte har tillräckligt med tid för sådana bagateller - alla metoder är bra för att locka besökare!

P.S. Har du någonsin undrat hur många sajter det finns på Internet? Personligen gör jag inte det. Men då vet jag var du kan hitta de mest populära sajterna i världen. Allas favorit Twitter ligger på 9:e plats!

Föregående Nästa

Jag noterade vikten av SMO (Social Media Optimization) vid marknadsföring av webbplatser. Låt oss nu prata direkt om hur man gör social optimering på din webbplats, eller snarare, hur man lägger till sociala knappar för populära nätverk på webbplatsen.

Till att börja med ska jag visa hur det faktiskt ska se ut på sajten. På många bloggar och nyhetssajter, längst ner efter en artikel, kan du se något i stil med detta:

Dessa är de sociala knapparna, tack vare vilka SMO uppnås, och sedan social aktivitet. Den här artikeln ägnas åt frågan om var man kan få koden för dessa sociala nätverk. knappar och hur du korrekt installerar dem på din webbplats. Överväg att installera Google+ först.

1. Lägga till en Google+-knapp på webbplatsen

2. Lägga till en "Gilla"-knapp från Vkontakte och Facebook till sajten

2.1. Jag gillar från facebook

Låt oss börja med att skaffa knappkoden för Facebook. För att göra detta, gå till den här sidan: https://developers.facebook.com/docs/plugins/like-button . Du bör se följande bild:

Uppe till höger visar hur knappen kommer att se ut på din webbplats. Låt oss titta på parametrarna som kan ställas in:

1. URL att gilla
Detta är en valfri parameter. Om du lämnar fältet tomt, kommer varje sida att ha sin egen individuella like-räknare. Om du anger någon specifik URLa-adress där, kommer räknaren att vara en (gilla-markeringar sammanfattas från alla sidor på denna webbplats).

2. Skicka-knapp
Lägg till eller ta bort en knapp för att skicka meddelanden. Jag rekommenderar att du tar bort den här knappen, eftersom vårt mål är bara att sätta en "gilla"-knapp, även om du kan ha helt andra mål.

3. Layoutstil
Knappvisningsstil. Personligen gillar jag standard bäst.

4. Bredd
Knappens bredd i pixlar. Jag brukar inte lägga mer än 100 pixlar.

5.Verb att visa
Vad kommer att visas på knappen: "Jag gillar" eller "Jag rekommenderar". Jag brukar välja det första alternativet (det är standard) eftersom det är ett mer effektivt sätt att motivera användaren att gilla.

6. Färgschema
Färg: antingen vit eller svart.

7 Teckensnitt
Ställ bara in typsnittet för inskriptionen "Jag gillar det".

Efter att ha gjort inställningarna tjänar vi pengar på knappen "get code" och placerar den på sajten. Normal knappkod för facebook:

<-- placera den här delen av koden i slutet av sidan-->
<-- эту часть кода нужно разместить в месте отображения: -->

2.2. Мне нравится от ВКонтакте

Теперь рассмотрим как получить код кнопки "мне нравится" от ВКонтакте. Для этого перейдите на следующую страницу: https://vk.com/dev . У Вас должна открыться следующая страница:

Сначала нужно будет добавить новый сайт. Для этого выберите из выпадающего меню "сайт/приложение" пункт подключить новый сайт:

После добавления нового сайта сохраните его. Теперь выберите из выпадающего меню нужный сайт. Далее следуют небольшое число параметров: "вариант кнопки", "высота", "название кнопки" - это все настраивается под Ваш вкус. В конце будет код для кнопки:

3. Добавляем на сайт кнопку tweet

Как и в предыдущих случаях, для начала перейдите в место получения и настройки кнопки.

Dela med sig