In dit artikel vertel ik je verschillende manieren om social media buttons aan je website toe te voegen. Hiervan vond ik de eerste methode het leukst: knoppen van de Goodshare-service, dus ik zal er eerst over praten.

Knoppen van GoodShare - voor degenen die behoefte hebben aan vrijheid in maatwerk

U zult zeker niet verdwalen op de website van de dienst. Precies in het midden bevindt zich een scriptinstallatieknop; als je erop klikt, krijgen we 2 opties aangeboden. Ik raad de eerste aan, verbinding maken via CDN. Kopieer de code en plak deze ergens in de voettekst van de site, vóór de afsluitende body-tag. In WordPress moet je het in footer.php invoegen.

Geweldig, ga nu terug naar de hoofdpagina van de service en ga naar het tabblad Documentatie. Hier kunt u de code van alle beschikbare sociale netwerken zien. netwerken. U kunt hierboven ook lezen dat de ontwikkelaars van deze knoppen u op geen enkele manier beperken: u kunt het uiterlijk van de knoppen naar wens wijzigen.

Dit is het belangrijkste voordeel van de service ten opzichte van concurrenten, waarover ik in dit artikel zal schrijven. Het ligt in het feit dat u het uiterlijk van de pictogrammen kunt aanpassen zoals u dat wilt! Als voordeel van deze methode zou ik ook willen opmerken dat het script de server niet laadt en de laadsnelheid van de pagina niet negatief beïnvloedt, omdat het erg licht is en kan worden geladen vanaf een CDN.

Kortom, laten we aan de slag gaan. Waar u de sociale knop wilt weergeven. VKontakte-netwerk voeg de volgende code toe:

Waar:
datatype – naam van sociaal. netwerken. Je kunt het opzoeken in de documentatie.
datateller – een teller die het aantal knopdrukken telt. Misschien heb je het niet nodig, dan kun je het gewoon niet schrijven. Als je de documentatie leest, zul je zien dat de teller niet overal wordt ondersteund.

Hoe ontwerp ik knoppen van Goodshare?

Natuurlijk met behulp van CSS-stijlen. Nu zal ik je een voorbeeld laten zien van één knop die ik heb. Het is heel eenvoudig om een ​​knop te ontwerpen door deze te openen via het data-attribuut. Om dit te doen, moet u kennis hebben van attribuutkiezers. Als je er niets van weet, doe dan gewoon wat ik je laat zien, maar als je het onderwerp wilt begrijpen, dan gaat het hier over hen.

Welnu, ik open style.css en helemaal aan het einde van het bestand beschrijf ik de stijlen voor de knop:

Div(achtergrond: #25496F; randradius: 50%; kleur: #fff; maximale breedte: 80px; opvulling: 10px; tekstuitlijning: midden; lettergrootte: 18px; cursor: aanwijzer; )

Zoals je kunt zien, heb ik de attribuutkiezer gebruikt om het te bereiken. Geweldig. Ik zal niet alle stijlregels uitleggen, maar het ziet er zo uit:

Simpel, toch? Maar ik maakte me niet al te veel zorgen, ik schreef gewoon een paar regels met stijlen. En niemand houdt u tegen om stijlen voor de knop in te stellen wanneer u erover beweegt of tijdens een andere actie. Dit is erg cool en iets dat ze je niet laten doen bij het installeren van knoppen met behulp van andere services. In ieder geval degenen die mij bekend zijn.

Ik heb ondertussen al 3 knoppen gemaakt:

Ook al zijn ze een beetje primitief, wat houdt je tegen om snoepjes voor ze te maken? Bovendien zijn ze zelfs in deze vorm al uniek; zulke knoppen bestaan ​​nergens, omdat ik ze persoonlijk net heb gemaakt.

Kortom een ​​script van Goodshare voor wie vrijheid nodig heeft bij het inrichten van sociale media. knoppen Wil je vrijheid? Ontvang het en onderteken het.

Knopen van Pluso

Het bijzondere aan deze knoppen is dat je alleen de 6 populairste sociale netwerken ziet. netwerken, maar als je op het plusje klikt, kun je de opname naar tientallen andere, minder bekende plaatsen sturen.

Op de servicepagina kunt u een van de acht weergavestijlen voor knoppen kiezen; u kunt kiezen welke netwerken u op de eerste regel wilt weergeven en welke u onder het plusteken wilt verbergen. Hieronder kunt u het ontwerp verder aanpassen.

En hieronder ziet u de code die u alleen maar hoeft te kopiëren en plakken op de plek op uw site waar u de knoppen van Pluso wilt zien. Dit is goed omdat je niets extra's naar je server hoeft te uploaden, alles gebeurt heel snel.

Bovendien kunt u het specifieke adres opgeven van de pagina die wordt gedeeld. Dit is zeer zelden nodig. Feit is dat dit standaard gebeurt als je op een knop op sociale media klikt. Het netwerk verzendt het adres van de pagina waarop de knoppen staan. Als u het specifieke adres opgeeft van de pagina die wordt gedeeld, worden deze knoppen, ongeacht waar ze zich bevinden, naar sociale media gestuurd. het netwerk bestaat uit slechts 1 pagina die u hebt opgegeven. Ik weet niet waarom je dit nodig hebt. Laat deze velden in 99% van de gevallen gewoon leeg.

Knoppen van Share42

Share 42 is een andere handige dienst waarmee u sociale knoppen op uw website kunt installeren. Om de installatie te starten, gaat u naar http://share42.com/ru naar de website. Ik ben blij dat alle instellingen op één pagina staan. U kunt de grootte van de pictogrammen kiezen en welke u nodig heeft. Om dit te doen, klikt u één keer op het pictogram.


In deze schermafbeelding kun je zien dat ik 6 knoppen heb geselecteerd om te gebruiken. Verderop moet u aanvullende opties selecteren. In principe is alles daar intuïtief. Al deze velden en selectievakjes zijn optioneel.

Vervolgens biedt de service u aan om te zien hoe uw knoppen eruit zullen zien en vervolgens het script ermee naar uw computer te downloaden. Dit script moet worden uitgepakt. Binnenin bevindt zich een map share42. U moet het naar uw website uploaden. Kijk zelf maar waar. Je kunt gewoon naar de root gaan, maar ik raad aan rechtstreeks naar de sjabloon te gaan.

Nu moet u het pad invoeren naar de map waarnaar u het script op de servicewebsite hebt geüpload. Als u het bijvoorbeeld in een sjabloon hebt geplaatst, zal het pad er ongeveer zo uitzien:
http://site.name/wp-content/themes/template-name/share42/
Nou, dit is als je een website op WordPress hebt. De service vraagt ​​je overigens meteen om te kiezen welke motor je hebt. Selecteer de gewenste optie.

Nadat het pad naar de map met het script is opgegeven en cms is geselecteerd, hoeft u alleen nog maar het gegenereerde stukje code te kopiëren en op de plaats te plakken waar u dezelfde knoppen wilt zien. In WordPress wil je ze bijvoorbeeld waarschijnlijk na elk bericht toevoegen. Om dit te doen, gaat u naar single.php, zoekt u waar de uitvoer van het artikel eindigt en plakt u de code daar. Nu verschijnen de knoppen onder elk artikel. Zo zien ze er in mijn geval uit:

Sociale netwerkknoppen voor de website van Yandex

Een van de meest populaire, misschien wel methoden. Als u deze link volgt, komt u op een pagina waar u sociale knoppen kunt installeren. Yandex heeft alles erg handig gemaakt: de services die we nodig hebben, kunnen eenvoudig worden toegevoegd door ze aan te vinken. Ook kun je het uiterlijk van de knoppen kiezen.

Het thema dat u hebt geïnstalleerd, heeft een lijst met sjablonen. Onder hen zou er single.php moeten zijn, wat een enkele post (post, artikel) betekent. In dit bestand moet u de gekopieerde code plakken. Als u het echter helemaal aan het begin invoegt, staan ​​de knoppen vóór het artikel.

Zelfs als je geen HTML kent, zal ik je een hint geven. Als u van plan bent knoppen aan het begin van het artikel in te voegen, zoek dan het eerste blok (div) in de sjablooncode en plak de code daar. Het is goed als de sjablooncode opmerkingen van ontwikkelaars bevat. Leun op hen. Bijvoorbeeld POST START, CONTENT START, POST END - dergelijke markeringen geven duidelijk aan dat het artikel hier begint of eindigt.

Zie je "bp_after_post_content" in de code? Het is zelfs intuïtief duidelijk dat dit het einde van het artikel is. Vóór dit stukje code heb ik een blok gemaakt waarin ik de code voor de Yandex-knoppen heb ingevoegd.

Hoe dan ook, wanneer u de site bijwerkt en naar het resultaat kijkt, kunt u de code naar een andere plaats in de sjabloon herschikken als u iets verkeerd hebt gedaan. Het enige nadeel van Yandex-knoppen is dat de scripts van internet worden gedownload, maar aangezien ze zich (in de regel) aan het einde van het artikel bevinden, is dit niet kritisch.

De gemakkelijkste manier in WordPress

Hoe voeg ik sociale knoppen toe aan WordPress? De Juiz Social Post Sharer plugin kan je hierbij helpen. Ik schreef al over hem in. Er is trouwens nog een andere optie voor het toevoegen van sociale netwerkknoppen: de Yandex API.

Wel, wel, ik zal hier eindigen. En zo bleken er ongeveer 5-6 manieren te zijn om knoppen toe te voegen als je 2 artikelen combineert. Sommige daarvan zul je waarschijnlijk ook leuk vinden.

Van de auteur: Ik groet je. Tegenwoordig hebben sociale netwerken zich zo ontwikkeld dat er in totaal meer dan 3 miljard mensen in geregistreerd zijn. Dit is potentieel een zeer krachtig publiek, dus vandaag zal ik je vertellen hoe je sociale mediaknoppen aan je website kunt toevoegen.

Toevoegen aan een WordPress-site

Laat ik beginnen met te zeggen dat de eenvoudigste manier, als je WordPress hebt, is om simpelweg een plug-in te installeren. Welke? Ik gebruikte bijvoorbeeld Juiz Social Post Sharer. Over het algemeen typt u gewoon het woord sociaal in de plug-inzoekopdracht en kijkt u wat daar staat. Het enige voordeel hiervan is dat u waarschijnlijk niets hoeft te configureren.

Yandex heeft ook een pagina ontwikkeld waarop u zelf knoppen kunt aanpassen en installeren. Op deze pagina kunt u de diensten selecteren die u nodig heeft (en dat zijn er ongeveer 25). Aan de rechterkant kun je het uiterlijk van het blok kiezen. Dit kunnen tellers zijn die laten zien hoe vaak gebruikers op de knoppen hebben geklikt. Dit zal u op zijn beurt helpen na te gaan of het materiaal nuttig is voor lezers.

JavaScript. Snel beginnen

Uiteraard hoeft u niet alle drie de opties te gebruiken; één is beter. Al heb ik sites gezien waar de blokkering zowel aan het begin als aan het einde van de pagina stond.

Nu moet je het bestand vinden met de code die de artikelen weergeeft. In WordPress wordt het bijvoorbeeld meestal single.php of iets dergelijks genoemd. Dus als je een blok met knoppen na het artikel wilt plaatsen, zoek dan naar de regel_content. Hier kunt u de code plakken. Het zal u enorm helpen als de ontwikkelaar van uw sjabloon opmerkingen in de code heeft gemaakt.

U kunt sitebestanden op verschillende manieren bewerken. Doe dit bijvoorbeeld rechtstreeks via het engine admin panel (uiterlijk - editor). In dit geval is de code niet gemarkeerd, dus het is niet zo handig om te navigeren. Een andere manier is via ftp. Maak verbinding met de site via een FTP-client, ga naar wp-content – ​​thema’s. Hier moet u de sjabloon vinden die momenteel voor u actief is. We gaan erop in en vinden diezelfde single.php of zoeken naar iets soortgelijks in naam.

Zoek in het codebestand zelf de regel the_content met behulp van de zoekfunctie (Ctrl + F). Plak deze code ergens erna.

Opmerkingen zijn groen gemarkeerd in deze schermafbeelding hierboven. Zoals je kunt zien heeft de ontwikkelaar duidelijk aangegeven dat de tekst van het artikel zelf op deze plek wordt weergegeven. Dit is geweldig, plak gewoon de code direct na het artikel en krijg het gewenste resultaat.

Knopen van Pluso

JavaScript. Snel beginnen

Leer de basisprincipes van JavaScript met een praktijkvoorbeeld van hoe u een webapplicatie maakt

U kunt de stijl van de knoppen kiezen en hun achtergrond, positie en grootte aanpassen. Je kunt ook kiezen voor iconen met een ingebouwde teller. Een ander voordeel van Pluso-knoppen is hun verbluffende uiterlijk en de mogelijkheid om ze in vrijwel elk ontwerp te integreren.

Als alles is geconfigureerd, kopiëren we eenvoudig de code en plakken deze op de plaats waar we het bijbehorende blok willen zien.

Een andere optie is Share42

Als de vorige opties je niet bevallen, is er een andere manier om knoppen voor sociale netwerken aan de site toe te voegen. Dit is een share42.com-service. Het werd waarschijnlijk zo genoemd omdat er ten tijde van de oprichting 42 knoppen voor sociale diensten waren, hoewel er momenteel 43 zijn.

Ik zal het proces niet in detail beschrijven, omdat alles al op de website wordt gepresenteerd in de vorm van stapsgewijze instructies. U kunt het ontwerp van deze pictogrammen niet wijzigen, alleen de grootte. Ze zien er echter niet slecht uit.

De pictogrammen die u nodig heeft, moeten worden geselecteerd door erop te klikken met de muis. Afzonderlijk zou ik de aanwezigheid willen opmerken van interessante functies zoals het toevoegen aan browserfavorieten, een link naar RSS en een knop "Terug naar boven".

Vervolgens kunt u het type paneel kiezen: horizontaal of verticaal? En als de tweede is geselecteerd, kan het aantal knoppen worden beperkt. Ik raad aan de codering als UTF-8 te laten staan. U kunt ook een pictogram van de dienst zelf aan de knoppenset toevoegen, zodat gebruikers van uw pagina ernaartoe kunnen gaan en deze knoppen ook voor zichzelf kunnen installeren.

Als u van plan bent een RSS-pictogram toe te voegen, moet u ook het adres van uw feed opgeven en als u het aantal klikken op de knop wilt weergeven, moeten de laatste twee selectievakjes zijn aangevinkt.

Hieronder staan ​​2 knoppen. Met de eerste kun je zien hoe de sociale knoppen die je hebt geconfigureerd eruit zullen zien. Met behulp van de tweede wordt het script gedownload. U moet het via ftp uploaden naar uw website in de hoofdmap.

De volgende stap is het opgeven van het pad naar deze map op de servicepagina. Vaak is het voldoende om site.com te vervangen door uw domeinnaam. Dat is alles, het enige dat overblijft is het invoegen van de code, waarbij u eerst het cms selecteert waarop de bron draait. Je zou al moeten begrijpen waar je de code moet invoegen, hoop ik.

Ik twijfel er niet aan dat er nog een paar normale diensten zijn waar je sociale knoppen kunt maken, en er zijn ook heel veel scripts en plug-ins die deze toevoegen. Vandaag heb ik voor je de, naar mijn mening, beste opties op een rij gezet.

Welnu, vandaag hebben we geleerd hoe u knoppen voor sociale netwerken en services aan uw internetproject kunt toevoegen. Nu kan uw nuttige materiaal automatisch door uw dankbare lezers op sociale netwerken worden verspreid. En dat is alles voor mij.

JavaScript. Snel beginnen

Leer de basisprincipes van JavaScript met een praktijkvoorbeeld van hoe u een webapplicatie maakt

De laatste tijd is het in de mode om sociale netwerkknoppen op websites en blogs te installeren, en dit is niet verrassend. Ten eerste kunt u met de knoppen “likes” en “hearts” vergroten, wat een positief effect heeft op de promotie van artikelen op sociale netwerken. Ten tweede zijn er bepaalde soorten knoppen waarmee u links naar individuele pagina's van de site op sociale netwerken kunt delen - dit trekt extra bezoekers van Vkontakte, Facebook, Odnoklassniki, Twitter, enz. Ten derde worden artikelen die een groot aantal “likes” en “hearts” hebben ontvangen, zeer vertrouwd door sitelezers.

Daarom is het erg belangrijk om te weten hoe u sociale netwerkknoppen op een website kunt installeren om de webbron te helpen ontwikkelen. De meest populaire sociale netwerken zullen worden overwogen

• VKontakte
• Facebook
• Klasgenoten
• Google "+1"
• Twitteren
• Mijn wereld

Hier zullen we kijken naar het installeren van standaardknoppen die door sociale netwerken zelf worden aangeboden. In dit geval zal elke knop apart van de andere geïnstalleerd moeten worden, dit kost wat tijd, maar het ziet er ook erg goed uit.

1.1. VKontakte

1.1.1 Knop “Opslaan”.

De knop is vrij flexibel, de inscriptie erop kan worden gewijzigd naar wat je maar wilt (de standaardinstelling is "opslaan").

Eerst moet u naar de pagina gaan waar u de scriptcode ontvangt die u op uw site moet installeren om de knop weer te geven.

Hier kunt u een van de 5 kiezen stijlen: knop, knop zonder teller, link, link zonder icoon, icoon.

Veld " tekst» hiermee kunt u de standaard “opslaan”-inscriptie wijzigen in uw eigen opschrift.

Als URL kunt u het adres van de pagina met de knop kiezen of het adres van een andere pagina (naar keuze). In het eerste geval deelt de knop een link naar de pagina waar de knop zelf staat. In het tweede geval deelt de knop de link die u opgeeft, ongeacht waar deze zich bevindt.

Code insluiten bestaat uit twee delen : de eerste moet zich ergens tussen de tags bevinden En, de tweede bevindt zich op de plaats waar de knop moet worden weergegeven. Lees meer over het installeren van een knop op een website in paragraaf .

1.1.2 “Vind ik leuk”-knop

De tweede optie voor de knop is de widget “ Ik vind het leuk" Het zal gemakkelijker zijn om het op de site te installeren, omdat... Uiteindelijk ontvang je slechts één stukje code dat op de juiste plek op de site moet worden geplaatst.

Ga naar om de knop te configureren deze koppeling. Ook hier dient u een aantal parameters in te vullen.

Sitenaam– hier is het beter om de korte en echte naam van uw site aan te geven.

Website-adres– geef het adres van de hoofdpagina van uw site op.

Hoofdsitedomein– geef de hoofdspiegel van de site aan (deze kan worden gevonden als een parameter van de “Host” -operator); als u dit moeilijk vindt, laat dan de voorgestelde VKONTAKTE achter.

Knopopties- Dit zijn verschillende stijlen van de knop, ze beïnvloeden het uiterlijk ervan.

Knoop hoogte– geometrische afmetingen “Ik vind het leuk.”

Knopnaam– er zijn twee opties beschikbaar (ik vind het leuk, het is interessant).

Code insluiten– de code die nodig is om de knop voor het sociale netwerk VKontakte weer te geven.

1.2 Facebook

De knop op deze pagina wordt geconfigureerd. Er kunnen problemen ontstaan ​​omdat... De opmerkingen op het formulier zijn in het Engels geschreven, maar hieronder kunt u per veld een korte beschrijving lezen.

URLnaarLeuk vinden– URL van de pagina voor de knop (als het veld niet is ingevuld, wordt het adres overgenomen van de pagina waarop de knop zich bevindt).

VersturenKnop– de aanwezigheid van een vinkje biedt een nieuwe mogelijkheid – om een ​​link naar Facebook te sturen (er verschijnt een extra knop – “verzenden”). Wanneer ingeschakeld, worden twee knoppen tegelijkertijd weergegeven.

Indelingsstijl– knopstijl, beïnvloedt het uiterlijk (beschouwd als standaard knop_graaf).

Breedte– knopbreedte in pixels.

Gezichten tonen– indien ingeschakeld worden avatars getoond van mensen die al op deze knop hebben gedrukt.

Lettertype– lettertype van de knop.

Kleurenschema– achtergrondruimte naast de knop (wit en zwart).

Werkwoord weergeven– knopnaam (zoals, raad ik aan).

KrijgenCode– een knop die scriptcode genereert.

1.3 Odnoklassniki en mijn wereld

Deze sociale netwerken zijn enorm populair geworden op het Russischsprekende internet, er wonen een groot aantal mensen, dus je moet niet nalaten de knop "Klasse" van de Odnoklassniki-service en de knop "Vind ik leuk" van de My World-website te installeren.

Om de knoppen te configureren, gaat u naar . U kunt knoppen afzonderlijk toevoegen en ze allemaal anders aanpassen, of u kunt beide knoppen tegelijkertijd bewerken.

Hoogte maat– geometrische grootte van de knoppen.

Weergave– uiterlijk van het knoppenframe.

– selectie van knoppen (zoals, klasse)

Balie– het in- en uitschakelen van de knopdrukteller (aan de rechterkant, bovenaan – de locatie van de teller).

Tekst op knoppen– selecteer een van de drie beschikbare namen voor de knoppen.

Code insluiten– scriptcode die op de site moet worden geïnstalleerd.

1.4 Google “+1”

Een nieuw sociaal netwerk dat in korte tijd een enorm publiek heeft verworven. Het is moeilijk om je een site voor te stellen zonder de “+1”-knop, omdat... het stelt je niet alleen in staat om links naar een sociaal netwerk toe te voegen en het aantal “pluspunten” te vergroten, maar kan ook de resultaten van de site in de TOP van de Google-zoekmachine beïnvloeden.

Alle details hierover, evenals het installeren en configureren van de knop, bevinden zich.

1.5 Twitteren

De populairste korteberichtenservice kan niet worden genegeerd. Installeer een knop voor dit sociale netwerk en kijk hoe snel mensen links naar uw site op Twitter delen. Hier kunt u de knop aanpassen.

Eerst moet u de gewenste knop selecteren (we zijn geïnteresseerd in de eerste optie: de knop "link verzenden").

Hierna verschijnt er een formulier op de pagina met verschillende velden die moeten worden ingevuld.

Stuur link– selecteer de pagina waarop de knop zich bevindt, of een andere.

Tekst– selecteer de tekst die naast de knop verschijnt (NIET OP DE KNOP ZELF).

Toon teller– het tellen van het aantal knopdrukken in- of uitschakelen.

Door te gebruiken– het kiezen van een methode voor het toevoegen van een linkbericht aan Twitter (heeft vrijwel geen effect).

Markering– een tag selecteren die op Twitter wordt gepubliceerd (heeft nergens invloed op).

Grote knop– het vergroten van de geometrische grootte van de knop.

Meld u af voor Twitter-aanpassing– afwijzing van Twitter-stijlen (het is beter om het veld uitgeschakeld te laten).

Taal– selecteer de taal van de knop.

Aan de rechterkant wordt een code gegenereerd die aan de site moet worden toegevoegd.

1.6 Ya.ru

Om dit te doen, moet u verschillende velden invullen die de vereiste scriptcode genereren.

Maat– kleine of grote knoopgrootte.

Stijl– kies tussen een knop of een pictogram.

Beschikbaarheid van een loket– de knopdrukteller in- of uitschakelen.

Knop uiterlijk– een voorbeeld van hoe de knop eruit zal zien.

Rubriek– selecteer een titel voor de pagina (aangepast of de titel van de huidige pagina).

Code insluiten– de benodigde code die aan de site wordt toegevoegd.

2. Kant-en-klare knoppen voor de site

Maar als je niet voor elke knop de code aan je website wilt toevoegen, kun je standaardscripts gebruiken die meteen een groep sociale netwerkknoppen vormen. In dit geval hoeft u slechts één code van zo'n script aan uw website toe te voegen en worden er onmiddellijk knoppen voor de populairste sociale netwerken geïnstalleerd.

Volg deze link om het blok te configureren en de gewenste sociale netwerken te selecteren. De onderstaande schermafbeelding laat zien dat u uit de aangeboden knoppen de knoppen voor de gewenste sociale netwerken kunt selecteren en ook het uiterlijk van het blok enigszins kunt bewerken.

Aantal diensten– selectie van sociale netwerkknoppen voor de site (de knoppen met een vinkje worden op de site weergegeven).

Code– het benodigde script dat aan de site moet worden toegevoegd.

2.2 PLUSO-knoppen

Onlangs heeft de ontwerper van sociale netwerkknoppen – PLUSO – grote populariteit gewonnen. Via deze link kunt u naar de site gaan.

De constructor is vrij flexibel en heeft veel instellingen, zodat u sociale netwerkknoppen kunt maken die perfect in het ontwerp van de site passen.

Eerst moet je de stijl van knoppen en tellers kiezen uit verschillende aangeboden (horizontaal, verticaal, gekleurd, kleurloos, enz.).

Vervolgens moet u een aantal instellingen configureren door te selecteren

• bloklocatie (verticaal, horizontaal);
• knopkleur (helder, donker);
• blokgrootte (groot, klein);
• teller (aanwezigheid of afwezigheid);
• achtergrond (kleurloos of gekleurd);

De code wordt gegenereerd volgens de door u opgegeven parameters, waarna deze in de site moet worden ingevoegd.

Shaas42

Een andere dienst waarmee u knoppen voor uw website kunt ontwerpen is Share42.com/ru.

Met deze generator kunt u de grootte van knoppen aanpassen, de gewenste sociale netwerken bepalen uit een groot aantal beschikbare netwerken en ook het uiterlijk van de pictogrammen bewerken.

Selecteer de grootte van de knoppen en de gewenste sociale netwerken en ga vervolgens verder met het configureren van aanvullende opties.

Type pictogrampaneel– weergave van een blok knoppen (de optie “verticaal zwevend” is erg interessant).

Beperk het zichtbare aantal pictogrammen– selecteer het aantal knoppen dat moet worden weergegeven (andere worden verborgen achter de link).

Sitecodering– het kiezen van de codering van uw site.

Voeg een pictogram toe voor de site Share42.com– misschien moet het selectievakje uitgeschakeld zijn.

Toon tellers– knopklikkenteller inschakelen (alleen als jQuery actief is).

Het installeren van dit script is behoorlijk ingewikkeld, maar wordt stap voor stap beschreven op de Share42-website zelf.

3. Hoe knoppen op de site te installeren

Als de code die op de site moet worden geplaatst uit twee delen bestaat (zoals het geval is bij de VKontakte-knop), dan wordt elk deel afzonderlijk geïnstalleerd. Als de code niet in twee delen is verdeeld, kan deze stap worden overgeslagen.

Het eerste deel van de code moet tussen de tags worden toegevoegd En. Om dit te doen, logt u in op uw WordPress-beheerderspaneel en gaat u naar de sjablooneditor.

In de sjablooneditor moet u het bestand vinden "Titel" (koptekst.php), als zoiets niet bestaat, dan - "Hoofdsjabloon" (index.php). Nu moet je de tag vinden of. Als dergelijke tags niet in de opgegeven bestanden voorkomen (alle onderwerpen zijn verschillend, dit kan heel goed het geval zijn), dan moet u alle bestanden openen om ze te bewerken en in elk ervan naar de tag zoeken . Om te zoeken kunt u de sneltoets “Ctrl+F” gebruiken.

Zodra je de tags hebt gevonden die je nodig hebt, kun je het eerste deel van de code posten vlak voor de slottaghoofd>, om niet per ongeluk de codes van andere scripts aan te raken.

Het tweede deel van de code wordt geplaatst waar u de voor de site geselecteerde sociale mediaknoppen wilt zien. Als de code uit slechts één deel bestaat, volstaat het om alleen deze bewerking uit te voeren.

Meestal worden knoppen vóór het artikel of aan het einde toegevoegd. Makkelijker is natuurlijk de tweede optie. Wij zullen het overwegen.

U moet de plaats vinden waar het artikel eindigt (het hoofdtekstgedeelte van de pagina). Om dit te doen, moet u het bestand bewerken "Eén plaat" (enkel.php).

Nu moet u de operator vinden die verantwoordelijk is voor het weergeven van de hoofdinhoud van het artikel. In mijn geval is dit “the_content”, direct daarna wordt de knopcode geplaatst.

Op dezelfde manier kunt u de code aan het begin van het artikel plaatsen, u hoeft alleen maar een plaats te vinden tussen de titel en de tekst van het artikel.

Wat is bruikbaarheid en waarom is het zo belangrijk?

Simpel gezegd is bruikbaarheid een indicator van het gemak waarmee u een website kunt gebruiken, erop kunt navigeren en er informatie over kunt zoeken.

Gebruiksvriendelijkheid kan uw website verbeteren of volledig onbruikbaar maken. Als uw bezoekers geen idee hebben waarom uw site nodig is, als ze enkele seconden moeten besteden aan het vinden van de informatie die ze nodig hebben, en niet meteen kunnen begrijpen wat u te bieden heeft, zullen ze uw site snel verlaten en hoogstwaarschijnlijk nooit meer bezoeken. opnieuw zal terugkeren.

Om dit te voorkomen, raden we je aan de fouten te bestuderen die Wix-gebruikers het vaakst maken. Ondanks het feit dat elke gebruiker uniek is, struikelen velen over dezelfde rake. Als u wilt dat uw website uw bedrijf promoot of uw product verkoopt, moet u deze tips in overweging nemen.

8 Veelvoorkomende fouten bij Wix-gebruikers

Mobiele versie negeren. Nu bezoeken steeds meer mensen websites vanaf smartphones en tablets en vergeten ze desktopcomputers. Gelukkig heeft Wix een geweldige HTML5-schrijftool waarmee je elke pagina kunt aanpassen aan kleine schermen. Het enige wat u hoeft te doen is de Wix-editor openen om uw website-ontwerp aan te passen aan de standaarden voor mobiele apparaten.

Geen link in logo. Veel mensen verlaten het tabblad ‘Home’ in het menu en vervangen dit door een link in het logo. Als gevolg hiervan verwachten gebruikers dat als ze op het logo klikken, ze naar de startpagina van de site worden geleid. Omdat een klikbaar logo al lang een standaard is, zou het negeren ervan een grote gebruiksfout zijn.

Ontoegankelijk menu. Als u vergeet een menu toe te voegen aan elke pagina van uw site (niet alleen aan de startpagina), verliest u de meeste bezoekers. Als de gebruiker in dergelijke “doodlopende wegen” terechtkomt, wordt hij gedwongen de hele tijd de knop “Terug” te gebruiken, wat zeker vervelend is.

Inharmonieus ontwerp / moeilijke navigatie. Ga zorgvuldig te werk, zorg ervoor dat de tekst gemakkelijk leesbaar is en dat de links (wees niet verrast!) klikbaar zijn. Gebruik indien mogelijk knoppen als u de gebruiker wilt vragen actie te ondernemen.

Kleine lettergrootte. Let op de verhouding tussen de lettergrootte en het doel van de tekst. Heeft u veel te zeggen, maar kunt u het niet allemaal op één pagina kwijt? Het gebruik van een klein lettertype is niet de beste oplossing. De lettergrootte mag niet kleiner zijn dan 10 pt. of meer dan 14 pt. Ontneem de gebruiker niet de mogelijkheid om het te lezen.

Muziek gebruiken. Als u het nodig vindt om muziek aan uw site toe te voegen, geef bezoekers dan de mogelijkheid om het geluid uit te zetten als ze dat willen. Maar houd er rekening mee dat de meeste doorgewinterde gebruikers het toevoegen van muziek aan een site simpelweg ongepast vinden.

Gebrek aan duidelijke merkbeschrijving. Een veelgemaakte fout is om geen beschrijving op te nemen van uw product of diensten die op uw website worden aangeboden. Laat bezoekers niet raden. Als u in een specifieke regio werkt, vermeld dan de naam, het adres, enz. Dit helpt je onder andere bij zoekmachineoptimalisatie.

Zeven keer beoordelen, één keer publiceren. Vraag een vriend om uw site te bekritiseren. Terwijl u aan uw project werkt, gaat u er zo in op dat u gemakkelijk de eenvoudigste fouten over het hoofd ziet. Een extra paar ogen kan nooit kwaad, maar helpt integendeel de zwakke punten van uw site te identificeren en er met een frisse blik naar te kijken.

Hallo vrienden! Ik ben er zeker van dat absoluut elke eigenaar van zijn of haar blog geïnteresseerd is in de promotie ervan. SEO-optimalisatie, linkuitwisseling, adverteren, etc. dit is allemaal geweldig.

Gisteren ontdekte ik nog een handige truc voor blogpromotie. Namelijk het installeren van knoppen voor het toevoegen van een artikel aan verschillende sociale netwerken (vkontakte.ru, mail, facebook, twitter, etc.). Zeker, velen van jullie kennen deze truc, maar degenen die het niet weten, wees niet ongerust. Alles is heel eenvoudig en vooral effectief voor promotie!

Nu zal ik je vertellen hoe het werkt. Je voegt een nieuw bericht toe aan je blog. Je lezers bekijken het en zeggen: ‘Cool artikel’, ‘Gewoon super’, ‘Zeer nuttige post’, enz.

We keken en zagen knoppen voor toevoeging aan sociale netwerken onderaan het bericht. Ze klikken bijvoorbeeld op "Toevoegen aan de vkontakte-site" en tegelijkertijd verschijnt er een link naar uw artikel in hun profiel met de naam van uw blog en het onderwerp van het artikel. Super!

Kunt u zich voorstellen hoeveel mensen uw artikel tegelijkertijd zullen zien, hoe het verkeer naar uw blog toeneemt en wat als deze mensen uw artikel aan het sociale netwerk toevoegen? Direct virale marketing echter. Schrijf gewoon leuke artikelen. =) Ik denk dat dit een geweldige manier is om reclame te maken!

Er zijn kant-en-klare services voor het invoegen van knoppen op uw blog. Voorbeeld - http://odnaknopka.ru, maar eerlijk gezegd houd ik persoonlijk niet van zulke knoppen, dus heb ik er nog meer gemaakt voor mijn blog. Ze zien er zo uit:

Tegen de tijd dat u dit artikel bekijkt, zijn ze mogelijk al gewijzigd. Als je dezelfde op je blog wilt plaatsen, dan kan dat heel eenvoudig.

1. Download het archief met afbeeldingen van knoppen en HTML-code om deze in een blogsjabloon in te voegen.
2. Kopieer alle afbeeldingen naar de afbeeldingenmap van uw blogthema. (Voor WordPress - wp-content/thems/uw thema/afbeeldingen)
3. Kopieer de voltooide HTML-code en plak deze in het single.php- of index.php-bestand van uw blogthema. Voor wordPress - (wp-content/thems/uw thema/single.php of index.php)

U moet het precies op de plaats in het bestand invoegen waar u uw knoppen wilt zien. In mijn geval is dit het einde van het bericht.

Klaar!!! Je blog heeft nu dus knoppen om toe te voegen aan sociale netwerken.

Alles is hier vereenvoudigd. Kom binnen hier op deze link, vink aan welke knoppen je nodig hebt, kopieer de code en plak deze op de juiste plek in je website, uiteraard via html.

Klaar!!! Het is een kleine zaak. Schrijf nuttige inhoud voor uw lezers, zodat ze deze graag delen met hun vrienden op sociale netwerken en andere bronnen! Heeft u knoppen voor toevoeging aan sociale netwerken op uw website of blog? Ik wens je succes!

P.S. Wat vind je van het artikel? Ik raad je aan om informatie over nieuwe gratis videocursussen en blogwedstrijden niet te missen!

Met vriendelijke groet, Alexander Borisov