Hoe gebruik ik een eigen Pin It Button in WordPress? Plus 12 freebies!

gebruik eigen pin it button

I love Pinterest. Ik kan uren scrollen en op zoek gaan naar lekkere recepten, mooi interieur en geweldige fotografie. Meer dan alleen entertainment, dient Pinterest ook als geweldige inspiratiebron. Ik vind het enorm leuk om nieuwe blogs te ontdekken, of design inspiratie op te doen voor een volgend project. Er is zoveel leuks te vinden dat je heel wat moet doen om ervoor te zorgen dat jouw artikelen opgemerkt worden. De eerste effectieve stap is het toevoegen van de mogelijkheid om jouw artikel of afbeelding te pinnen.

Vandaag laat ik in een paar stappen zien hoe je een eigen Pin It button kan toevoegen aan jouw WordPress thema zodat bezoekers artikelen kunnen gaan delen. En als een bonus heb ik 12 pin it buttons gemaakt die je gratis kan downloaden, zodat je gelijk aan de slag kan.

Wat heb je nodig?

Installeer jQuery Pin It Button For Images Plugin

In je WordPress dashboard ga naar plugins -> nieuwe plugin en zoek naar de plugin jQuery Pin It Button For Images. Klik op installeren en vervolgens activeren.

Onder instellingen in je WordPress menu verschijnt er een nieuw kopje jQuery Pin It Button For Images. Daar kan je de instellingen wijzigen.

Wijzig de instellingen

Op de eerste pagina selection kunnen de meeste instellingen zo blijven staan. Ik pas eigenlijk maar twee instellingen aan, namelijk waar én wanneer de pin it button moet verschijnen.

Ik stel de plugin zo in dat deze alleen verschijnt op pagina’s en volledige artikelen (single posts). Deze instelling is afhankelijk van het thema dat je gebruikt. Mijn homepagina bestaat uit afbeeldingen die doorlinken naar de rest van het artikel dus het zou dubbel zijn als deze ook nog een pin it button krijgen. Hetzelfde geld voor mijn categorie en archief pagina’s.

De minimale resolutie stel ik in op 300px breed en 300px hoog zodat de pin it button niet op kleine afbeeldingen zal verschijnen, deze zijn namelijk helaas niet pin waardig.

Wanneer je hier instellingen wijzigt, vergeet dan niet op Opslaan te klikken.

pinit-settings

Pas de visuele instellingen aan

Wanneer je een afbeelding pint dan is het verstandig dat deze de titel krijgt van het artikel – vandaar selecteer je de instelling Page Title onder Description Source. Vink aan dat de pin altijd direct linkt naar het artikel zelf zodat de pin op Pinterest direct naar het artikel gaat. De Pinterest gebruiker hoeft dan niet op jouw blog te gaan zoeken naar het artikel dat zij graag willen lezen aan de hand van de pin.

Wanneer de bezoeker over een afbeelding gaat dan kan de afbeelding gedeeltelijk transparant worden zodat de aandacht naar de Pin It knop gaat en deze dus ook opvalt! Maak de afbeelding niet té transparant zodat deze compleet wegvalt. Gebruik dus een laag getal, bijvoorbeeld tussen 0.1 en 0.5.

pinit-visual-settings

Eigen Pin It button

Wanneer je een eigen button wilt gebruiken, vink je de optie aan en upload je vervolgens de afbeelding die als Pin It button zal fungeren. De afmetingen van de afbeeldingen verschijnen automatisch maar kunnen ook handmatig aangepast worden.pinit-visual-settings-button

De positie van de pin it button kan zelf instellen – wil je deze gecentreerd in het midden zoals ik heb, dan selecteer je middle. Je hoeft dan geen margins in te voeren bij de volgende stap. Bij de overige opties is het verstandig wel een margin aan te houden anders verschijnt de button tegen de rand van de afbeelding aan, wat niet zo mooi oogt.

pinit-visual-settings-positie

Retina vriendelijk

Op retina computerschermen worden afbeeldingen anders weergegeven. Wanneer je deze optie aanvinkt moet je de pin it button ook 2x zo groot aanleveren omdat deze verkleint wordt. Ik gebruik deze optie zelf niet.


Dat is het! Sla alle gewijzigde instellingen op en bekijk hoe het eruit ziet op jouw website. Mooi, nietwaar? Laten we hopen dat jouw afbeeldingen nu vaker gepind worden! Om extra informatie te laten verschijnen bij iedere pin – zoals jouw blognaam – lees dan ook even hoe je Rich Pins kan instellen voor je blog.

Als bonus heb ik 12 buttons gemaakt die je gratis kan downloaden zodat je gelijk aan de slag kan met het instellen van deze Pin It plugin. Veel plezier ermee!

gratis pinterest buttons

Download 12 Pin It Buttons

Note: Het downloaden zal automatisch starten wanneer je op de download link klikt. Deze Pin It Buttons zijn alleen voor persoonlijk gebruik en niet voor commerciële doeleinden.

Geef een reactie

7 reacties

  1. Simone says:

    Wat een schattige buttons. En superlief dat je ze met ons deelt. Ik kende de plugin zelf wel al. Ik gebruikte deze ook, maar op een of andere manier kwam de standaard button steeds terug. Ook al had ik een custos button geupload. Dat was behoorlijk vervelend, want daardoor zag je er dus steeds twee. En dat was echt niet fijn. Misschien moet ik de plugin eens verwijderen en overnieuw installeren. Heb je dit probleem al eens eerder gehoord?

  2. Nazia says:

    Ik ben hier zooo lang naar op zoek! Ik heb het meteen geinstalleerd 🙂

    thanks!

    xx

  3. Lotte says:

    Ik gebruik hem ook sinds 2 weken alleen kan ik een instelling niet vinden misschien dat jij het weet 😀 Op mijn blog geeft hij de pin it button aan op alle afbeeldingen dus ook mijn header en alles in de sidebar. Dat is natuurlijk niet de bedoeling maar ik kan niet vinden hoe ik het uitschakel op die afbeeldingen. Weet jij dat toevallig 😀

    Super leuke buttons trouwens! Het is dat ik er zelf een heb gemaakt :p

    • Hoi Lotte,

      Wanneer je naar de instellingen van de plugin gaat zie je een kopje Disabled Classes. Bij mij staat er hier nopin. Wanneer ik dat toevoeg aan de class van een afbeelding, dus <img src="http://linknaarafbleelding.jpg" class="nopin"> zal er geen pin it button verschijnen. Ik hoop dat dit helpt! 🙂

  4. kim says:

    Hoi, gaat dit ook met de gratis wordpress versie? groetjes Kim

    • Hoi Kim,

      Je kan bij een gratis WordPress versie geen plugins installeren dus helaas is het plaatsen van een Pinterest button niet mogelijk omdat je daarvoor een plugin nodig hebt.

  5. Jitske says:

    Dankjewel voor deze fijne uitleg! Ik ben een Pinterest newby dus kan de tips goed gebruiken – en de buttons zijn prachtig.