Html-kode til gruppe sociale knapper. Knapper på sociale medier

Vær hilset! For nylig var jeg inde feedback spurgt, hvordan man laver de samme knapper sociale netværk, som er installeret på min hjemmeside. Og jeg besluttede at give svaret i artiklen ved at gennemgå 6 sociale myndigheder. knapper til webstedet.

Fordele og ulemper

Det skal dog bemærkes, at placeringen af knapper i nogle tilfælde kan have små ulemper. Lad os overveje, hvorfor det er nødvendigt at placere sociale netværksknapper på den oprettede blog, og overveje også de vigtigste positive og negative sider placering af sådanne ikoner.

Fejl

Sideindlæsningshastigheden kan være langsommere.

Med et højt specialiseret fokus på internetprojektet får du muligvis ikke den ønskede effekt.

Oversigt over sociale knaptjenester

Lad os se på de mest populære tjenester, der kan bruges til at tilføje sociale netværksknapper til dit websted.

Dette er fuldstændig gratis service, som fungerer som følger. Det genererer automatisk et særligt script, der giver besøgende til et internetprojekt mulighed for at sende links til sociale netværk. Tjenesten ligner knapper. Installationen er meget enkel og bekvem, og de anbragte knapper ser smukke ud på siden.

Tjenesten tilbyder mere end tre hundrede muligheder for forskellige knapper! Du kan meget nemt vælge dine yndlings.

Installationen foregår bogstaveligt talt med et enkelt klik. Der er konverteringsstatistikker.

Dette er sandsynligvis en af de mest interessante onlinetjenester, ved hjælp af hvilke det er muligt at generere en knap i henhold til flere parametre: størrelse og udseende. Derudover kan du vælge, hvordan panelet med knapper skal placeres (vandret eller lodret). Du kan også angive kodningen. Efter at have valgt alle nødvendige indstillinger, skal det genererede script downloades og placeres på dit internetprojekt på den ønskede placering. Mest lige efter artiklen.

Yandex tilbyder dig at vælge, hvilke sociale netværk der skal vises. Brugeren kan gøre dette ved blot at markere boksene ved siden af de knapper, der vil blive placeret på blokken. Du kan redigere deres udseende.

Dernæst vil systemet automatisk generere kilde, som du skal installere på din blog. De vigtigste fordele ved denne service inkluderer det faktum, at scriptet ikke placerer udgående links på den oprettede blog. Det er også muligt at forbinde Yandex.Metrica for at vedligeholde statistik.

Denne service tilbyder brugere at placere meget smukke og stilfulde sociale netværksknapper på deres hjemmeside. Formularen oprettet af tjenesten bruger css og javascript. Den genererede form passer perfekt ind i designet af ethvert internetprojekt. Ligesom knapper er lavet vha moderne teknologi jquery. Tilslutningen er meget enkel og vil ikke forårsage vanskeligheder, selv for begyndere. Indlæsningen er meget hurtig.

Dette er en nyttig og helt gratis onlinetjeneste, der tilbyder brugere at placere knapper på denne måde: i en række, arrangeret i form af en rullemenu, ikoner for alle tjenester i en række. Efter at have valgt visningsmuligheder, vil tjenesten automatisk generere en speciel javascript kode, som skal placeres på det krævede sted på stedet.

Derudover fortæller tjenesten dig, hvordan du tilføjer den oprettede kode til skabeloner.

Ved brug af af denne tjeneste, kan du meget hurtigt og nemt tilføje de nødvendige knapper til din hjemmeside eller blog. For at gøre dette behøver du kun at gøre tre enkle trin: vælg det sted, hvor den oprettede widget skal være placeret, vælg knappernes stil og få koden. Ved at placere sådanne knapper på den oprettede blog, vil besøgende være i stand til at tilføje interessante materialer til dine egne bogmærker og sociale netværk.

Så installation af sociale netværksknapper til et websted er meget simpelt og vil ikke forårsage nogen vanskeligheder, selv for nybegyndere internetbrugere. Hvis det ønskes, kan du installere enten knapper for alle tilgængelige netværk eller kun vælge nogle visse netværk. For at gøre dette skal du bruge officielle widgets eller tredjeparts onlinetjenester. De mest populære er knapperne installeret på personlige blogs eller på nyheds- eller underholdningsinternetprojekter. :)

P.S. Tak for din opmærksomhed. Hvilken service foretrækker du? Venter på dine kommentarer. :)

I På det sidste Det er blevet moderne at installere knapper på sociale medier på hjemmesider og blogs, og det er ikke overraskende. For det første giver knapperne dig mulighed for at øge "synes godt om" og "hjerter", hvilket har en positiv effekt på promoveringen af artikler på sociale netværk. For det andet er der visse typer knapper, der giver dig mulighed for at dele links til individuelle sider på webstedet på sociale netværk - dette tiltrækker yderligere besøgende fra Vkontakte, Facebook, Odnoklassniki, Twitter osv. For det tredje artikler, der modtog et stort antal af"synes godt om" og "hjerter" er højt betroet af webstedets læsere.

Derfor er det meget vigtigt at vide, hvordan man installerer sociale netværksknapper på et websted for at hjælpe webressourcen med at udvikle sig. De mest populære sociale netværk vil blive overvejet

I kontakt med
Facebook
Klassekammerater
Google "+1"
Twitter
Min verden

Her vil vi se på installation af standardknapper, der tilbydes af sociale netværk selv. I dette tilfælde skal hver knap installeres separat fra de andre, det tager lidt tid, men det ser også meget godt ud.

1.1. VKontakte 1.1.1 "Gem" knap

Knappen er ret fleksibel, inskriptionen på den kan ændres til hvad du vil (standarden er "gem").

Først skal du gå til siden med, hvor du vil modtage scriptkoden, som du skal installere på dit websted, for at knappen vises.

Her kan du vælge en af 5 stilarter: knap, knap uden tæller, link, link uden ikon, ikon.

"Tekst"-feltet giver dig mulighed for at ændre standardindskriften "gem" til din egen.

Som URL kan du vælge sidens adresse med knappen eller adressen på en anden side (efter eget valg). I det første tilfælde vil knappen dele et link til siden, hvor selve knappen er placeret. I det andet tilfælde vil knappen dele det link, du angiver, uanset hvor det er placeret.

Indlejringskoden består af to dele: den første skal være placeret hvor som helst mellem tags og, den anden - på det sted, hvor knappen skal vises. Læs om installation af en knap på et websted i afsnittet.

1.1.2 "Synes godt om"-knap

Den anden mulighed for knappen er "Synes godt om"-widgetten. Det bliver nemmere at installere det på siden, fordi... til sidst vil du kun modtage ét stykke kode, som skal placeres det rigtige sted på siden.

For at konfigurere knappen skal du gå til dette link. Her skal du også udfylde en række parametre.

Webstedsnavn – her er det bedre at angive det korte og rigtige navn på dit websted.

Hjemmesideadresse - indtast adressen hjemmeside dit websted.

Webstedets hoveddomæne - angiv webstedets hovedspejle (det kan findes som en parameter for "Host"-operatøren), hvis du finder det svært at gøre dette, så forlad den foreslåede VKONTAKTE.

Knap muligheder er forskellige stilarter knapper, påvirker de dets udseende.

Højden på knappen er de geometriske dimensioner af knappen "Synes godt om".

Knapnavn - der er to tilgængelige muligheder (jeg kan lide det, det er interessant).

Indsættelseskoden er den kode, der er nødvendig for at vise knappen til det sociale netværk VKontakte.

1.2 Facebook

Knappen på denne side er ved at blive konfigureret. Der kan opstå vanskeligheder, fordi... kommentarer til skemaet skrives i engelsk sprog, men nedenfor kan du læse Kort beskrivelse hvert felt.

URL to Like – URL på siden for knappen (hvis feltet ikke er udfyldt, tages adressen på den side, hvor knappen er placeret).

Send-knap – tilstedeværelsen af et flueben inkluderer ny mulighed– send et link til Facebook (vil blive vist ekstra knap- "send"). Når den er tændt, vil to knapper blive vist samtidigt.

Layoutstil – knappens stil påvirker dens udseende (knaptal betragtes som standard).

Bredde – knapbredde i pixels.

Vis ansigter – når det er aktiveret, vil avatarer af personer, der allerede har klikket på denne knap, blive vist.

Skrifttype – knapskrifttype.

Farveskema – baggrund af rummet ved siden af knappen (hvid og sort).

Verbum at vise – knapnavn (som det, jeg anbefaler det).

Hent kode – en knap, der genererer scriptkoden.

1.3 Odnoklassniki og min verden

Disse sociale netværk har vundet stor popularitet i Russisksproget internet, et stort antal mennesker bor der, så du bør ikke forsømme at installere knappen "Klasse" fra Odnoklassniki-tjenesten og knappen "Synes godt om" fra My World-webstedet.

For at konfigurere knapperne skal du gå til . Du kan tilføje knapper individuelt, tilpasse hver enkelt forskelligt, eller du kan redigere begge knapper på samme tid.

Højdestørrelse – geometrisk størrelse på knapperne.

Udseende – udseendet af knaprammen.

– valg af knapper (som, klasse)

Tæller – tænd og sluk for knaptrykstælleren (til højre, øverst – tællerens placering).

Tekst på knapper – vælg et af tre navne, der er tilgængelige for knapper.

Integrer kode – scriptkode, der skal installeres på webstedet.

1.4 Google "+ 1"

Et nyt socialt netværk, der på kort tid fik kæmpe publikum. Det er svært at forestille sig et websted uden "+1"-knappen, fordi... det giver dig ikke kun mulighed for at tilføje links til et socialt netværk og øge antallet af "pluser", men det kan også påvirke webstedets resultater i TOP søgemaskine Google.

Alle detaljer om dette samt installation og konfiguration af knappen er placeret.

1.5 Twitter

Mest populære service korte beskeder kan ikke ignoreres. Installer en knap til dette sociale netværk og se, hvor hurtigt folk deler links til dit websted på Twitter. Du kan tilpasse knappen her.

Først skal du vælge den ønskede knap(vi er interesseret i den første mulighed - knappen "send link").

Herefter kommer der en formular på siden med flere felter, der skal udfyldes.

Send link – vælg den side, hvor knappen er placeret, eller en hvilken som helst anden.

Tekst – vælg den tekst, der skal vises ved siden af knappen (IKKE PÅ KNAPPEN SELV).

Vis tæller – aktiver eller deaktiver optælling af antallet af knaptryk.

Brug - at vælge en metode til at tilføje en linkmeddelelse til Twitter (påvirker ikke noget).

Tag – vælg et tag, der vil blive offentliggjort på Twitter (påvirker ikke noget).

Stor knap - zoom geometrisk størrelse knapper.

Nægt at tilpasse Twitter - afvis Twitter-stile (det er bedre at lade feltet være umarkeret).

Sprog – vælg sproget for knappen.

Til højre vil der blive genereret en kode, som skal tilføjes til siden.

1.6 Ya.ru

For at gøre dette skal du udfylde flere felter, der dannes påkrævet kode manuskript.

Størrelse – lille eller stor størrelse knapper.

Stil – vælg mellem en knap eller et ikon.

Tællertilstedeværelse – aktiver eller deaktiver knaptryktælleren.

Knapudseende er et eksempel på, hvordan knappen kommer til at se ud.

Titel – vælg en titel til siden (brugerdefineret eller titlen på den aktuelle side).

Embed kode – den nødvendige kode, der tilføjes til webstedet.

2. Færdiglavede knapper for websted

Men hvis du ikke vil tilføje koden for hver knap til dit websted, så kan du bruge standardscripts, der straks danner en gruppe sociale netværksknapper. I dette tilfælde skal du blot tilføje en kode af et sådant script til dit websted, og du vil straks have knapper til de mest populære sociale netværk installeret.

For at konfigurere blokeringen og vælge de ønskede sociale netværk, følg dette link. Skærmbilledet nedenfor viser, at du kan vælge knapperne til de ønskede sociale netværk blandt dem, der tilbydes, og også lidt redigere udseendet af blokken.

Sæt af tjenester – valg af sociale netværksknapper til webstedet (dem med et flueben vil blive vist på webstedet).

Koden er det nødvendige script, der skal tilføjes til webstedet.

2.2 PLUSO knapper

For nylig har designeren af sociale netværksknapper - PLUSO - vundet stor popularitet. Du kan gå til webstedet ved at bruge dette link.

Konstruktøren er ret fleksibel, har mange indstillinger, så du kan oprette sociale netværksknapper, der passer perfekt ind i webstedets design.

Først skal du vælge stilen på knapper og tællere fra flere tilbudte (vandret, lodret, farvet, farveløs osv.).

Du skal derefter konfigurere en række indstillinger ved at vælge

blok placering (lodret, vandret);
knapfarve (lys, mørk);
blokstørrelse (stor, lille);
tæller (tilstedeværelse eller fravær);
baggrund (farveløs eller farvet);

Koden vil blive genereret i henhold til de parametre du har angivet, hvorefter den skal indsættes på siden.

S hare42

En anden tjeneste, der giver dig mulighed for at designe knapper til dit websted, er Share42.com/ru.

Denne generator giver dig mulighed for at tilpasse størrelsen på knapper, bestemme de ønskede sociale netværk fra kæmpe antal tilgængelige, samt redigere udseendet af ikonerne.

Vælg størrelsen på knapperne og de ønskede sociale netværk, og fortsæt derefter med at konfigurere yderligere muligheder.

Type panel med ikoner - viser en blok af knapper (den "lodrette flydende" mulighed er meget interessant).

Begræns det synlige antal ikoner – vælg antallet af viste knapper (andre vil være skjult bag linket).

Webstedskodning – vælg kodningen for dit websted.

Tilføj et ikon til Share42.com-webstedet - måske skulle du fjerne markeringen fra det.

Vis tællere – aktiver knapkliktæller (kun når jQuery kører).

Installation af dette script ret kompliceret, men det er beskrevet trin for trin på selve Share42 hjemmesiden.

3. Sådan installeres knapper på webstedet

Hvis koden, der skal placeres på webstedet, består af to dele (som det er tilfældet med VKontakte-knappen), installeres hver del separat. Hvis koden ikke er opdelt i to dele, så dette trin du kan springe det over.

Den første del af koden skal tilføjes mellem og tags. For at gøre dette, gå til WordPress admin panel og gå til skabeloneditoren.

I skabeloneditoren skal du finde filen "Header" (header.php), hvis der ikke er nogen, så - "Hovedskabelon" (index.php). Nu skal du finde eller tagget. Hvis i angivne filer der er ingen sådanne tags (alle emner er forskellige, det kan godt være tilfældet), så skal du åbne alle filer til redigering og lede efter tagget i hver af dem. For at søge kan du bruge tastaturgenvejen "Ctrl+F".

Når du finder nødvendige tags, kan du placere den første del af koden umiddelbart før det afsluttende tag for ikke ved et uheld at røre ved koderne for andre scripts.

Den anden del af koden er placeret, hvor du ønsker at se de sociale mediers knapper, der er valgt til webstedet. Hvis koden kun består af en del, er det nok kun at udføre denne operation.

Oftest tilføjes knapper før artiklen eller til sidst. Nemmere er selvfølgelig den anden mulighed. Vi vil overveje det.

Du skal finde det sted, hvor artiklen slutter (hovedtekstdelen af siden). For at gøre dette skal du redigere filen "Single entry" (single.php).

Nu skal du finde den operatør, der er ansvarlig for at vise artiklens hovedindhold. I mit tilfælde er dette "the_content", umiddelbart efter det er knapkoden placeret.

På samme måde kan du placere koden i begyndelsen af artiklen, du skal blot finde et sted mellem titlen og artiklens tekst.

Hej venner! Dagens artikel vil være meget omfangsrig, men samtidig ekstremt nyttig. Hvorfor besluttede jeg at skrive denne artikel? Faktum er, at jeg konstant bliver spurgt, hvordan man får flere fans på dette eller det sociale netværk? Hvorfor følger folk ikke min Facebook-side? Hvorfor følger ingen virksomheden på Twitter?

Næsten alle virksomheder har i dag en hjemmeside og endda en blog. Har du en hjemmeside? Det håber jeg! Hvis ikke endnu, så skal du tænke over det hurtigst muligt! Nå, det er klart med bloggere og freelance-professionelle (konsulenter og freelancere), de har helt sikkert deres egen adresse på internettet - en hjemmeside. Venner, problemet er, at få websteder virkelig er optimeret til sociale netværk. De kan producere en masse meget nyttige og interessant indhold, men ingen ser eller hører dem. SMO (social media optimization) - har du hørt dette udtryk? Så ingen er engageret i netop denne CMO (optimering af en hjemmeside til sociale netværk). Men forgæves! Eksisterer stor mængde metoder, som eksperter kender til, for at skabe, som de siger, trafik på en hjemmeside. Simple manipulationer + tilstedeværelsen af ideer og kreativitet kan i væsentlig grad hjælpe din virksomhed med at fremme. Jeg garanterer dig dette!

Så nedenfor vil jeg fortælle dig, hvordan du installerer officielle sociale knapper og widgets på din hjemmeside. Disse vil kun være officielle knapper og widgets - ingen tjenester eller plugins!

Sociale netværk har prøvet meget hårdt og skabt et stort antal forskellige knapper og widgets. Ingen har endda hørt om mange, selvom de findes i fri adgang for alle. Her vil vi kun overveje de mest nødvendige og effektive af dem, hvilket vil hjælpe dig med at øge din fanskare, og også gøre distributionen af dine artikler og andet indhold enkel og nem for besøgende til din ressource.

Ønsker du at installere de samme knapper som på min hjemmeside, så er der skrevet flere detaljer om dette.

Vælg social netværk, hvis knapper du vil installere:

Slags sociale knapper

Inden vi kommer ind på knapinstallationsvejledningen, vil jeg henlede din opmærksomhed på, at der er forskellige typer knapper:

Facebook, ligesom andre sociale netværk. netværk eksisterer stort valg sociale knapper og widgets. Hver af dem har sin egen funktion og formål. I dette afsnit vil vi kun overveje de mest brugte og nødvendige af dem. Du kan se og teste resten på udviklernes hjemmeside på Facebook.

Bemærk: Lad os blive enige med det samme. I beskrivelsen af hvert afsnit vil jeg give et link til webstedet for udviklerne af det pågældende sociale netværk. netværk. På sådanne sider kan du finde links til alle eksisterende knapper og widgets. Åbn derfor straks udviklersiden ind separat fane og læs videre denne artikel.

Udviklerwebsted på Facebook: https://developers.facebook.com/docs/plugins

"Synes godt om" knap

Hvordan installeres?

Installation af "Synes godt om"-knappen er meget enkel! Du skal gå til udviklernes hjemmeside på Facebook (som vi aftalte, er linket i begyndelsen af dette afsnit). Før du begynder at oprette nye knapper og widgets, skal du oprette en ny applikation i Apps-menuen. Dette skal gøres, for uden dette vil Facebook ikke tillade dig at oprette knapper!

Hvis du har problemer med at oprette en applikation eller generere scripts, så lad mig det vide i kommentarerne, og jeg vil gøre det endnu bedre detaljerede instruktioner til installation af knapper.

Så for at installere knappen "Synes godt om" skal du på udviklersiden i venstre kolonne klikke på "Synes godt om-knappen (netværk)". Nu skal du vælge mellem de muligheder, som Facebook tilbyder for at få præcis den widget, du ønsker.

1) Url til at synes godt om - indtast linket til den side, publikation, landingsside, som du opretter en "Synes godt om"-knap for. Dette kan være enhver form for indhold, selv et billede eller en video. Det vigtigste er, at du giver et link, som brugerne vil dele.

2) Bredde - Hvis du har begrænset plads til knappen, så kan du angive bredden på widgetten i pixels. Selve knapperne er små, men vælger du standardknapper fylder teksten ret meget. Jeg vil tale om dette i næste afsnit.

3) Layout - Widget type. Facebook tilbyder 4 muligheder at vælge imellem: standard (som på billedet), med en stor tæller, med en lille tæller og kun knapper. Det hele afhænger af din smag, webstedets stil, den tilgængelige plads til knapper og også ønsket om at vise tællere (dvs. hvor mange mennesker der klikkede på knappen).

4) Handlingstype - handlingstype, dvs. hvilken type knap du vil indstille: "Synes godt om" eller "Anbefal". Jeg skrev detaljeret om forskellene mellem disse knapper - og widgets på Facebook generelt - i min.

5) Vis venners ansigter - hvis du vil have knapperne til at vise en besøgende på dit websted avatarer af hans venner, der allerede har klikket på knappen "Synes godt om", så marker dette felt. Hvis ingen af dine venner kunne lide siden, artiklen osv., så vil Facebook ikke vise billedet, men vil i teksten invitere brugeren til at være den første til at like det. Hvis pladsen tillader det, anbefaler jeg at slå denne mulighed til, da vennernes ansigter har en positiv effekt på læserens opfattelse af indholdet, øger hans tillid og ofte presser ham til at klikke på knappen, i det mindste af solidaritet.

Når du har udfyldt alle felterne, skal du klikke på knappen Hent kode for at generere den kode, som du vil installere på siden. Den første del af scriptet installeres i sidetagget, og den anden del indsættes der, hvor du vil installere knappen.

Siden skulle åbne på russisk, men hvis den af en eller anden mærkelig grund er på engelsk, så kan du ændre sproget helt øverst på siden.

Hvordan installeres?

Tweet knap

En anden velkendt Twitter-knap er "Tweet"-knappen, som giver brugerne mulighed for at dele dit indhold med Twitter-følgere.

Hvordan installeres?

Alle Twitter-knapper er installeret på udviklersiden nævnt ovenfor. Processen for alle knapper er næsten identisk - vælg den rigtige type knapper, udfyld parametrene og kopier koden, som vi derefter indsætter på siden.

Hashtag-knap

Dette er en meget interessant knap, som jeg er sikker på, at næsten ingen kender til. Jeg har personligt aldrig set nogen bruge det på RuNet. Det er dog meget godt til at løse visse problemer. For eksempel kan en sådan knap bruges til at promovere alle begivenheder, webinarer, diskussioner på Twitter under et bestemt tag, marketingkampagner, konkurrencer. Uanset hvad! Der er stor plads for kreativitet!

Det er logisk, hvis "hashtag"-knappen er installeret på sider relateret til dette hashtag. For eksempel skrev du en artikel om en ny begivenhed, du er vært for fans på Twitter. For at deltage i konkurrencen skal du bruge et bestemt hashtag. Ved at bruge en knap som denne vil du gøre en persons liv lettere, da han ved at klikke på den åbner et tweet med med det ønskede hashtag. Han kan blot tilføje noget tekst og sende tweetet frit svævende. Og han har det godt, og du får et nyt medlem. Er det ikke fantastisk? Kort sagt, du skal slå på jernet uden at forlade kasseapparatet, det vil sige, mens læseren er under følelsen af det, han læser. To minutter senere vil han blive distraheret og kan helt glemme, hvad han lige har læst.

Mens min fantasi løber løbsk, vil jeg dele endnu en idé med dig. Lad os bare sige, at du er vært for en begivenhed (online eller offline). For at promovere det, opretter du en separat artikel eller side dedikeret til dette emne. Lige der i teksten indsætter du knappen "Hashtag" og ved siden af den indsætter en separat widget, der i realtid vil vise alle tweets, der bruger dette hashtag. Ved at se diskussionen fra andre brugere, vil din ikke særlig aktive læser måske være klar til at tage del i den. Målet her er at tiltrække læserens opmærksomhed på, hvad der sker, involvere ham i diskussionen og selvfølgelig holde ham på siden.

Hvordan installeres?

"Hashtag"-knappen er installeret fra samme side, som jeg skrev om ovenfor.

Omtale knap

Til sidst vil jeg fortælle dig om endnu en god knap, som desværre ingen bruger. Men forgæves! Dette er, kan man sige, et almindeligt tweet sendt på forhånd angivet profil. Jeg tror, at knappen er lidt brugt, fordi mange mennesker ikke ved, hvordan og hvor den skal installeres. Lad mig give dig et par eksempler, der kommer til at tænke på. Hvis du ved, at din målgruppen er på Twitter og bruger aktivt dette sociale netværk. netværk, hvorfor opfordrer du ikke folk til at tweete dig direkte fra siden? Dette kan være et tweet til forfatteren af artiklen, et tweet fra siden "Om os" eller "Kontaktpersoner", et tweet direkte til Twitter-support osv. Er du klar over, hvor mange muligheder du går glip af for at krydre din Twitter-konto?

Hvis en person er kommet til dit websted, så har han allerede en vis interesse i dig, så du skal skubbe ham til handling lige nu. Om et minut kan det være for sent! Desværre er der kommet tider, hvor vi glemmer at gøre noget meget hurtigt, da vi skifter opmærksomhed fra den ene ting til den anden hvert minut. Og jo yngre dit publikum er, jo mere udtalt er dette fænomen, så glem ikke eksistensen af denne knap og prøv at bruge den, hvor det er relevant.

Hvordan installeres?

Vi installerer knappen alt sammen fra samme side. Hvis du har læst instruktionerne til de foregående knapper, skal alle parametrene for knappen "Nævn" på Twitter være klare for dig.

Se nedenfor, hvordan denne knap fungerer. Glem ikke at tweete mig, hvad du synes om denne artikel :) Jeg vil gerne vide, hvad mine læsere synes, så jeg vil meget gerne høre fra dig.

Eksempel på en "Nævn"-knap

Twitter-widgets

Vi har fundet ud af Twitter-knapperne. Nu vil jeg gerne kort fortælle dig om de officielle widgets, som Twitter har. Scripts til alle widgets, du kan få fra dette link.

Widgets er af følgende typer:

En almindelig widget med de seneste tweets;
Søgewidget, der viser søgeresultater efter givet nøgle i realtid. Denne type widget er meget praktisk til at søge efter for eksempel dit brand hashtag. Se et eksempel på dets brug i afsnittet "Hashtag"-knappen for Twitter;
Foretrukne widget - Viser tweets, du har angivet som favorit. Denne type widget kan f.eks. bruges til at vise positive anmeldelser om en virksomhed. Hvorfor ikke?
Samlingswidget - Samlinger er et sted mellem favoritter og lister. Du kan manuelt vælge, hvilke tweets der ender i samlingen. Bemærk, at hver samling har sit eget link og beskrivelse. Denne funktion er meget lidt brugt på Twitter, selvom den er meget interessant.
Lister-widgetten viser de profillister, du har oprettet. Også her kan du være kreativ og gøre noget interessant og nyttigt for læseren, som på samme tid vil gavne dig. Hvad med en liste over partnere, dine virksomhedskonti (hvis der er mange af dem), en portefølje af Twitter-konti, du administrerer (for bureauer og freelancere), eller for eksempel en liste over medlemmer, der er i din klub? Igen er mulighederne for kreativitet ikke begrænset her.

Eksempel på en almindelig Twitter-widget

I kontakt med

Det sociale netværk VKontakte har ligesom andre en hel masse forskellige knapper og widgets. En komplet liste over dem kan ses på udviklernes hjemmeside: https://vk.com/dev/sites

Igen vil jeg kun gennemgå de vigtigste, ellers bliver denne artikel ikke en artikel, men hele bogen... Jeg tror, at VK-widgets vil være meget lettere at forstå, da hjemmesiden og al den nødvendige dokumentation er tilgængelig på russisk.

Synes godt om knap

Hvordan installeres?

Først skal du gå til widget-siden. Jeg gav et link til listen over widgets helt i begyndelsen af VKontakte-sektionen.

Hvordan installeres?

For at indsætte "Community"-widgetten på webstedet skal du først indtaste et link til din side eller gruppe på VKontakte. Dernæst vælger du, om du vil have widgetten til at vise bandmedlemmernes eller sidefans' ansigter, og sidste nyhed fra siden, eller du vil have et simpelt plugin med en "Synes godt om"-knap. Da VK-widgetten minder meget om Facebook, forbliver anbefalingerne med hensyn til typen af plugin de samme. Jeg vil ikke gentage mig selv, så hvis du er interesseret, så tjek Facebook-plugins-sektionen.

Dernæst er parametrene relateret til størrelsen af plugin og dets udseende. Det hele afhænger af farvepaletten på dit websted og den tilgængelige plads til plugin'et. I princippet kan du vælge enhver farve, men det anbefales stadig at beholde originalen farvepalet, da sådanne farver er mere velkendte for brugerne og ikke skræmmer dem. Nå, endelig kom vi til det sidste punkt - vi indsætter koden på webstedet. Som du allerede husker, går den første del af koden til sidetagget, og den anden del til det sted, hvor plugin'et vil blive placeret.

Senest oprettede jeg en blogside "Om SMM" på Vkontakte. Derfor, hvis du ønsker at modtage Seneste opdateringer i dette sociale netværk, så slutt dig til os!

Eksempel på "Community" plugin på VKontakte

"Abonner på forfatter"-widget

Ligesom Facebook-pluginet med et lignende navn anbefales denne widget til alle, der ønsker at udvikle deres personligt brand. Hvis du for eksempel er forfatter til bøger eller en blog, journalist, advokat, ejendomsmægler osv., hvorfor installerer du så ikke sådan en knap på din hjemmeside? Potentielle købere nemmere at etablere kontakt med rigtig person end fx med en side eller gruppe, bag hvilken det ikke er tydeligt, hvem der står. Sådan er vi skabt, mennesket er et socialt væsen, og vi elsker personlig kontakt, derfor vil en sådan widget være praktisk for enhver professionel, uanset hvilket felt du arbejder inden for.

Hvordan installeres?

Det kunne ikke være nemmere at installere det! Gå til widgetsiden på VK og indtast din profiladresse. Vælg derefter hvilken knap du vil installere. Jeg gentager endnu en gang, at det er tilrådeligt kun at installere knapper gennem et script (for eksempel en knap eller nem knap). Hvis du bare har brug for et link, så er det bedre at gøre det gennem HTML-kode, for ikke at overbelaste webstedet med scripts, som du meget nemt kan undvære. Effekten vil være den samme, og siden indlæses hurtigere.

Andre VKontakte-widgets

Gutter, ovenfor listede jeg de mest almindelige og effektive VK-widgets, men listen er ikke begrænset til dette. VKontakte har også en hel masse forskellige widgets, der kan være nyttige i en eller anden situation. For eksempel Poll-widgetten, som næsten ingen bruger. Hvis du har oprettet en undersøgelse på din VK-side, hvorfor så ikke indsætte den i en artikel om emnet? Læsere af dit websted vil kunne stemme for deres mulighed direkte på dit websted, og information om dette vil også gå til VK. Ikke dårligt, vel?

Der er også en interessant anbefalinger-widget, der viser de mest interessante artikler på din blog eller dit websted. Graden af interesse for et bestemt indhold bestemmes af antallet af klik på knappen "Synes godt om". Kort sagt, VKontakte tæller automatisk, hvor mange brugere der har klikket på "Synes godt om"-knapperne og samler alle de mest interessante artikler i denne blok. Hvis din målgruppe er bredt repræsenteret på sociale medier. VKontakte-netværk, så er det værd at prøve og installere disse to widgets: "Jeg kan lide" og "Anbefalinger". Jeg er sikker på, at resultaterne ikke vil lade dig vente!

Lad os nu tale om LinkedIn. Dette netværk vokser kun i popularitet her, så der er ikke mange, der stadig forstår, hvordan det kan bruges til at opnå positive resultater. I Amerika, hvor dette netværk kommer fra, er der få fagfolk eller virksomheder, der ikke har deres egen profil på LinkedIn. Der vil de kigge skævt på dig, hvis du ikke i det mindste er registreret på sociale medier. netværk. I Europa er brugen af sociale netværk varierer meget afhængigt af landet. For eksempel er Storbritannien og Sverige førende med hensyn til at inkorporere LinkedIn i markedsstrategi virksomheder. Ikke alene opfordrer de medarbejdere til at have onlineprofiler, men de ansætter også folk gennem LinkedIn, annoncerer for virksomheder og produkter og leder efter... potentielle kunder og samarbejdspartnere mv.

Men det er ikke det, vi taler om i dag. Vi vil tale om sociale plugins, som LinkedIn har udviklet til os, og hvor og hvordan man bruger dem. Skynd dig ikke at sige, at dette netværk ikke er interessant for dig! Og hvis du arbejder inden for rådgivning, b2b, så skal du simpelthen læse dette afsnit.

Så LinkedIn, ligesom alle sociale netværk. netværk, der er separat side, hvor du kan se alle eksisterende knapper og plugins: https://developer.linkedin.com/plugins

Udviklernes hjemmeside findes desværre kun på engelsk, så jeg vil forsøge at forklare så detaljeret som muligt installationen af hvert plugin og knap.

Hvordan installeres?

Knappen "Abonner" er installeret fra den samme udviklerside, det link, som jeg gav i begyndelsen af afsnittet. I venstre kolonne skal du klikke på "Følg virksomhed", og LinkedIn vil vise dig påkrævet afsnit. Vælg først hvilken type knap du vil installere: med en lodret eller vandret tæller, eller måske den mest almindelige, og klik på Hent den. Dernæst skal du indtaste navnet på det firma, som du installerer knappen for. I den relevante kolonne skal du begynde at skrive navnet bogstav for bogstav, og det skal vises på listen. Nogle gange tager listen lang tid at indlæse, så tag dig god tid. Navnet skal skrives præcis, som det står på virksomhedssiden. Vælg derefter knappens sprog - russisk, knappens type og klik på knappen "Hent kode". Indsæt nu bare koden Rigtigt sted på hjemmesiden og alt er klar! På russisk vil knappen i øvrigt hedde "Spor", hvilket jeg ikke rigtig kan lide. Jeg ville personligt forlade den engelske version. Heldigvis ved alle allerede, hvad ordet "følg" betyder :)

Jeg har ikke oprettet en virksomhedsside på LinkedIn endnu, så rigtigt eksempel Ikke endnu. Hvis jeg laver en side i fremtiden, vil jeg helt sikkert indsætte den i artiklen som eksempel.

Knappen "Personlig profil".

Dette er endnu et godt, men igen lidt brugt plugin. Denne knap viser et foto personlige profil, post og viser vennerne til den bruger, der ser dette plugin. Selvfølgelig, så LinkedIn kan vise professionelle forbindelser læser af dit websted, skal han - læseren - være logget ind (så at sige) på LinkedIn. Kort sagt skal brugeren være logget på LinkedIn for at plugin'et fungerer fuldt ud.

Hvem kan dette plugin være nyttigt for? Jeg tror, at det vil være mest nyttigt for folk, der arbejder i b2b-sektoren. Selvom du kan bruge det overalt: på en side om webstedets forfattere, på en side om virksomhedens ansatte, på sider om dine kunder og partnere (selvfølgelig med deres tilladelse) - er der mange muligheder. Det vigtigste er, at sådanne profilknapper passer organisk ind i din hjemmeside og virksomhedsstrategi. Hvis dine medarbejdere har halvfærdige profiler, logger på LinkedIn én gang om året og har 10 forbindelser, så nytter det ikke noget at vise sådanne profiler. Hvis din virksomhed tværtimod aktivt promoverer på sociale medier. netværk, så kan sådan et plugin give dig en masse fordele.

+1 knap

Hvordan installeres?

Alle Pinterest-knapper og widgets installeres ved hjælp af linket ovenfor. For at installere knappen "Pin it" skal du vælge den tilsvarende knap i venstre kolonne.

Pinterest-knapper er lidt mere komplicerede at sætte op, da de har mange forskellige muligheder, men det er stadig meget muligt at sætte dem op selv.

1) I den allerførste linje "Knaptype" kan du vælge den type knap, du vil installere på webstedet: et givet billede, et hvilket som helst billede fra siden eller en Pin it-knap, der vises på siden/artikelbillederne .

2) Den anden linje er "Udseende", dvs. knappens type. Her tilbyder Pinterest mange muligheder at vælge imellem: stor eller lille; rektangulær eller rund; rød, grå eller hvid; tekst på engelsk eller japansk.

3) Den tredje linje er en tæller. Her kan du vælge at have disken ovenpå, på siden eller fjerne den helt.

Afhængigt af den knaptype, du vælger, ændres dens muligheder.

Knappen "Et billede" betyder, at du vil indstille et specifikt billede, som webstedslæseren kan fastgøre til et specifikt link. Det vil sige, at læseren ikke har et valg, selvom der er andre billeder på din side. Hvis du beslutter dig for at indstille et billede til en knap, så skal en sådan knap installeres separat på hver side, da det kræver at du indtaster et link til siden/artiklen. I den første kolonne skal du indsætte et link til den side, som brugerne vil dele, dvs. det link, som de vil fastgøre. Angiv derefter et link til billedet. Forresten kan dette være enhver kilde, også uden for dit websted. I den sidste kolonne kan du angive teksten til billedet, som brugeren vil dele. Dette kan for eksempel være titlen på en side eller titlen på en artikel. Før du sender pinkoden, kan brugeren eventuelt erstatte din tekst med deres egen.
Knap "Ethvert billede" Eller et hvilket som helst billede. Denne knap er meget enkel og kræver ingen yderligere parametre. Du skal blot vælge størrelse og type af knap, og også beslutte, om du skal bruge en tæller eller ej.
Knap "Image hover", altså en knap, der vises på selve billedet, når du holder musemarkøren over det. Du kan prøve, hvordan dette virker i Pinterest-eksempelbilledet.

Nu et par ord om koden, som du skal installere på siden. Pinterest, ligesom andre sociale netværk. netværk, har to koder: den første del er indsat i tagget, og den anden del på det sted, hvor selve knappen er installeret. Hvis du har flere Pinterest-knapper på samme side, skal du kun indstille den første kode én gang.

Et eksempel på et stykke kode, der kun installeres én gang i et sidetag: .

Abonner knap

Pinterest, ligesom Google+, skelner ikke mellem personlige konti og virksomhedskonti, så "Tilmeld"-knappen for begge oprettes ét sted. Det er lige så nemt at installere denne knap som at beskyde pærer. Alt du skal gøre er at indtaste dit profillink og navngive knappen.

Som jeg skrev ovenfor, kan jeg ikke indsætte Pinterest-knapper på grund af en script-konflikt, så hvis du vil blive venner med mig på Pinterest, skal du bare følge dette link.

Bonus: hyperlinks

Nedenfor vil jeg give eksempler på, hvordan sådanne links oprettes manuelt. Du kan også prøve en speciel linkgenerator - Share Link Generator. På denne side kan du oprette links til Facebook, Twitter, Google+, Pinterest og LinkedIn. Det vil være let at forstå siden, så jeg vil ikke forklare hvad og hvordan. Se dog mine tips, da linkgeneratoren ikke giver fulde link Til HTML-format+ kode til hvordan man får linket til at åbne i et nyt vindue. Alt dette plus eksempler på links til sociale medier. Vkontakte netværk, du finder i dette afsnit.

hyperlink tekst

Her er sætningen "Hvem vil købe software med 8% rabat på kampagnen?" skrevet af brugeren selv, og nedenfor er hvordan linket til siden ser ud på det sociale netværk. Ikke særlig smuk, vel?

så vil linket på det sociale netværk se sådan ud:

Her "I dag er fødselsdagen for allsoft.ru - 8 år :)" er teksten skrevet af brugeren, resten er information fra metatags. Du kan læse mere om disse metatags på Facebook side developers.facebook.com/docs/share, andre sociale netværk forstår dem også ret godt.

Hvordan fungerer denne mekanisme generelt:
1. Når brugeren klikker på knappen, sender widgetten et link til siden til den sociale netværksserver.
2. Social server Netværket selv tilgår dette link og læser information om siden - titel, beskrivelse, billede.
3. Social server netværk cacher sideoplysninger på sin side og viser dem på sociale netværkssider

Sådan sender du forskellige beskrivelser til en side.
For eksempel, når du oprettede en salgsfremmende side på allsoft.ru med en tegneserietest, var det nødvendigt at sende forskellige beskrivelser til sociale netværk for det forskellige antal point, som brugeren scorede i testen. Da beskrivelsen af siden modtages af det sociale netværk ved at klikke på linket, så for forskellige beskrivelser Brug for forskellige links. Derudover tillader Twitter kun 140 tegn, så det har brug for en separat, kortere beskrivelse.

Ny Ya.share(( element: "ya_share_normal", elementStyle: ( "type": "ingen", "quickServices": ["facebook","twitter","odnoklassniki","vkontakte","moimir"] ), link: "http://allsoft.ru/promo/allsoft8let/?share=normal", serviceSpecific: ( twitter: ( titel: "Testresultat: Dragen er næsten din stærke side! Du kan ikke undervise i Dragonology endnu, men på den rigtige vej!" ) ) ));
1. Her er ya_share_normal id'et for elementet på siden (), hvor blokken med sociale knapper vises, linket er linket, plus i serviceSpecific for Twitter angiver vi titlen, som adskiller sig fra hvad der er i og: titel meta tag.

Til opgaven "3 forskellige testresultater plus et fælles link til en side uden for testen" vil vi således have 4 tags:

og 4 blokke JavaScript-kode som ovenfor.

Sådan ændres titlen og beskrivelsen, der er cachelagret af det sociale netværk.
1. Til Facebook er der mest Den bedste måde: gå til deres debugger

Hvis du er bange for, at du bliver overvåget på internettet, skal du slukke din computer.

Enhver webmaster, før eller siden, overvejer at installere sociale knapper på sin hjemmeside. Når alt kommer til alt, nu kan nogle mennesker ikke forestille sig deres liv uden sociale netværk, hvorfor fratage dem deres evne til at dele dine artikler? Men med tiden mister mange sociale knaptjenester forstanden og gør, hvad de vil med deres koder, og propper alt, hvad der ikke er nødvendigt. Det er for denne paranoide idé, at du i denne artikel finder koderne for de fleste rene knapper deling af sociale netværk til din hjemmeside.

Det er ingen hemmelighed, at næsten alle sociale knaptjenester lækker information om dine brugere, hvor det er nødvendigt. Åh gud! Kan ikke være! Jeg har lige fundet ud af det her! - Tillykke! De skal bruge dig på en eller anden måde til deres arbejde og indsats. De gjorde gode tjenester, med stor funktionalitet, bekvemmelighed og "kvalitet". Alt du skal gøre er at vælge, hvad du har brug for, og placere koden, hvor du har brug for den. Det er alt. Og hvad er fordelen for dem ved at udføre sådanne manøvrer gratis på internettet? Højre. Ingen. Så fra tid til anden bliver ethvert sådant kontor fanget i at dumpe data ind i en eller anden DMP.

Jeg vil ikke beskrive hver af disse tjenester; det har de alle god funktionalitet, nogle unikke chips, men jeg har ikke noget ønske om at præsentere dem separat. Jeg har samlet en kort liste nedenfor.

Liste over de fleste populære tjenester sociale knapper til webstedet

share.pluso.ru
uptolike.ru
tech.yandex.ru/share
share42.com
sharethis.com
pip.qip.ru
www.addtoany.com
www.po.st
www.addthis.com
sharebuttons.com

Hvis du ikke har tid nok, eller du er for doven til at gøre mere end et par bevægelser af hænder og phalanges af fingrene, så kan du trygt bruge disse tjenester. De er gode til websteder såvel som besøgende. Men ingen garanterer 100% sikkerhed af brugerdata, 100% drift af deres DNS og indlæsning af dine websteder. De der. Hvis der er en fejl på de sociale knappers servere, indlæses dine websteder langsommere end normalt. Ja, det sker sjældent, men det sker. Selvfølgelig kan du sætte asynkron belastning disse scripts optimerer deres arbejde, men dette er mere end et par bevægelser, som jeg skrev om for de dovne.

Selvfølgelig er der sociale mediekoder på internettet, som er placeret inde på din hjemmeside og ikke lækker information nogen steder, men mange af dem indeholder eksterne links til de samme sociale netværk. Webmastere kan ikke lide det eksterne links og derfor, for de mest paranoide webmastere, jeg har samlet klar koder baseret på goodshare.ru scriptet, som vi faktisk takker dem for.

Et eksempel på installation af denne kode er ikke for dem, der ikke kender det grundlæggende i HTML eller CSS, men hvis du har hænderne og lidt tid, vil du lykkes, hvis du følger instruktionerne strengt. Og så gik vi:

De ser sådan ud:

Seks sociale netværk er konfigureret i henhold til standarden: Facebook, VKontakte, Odnoklassniki, Moi Mir, Google Plus, Twitter. Der er mere end 30 af dem i scriptindstillingerne, men alt dette kan installeres separat, hvis det ønskes. Fordelene ved disse knapper, som angivet af forfatterne, som jeg er fuldstændig enig i:

Fantastisk skærm på enhver enhed (Ja, de kan tilpasses enhver skærmstørrelse)

Ren kode - hurtigt og sikkert websted (kun scriptet, CSS og skrifttype indlæses, som kun er på din server)

Alle deler teknologier fra mobile messengers i ét script (alle slags telegrammer)

SEO venlig - ingen links

Indeholder ikke billeder

Hvad gør selve scriptet, og hvorfor var dette script generelt nødvendigt? Scriptet til disse knapper indeholder alle API'er sociale netværk, og scriptet gør ethvert sted på webstedet til en aktiv delingsblok.

For eksempel kan du placere den på tomme DIV-blokke, eller Span, eller billeder eller tomme links, og næsten ethvert element på webstedet kan omdannes til disse knapper. I mit eksempel brugte jeg et script til tomme Divs.

Med hensyn til billederne: de er ikke her. De ikoner du ser er taget fra skrifttypen, de er kun et symbol og intet mere.

Du kan downloade arkivet af knapper på .

Det er meget nemt at installere disse knapper. Der er kun fire filer i arkivet: Font, CSS, JS og TXT.

1). Du skal uploade skrifttypen til en hvilken som helst mappe på din server; du kan placere den samme sted som din JS eller CSS.

2). Upload derefter JS til din server, og vis den på dit websted ved hjælp af kode hvor som helst, men jeg anbefaler helt nederst på siden:

Dette script består af to dele, den første er Jquery, den anden er selve knapkoden. Hvis du allerede har Jquery aktiveret på dit websted, så kan du fjerne den første del af koden og derved reducere filstørrelsen.

VIGTIGT: (for dem, der har fjernet en del Jquery kode) skal knapscriptet indlæses efter Jquery-scriptet.

3). Efter installation af JS og skrifttype, bør du tilføje CSS til dit websted. Du skal blot kopiere hele indholdet af soc.css-filen til et af dine CSS-plugins på webstedet.

VIGTIGT: I linje 82 i soc.css-filen skal du ændre URL'en til din skrifttypeplacering!

4). Efter alt dette skal du kopiere HTML-koden fra HTML.TXT-filen til dit websted, hvor du vil se disse vidunderlige knapper.

Strukturen af scriptet har mulighed for at installere sociale netværksdelingstællere, men du kan læse mere detaljeret i deres dokumentation på hjemmesiden.

Og du kan tjekke driften af scriptet lige under disse linjer, fordi det er den, der er installeret på min blog.

Tak for din opmærksomhed, hvis du har spørgsmål om installation, så skriv kommentarer.

Jeg var sammen med dig, dovne Staurus.