Įdėkite mygtuką „Patinka“ iš „VKontakte“. Jūsų tekstas mygtukui „Patinka“ VKontakte

Sveiki visi, draugai! Prieš kelias savaites rašiau ir . Šiandien reklamuodami svetainę ir toliau naudosime socialinius tinklus. Šiame įraše parašysiu, kaip svetainėje yra įdiegtas mygtukas Man patinka VKontakte ir mygtukas Man patinka Facebook.

Kaip įdiegti mygtuką „Patinka“ „VKontakte“.

Kad savo svetainėje pamatytumėte gražų „VKontakte“ mygtuką, turite atlikti tik tris veiksmus:

  • Pridėkite svetainę prie socialinės žiniasklaidos „VKontakte“ tinklas;
  • Melodija išvaizda mygtukai;
  • Nukopijuokite kodą ir įklijuokite jį į savo svetainę.
  • Kaip matote, mygtukas „Man patinka“ svetainėje įdiegiamas labai greitai. Dabar pakalbėkime apie viską iš eilės.

    1. Eik pirmas Štai čia ir prijunkite savo svetainę, jei jos ten nėra. Norėdami tai padaryti, užpildykite kelis laukus. Štai kaip aš tai padariau:

    2. Dabar reikia tinkinti mygtuko išvaizdą. Žemiau visada galite pamatyti, ką turite. Pavyzdžiui, aš pasirinkau mygtuką su miniatiūriniu skaitikliu. Mygtuko "patinka" pavadinimas. O aukštį palikau ties 22 px.

    3. Pritaikę mygtuko išvaizdą, turite nukopijuoti kodą ir įklijuoti jį į savo svetainę. Pirmiausia nukopijuokite pirmąją kodo dalį

    ir įterpkite jį į header.php prieš žymą /head (jei svetainę palaiko Wordpress). Po to nukopijuokite antrąją kodo dalį

    Įdėję antrąją kodo dalį, savo svetainėje turėtumėte pamatyti mygtuką „Man patinka“ iš „VKontakte“. Jei turite problemų, rašykite komentaruose, aš pasistengsiu padėti: šypsokitės:.

    Kaip įdiegti „Facebook“ patinka mygtuką

    Norėdami pradėti, eikite čia. Jei nesate prisijungę, prašome tai padaryti. Dabar šiame puslapyje pirmiausia turime užpildyti kai kuriuos laukus. Nors jie yra įjungti Anglų kalba, bet viskas gerai, mes tai išsiaiškinsime: šypsokis:.

    • Patinka URL – . Šį lauką paliekame tuščią, nes norime įdiegti mygtuką visuose puslapiuose;
    • Aukštis – aukštis. Jums nereikia nieko nustatyti, pagal numatytuosius nustatymus mygtuko aukštis yra normalus;
    • Išdėstymas – čia reikia nurodyti mygtuko išvaizdą. Pasirinkau paskutinį variantą button_count, mano nuomone, jis yra geriausias. Galite išbandyti kitą variantą ir pamatyti, kaip jis atrodo. Jei jums labiau patinka box_count arba standartas, įdėkite tą, kuris jums patinka.
    • Rodyti draugus" Veidai – rodyti. Atžymėjau, nes nenoriu rodyti avatarų.
    • Plotis – plotis. Nieko nenustačiau, jei mygtuko plotis jums netinka, galite nurodyti.
    • Spalvų schema – spalvų schema. Palikau prie numatytosios lemputės.
    • Veiksmo tipas. Jei pasirinksite patinka, tada mygtuko užrašas bus "patinka". Ir jei rekomenduoju, tada „rekomenduoju“. Aš pasirinkau pirmą variantą kaip.
    • Įtraukti siuntimo mygtuką – įtraukite mygtuką „Siųsti“. Man jo nereikia, todėl panaikinau žymėjimą.

    Užpildžiusi visus laukus, gavosi taip:


    Dabar spustelėkite mygtuką „Gauti kodą“, kad gautumėte kodą.



    Pirmąją kodo dalį turite įdėti į footer.php failą prieš žymą /body. O antroji dalis yra toje vietoje, kur norite savo svetainėje matyti Facebook mygtuką „Patinka“. Galite įdėti mygtuką „Patinka“ iš „VKontakte“ po kodo į single.php failą.
    Tai viskas man. Kaip jums patinka straipsnis? 😉

    Man prireikė kelių dienų, kad iki galo suprasčiau visus VKontakte ir Facebook mygtukų „Man patinka“ varpelius ir švilpukus. O dinamiškas turinys? Kaip pakeisti įrašo tekstą ant sienos?
    Išsamiai apie Facebook parašysiu kitame straipsnyje, ten principai kitokie. Šiuo metu noriu sutelkti dėmesį į populiarų „VKontakte“ mygtuką „Patinka“.

    Dabar jis jau labai skiriasi nuo pirmųjų prototipų, kurie buvo tiesiog nuorodos į kontaktų tvarkytojų puslapius, ir nuo tų, kurie jau turėjo skaitiklius.

    Šiuo metu mygtukas „Man patinka“ yra „Vkontakte“ API dalis, jis tiesiog susietas su „tik valdiklių“ ženklu, jei neklystu, ir yra valdiklis, kuris naudoja pagrindinę „Vkontakte“ API.

    Tai reiškia, kad galime saugiai naudotis visomis šios API galimybėmis, dažnai jungiantis panaikindami „tik valdiklių“ apribojimą. Įdomu tai, kad dar visai neseniai nebuvo informacijos apie funkcijos VK.Widgets.Like() galimybes, tad teko kentėti pačiam. Bet dabar viskas mums paaiškinta specialus puslapis mygtuko „patinka“ valdiklio dokumentaciją.

    Taigi, norėdami prijungti mygtuką Man patinka, turite eiti į VK svetainę „kūrėjai“ -> „Valdikliai ir trečiųjų šalių svetainės“ -> „Man patinka““. Jei reikia, prijunkite svetainę ir pasirinkite mygtuko parametrus.

    VK.init((apiId: 2887573, tik valdikliai: tiesa));

    Sujungėme API scenarijus ir programos inicijavimą, kad veiktų su pačia VKontakte API ir konkrečiai su šiuo konkrečiu atveju – valdikliu „Man patinka“.
    Tinkamoje puslapio vietoje įterpiame valdiklio mygtuko kodą:

    Tada tinkamu momentu, pavyzdžiui, kai dokumentas yra paruoštas, parodome mygtuką:

    VK.Widgets.Like("profprogru_vk_like", (tipas: "button"));

    Tai viskas, dabar turime mygtuką su skaitikliu. Bet mums to neužtenka, tiesa?

    Kaip padaryti „VKontakte“ mygtuką „patinka“ svetainei su dinamišku turiniu, kur keičiasi puslapio url?, ar tik keli mygtukai su skirtingomis nuorodomis? Yra tik vienas principas, pakeiskime kodą:

    VK.Widgets.Like("profprogru_vk_like", (tipas: "mygtukas", puslapioPavadinimas: "Laisvas tekstas", puslapisAprašymas: "Iššokantis tekstas", puslapioUrl: "čia nuoroda į puslapį"),666);

    Dabar leiskite man paaiškinti, mes atnaujiname mygtuką. Garbanotuose skliaustuose yra valdiklio „Man patinka“ parametrai, įveskite: mygtukas su skaitikliu, „VKontakte“ įrašo tekstas, iššokančiojo lango tekstas, puslapio nuoroda ir 666 yra unikalus nuorodos identifikatorius, skirtas skaičiuoti, kad patinka. Tie. galime įdiegti kelis „man patinka“ mygtukus su skirtingais identifikatoriais ir viena nuoroda arba net kelis visiškai skirtingus „man patinka“ mygtukus su skirtingomis nuorodomis ir ekranu.

    Tikiuosi, kad informacija nebuvo bevertė.


    

    Sveiki! Šiandien aš jums pasakysiu, kaip greitai sukurti programą ir įterpti mygtuką „Patinka“. Socialinis tinklas be nereikalingų įskiepių.

    Galbūt pastebėjote, kad kitą dieną po paskelbimo pagaliau pridėjau šį mygtuką prie savęs. „Pagaliau“ rašiau ne veltui, nes kilo problemų prijungiant šį mygtuką prie „VKontakte“ API, dėl to gavau pranešimą „Atidaryti API saugumo pažeidimą“ ir be galo veikiančią eigos juostą. Kaip paaiškėjo, visa esmė buvo banalus svetainės adreso rašymas „Open API“ nustatymuose pačioje „VKontakte“ (apie tai parašysiu žemiau).

    Taigi, pridėkime mygtuką "Patinka".

    Pirmiausia pereikime prie savo VK profilio (būtinai per savo, nes turėsime sukurti programą). Tada eikite į valdiklio kūrimo puslapį ir peržiūrėkite panašią formą:

    Pirmas laukas yra “Svetainė/aplikacija” – čia galime iš karto sukurti aplikaciją be nereikalingų judesių, bet žinai, aš taip paspaudžiau ir susidaro kažkaip kreivai.

    Programos kūrimas ir konfigūravimas

    Taigi geriau atlikti papildomą darbą ir eiti į programos kūrimo puslapį, atitinkamame lauke įveskite bet kokį pavadinimą, tada pasirinkite tipą: „Svetainė“ ir užpildykite aprašymo lauką, bet tai nėra būtina. Tada spustelėkite „Tęsti atsisiųsti programą“ ir įveskite „captcha“.

    Viskas! Programa buvo sukurta ir turime formą su jos nustatymais:

    Pirmasis skirtukas yra „Informacija“, jis dabar jums aktyvus, galite įkelti programos piktogramą, įvesti duomenis, pasirinkti grupę.

    Kitas skirtukas yra „Nustatymai“, jis yra pats svarbiausias! Atkreipkite dėmesį, kad pačiame viršuje jūsų programos ID numeris yra paryškintas pusjuodžiu šriftu (jis sujungs jūsų mygtuką), tada yra „Apsaugotas raktas“, nelieskite jo.

    Svetainės adresas: http://yoursite.com/ (adresas, prie kurio prisijungiate atvirą API. Jei šią programą naudosite kitoje svetainėje arba vietiniame priegloboje, ji neveiks. Programa yra visiškai susieta su nurodytu svetainės adresu čia.)

    Papildomas pasvirasis brūkšnys adreso nustatymuose ir jūsų mygtukas neprisijungs teisėtai ir parodys klaidą „Atidaryti API saugos pažeidimą“.

    Tai viskas, išsaugokite pakeitimus, jums nereikia konfigūruoti likusių skirtukų.

    Mygtuko nustatymas ir įdėjimas

    Grįžtame į mygtuko kūrimo formą ir čia jūsų paraiška turėtų pasirodyti išskleidžiamojo sąrašo lauke „Svetainė / paraiška“, pasirinkite ją.

    Kitas elementas yra "Mygtukų parinktys" - pasirinkite, kuris iš jų labiausiai tinka dizainui, apačioje yra aiškus mygtuko pavyzdys. Įjungta Šis momentas Yra 4 mygtukų tipai:

    • Mygtukas su teksto skaitikliu
    • Mini skaitiklio mygtukas
    • Miniatiūrinis mygtukas
    • Miniatiūrinis mygtukas, skaitiklis viršuje

    Pasirinktas mygtuko tipas, dabar elementas "Mygtuko pavadinimas", kol kas yra 2 variantai (pasirinkite bet kurį jums patinkantį):

    • man patinka
    • Tai įdomu

    Na, galiausiai ateiname į lauką „Įterpti kodą“. Kai pirmajame laukelyje pasirenkate savo programą, jos ID automatiškai įterpiamas į kodą. Šį kodą savo svetainėje reikia įterpti dviejose vietose, kūrėjai specialiai tai pakomentavo, bet aš taip pat paaiškinsiu, kad būtų.

    Pirma kodo dalis:

    VK.init((apiId: JŪSŲ_PROGRAMOS_ID, tik valdikliai: tiesa));

    į žymos vidų reikia įterpti:

    Ir antra dalis:

    VK.Widgets.Like("vk_like", (tipas: "button"));

    turite jį įterpti toje svetainės vietoje, kur turėtų būti rodomas mygtukas.

    Neįklijuokite mano kodo, aš jį pateikiau kaip pavyzdį, juolab kad turiu neteisingus mygtukų nustatymus ir ID nenurodytas.

    Ir viskas, mygtukas paruoštas!

    Mygtukų apvyniojimas

    Kaip pastebėjote, mygtukas dedamas į div su ID "vk_like", kur nurodomas jo rodymo stilius. Ir tokiu stiliumi kūrėjai pristatė taisyklę:

    Aišku: abu;

    Kaip žinome, ši taisyklė atšaukia elemento srautą iš dešiniojo ir kairiojo krašto, t. y., jei norite, kad jūsų mygtukas būtų vienoje linijoje su kitais socialiniai mygtukai. tinklų, apie tai net negalite pasvajoti, jis išdidžiai stovės nauja linija. Norėdami to išvengti ir vis tiek grąžinti mygtuką į eilutę, pakeiskite:

    Taigi atšaukiame elemento apvyniojimo atšaukimą (:-D), o „!svarbu“ padidina jūsų stiliaus prioritetą, t.y. jūsų taisyklė bus pagrindinė naršyklės akyse.

    Na, atrodo, kad pasakiau viską, ką norėjau)))) Tikiuosi, kad viską supratote ir sugebėjote įkišti mygtuką!

    Ir jei dar ilgai turite laiko įterpti mygtuką, nes dar neturite savo svetainės, galbūt Cheboksary svetainės kūrimas jums padės tai padaryti.

    Kaip prie savo tinklaraščio pridėti mygtuką Kontaktai "Patinka".

    Taigi, norėdami įdiegti šį mygtuką savo tinklaraštyje:

    sukurkite , tada eikite į , prijunkite naują svetainę ir pasirinkite norimą mygtuko parinktį:

    Šį kodą reikia įterpti į žymą (header.php faile):

    VK.init((apiId: #######, tik valdikliai: tiesa));

    Nepamirškite pakeisti ###### ženklų savo individualiais numeriais!

    Tačiau įklijuokite šį kodą toje vietoje, kur norite įdėti mygtuką:

    VK.Widgets.Like("vk_like", (tipas: "button"));

    Kaip matote, šį mygtuką įdėjau po kiekvieno tinklaraščio straipsnio (single.php failas).

    Kaip pridėti „Facebook“ patinka mygtuką

    Mes išsiaiškinome Vkontakte.ru valdiklį, dabar turime įdiegti „Facebook“ valdiklį.

    Einame į , matome šį langą:

    Patinka URL – palikite šį lauką tuščią

    Layout Style – counter style (pasirinkau standartinį).

    Width – mygtuko plotis. Pasirinkite jį pagal savo dizainą (aš pasirinkau 450 pikselių).

    Rodomas veiksmažodis – kuris žodis bus rodomas ant mygtuko: Patinka arba Rekomenduoti. Aš apsistojau prie pirmo varianto.

    Šriftas (šriftas) ir spalvų schema ( Spalvų schema) pasirinkite pagal savo skonį.

    Kai baigsite būtinus nustatymus, spustelėkite mygtuką Gauti kodą:

    Pasirodys toks langas:

    Mus domina kodas iš viršutinio iframe lauko. Nukopijuokite šį kodą į vietą, kurioje norite matyti mygtuką „Man patinka“.

    Dabar labai svarbus punktas! Jei turite tinklaraštį „WordPress“, tada po to

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

    reikia įterpti

    Mano kodas atrodo taip:

    Dalintis