woensdag 21 augustus 2013

Hoe plaats ik een Pin it (Pinterest) knop bij mijn foto in Blogger

Omdat ik er zelf een tijdje naar gezocht heb, wil ik het graag met jullie delen.
Het lijkt moeilijk maar als je gewoon rustig stap voor stap doet. Lukt het wel!
Het is mij toch ook gelukt! :)
Bron


Basis Installatie


  • Stap 1: 

Ga naar Ontwerp (rechts bovenaan), ga in de menu naar SJABLOON, 
Bij sjabloon zie je staan HTML bewerken --> klik!
Dan krijg je iets soortgelijks als dit :


Dan plaats je de volgende code boven <b:skin> </b:skin>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
gelukt?
dan ga je naar SJABLOON OPSLAAN.
zo je eerst deel is al gelukt!

  •     Stap 2: 

Ga naar Indeling. Bij je indeling zie je staan "Een gadget toevoegen" Klik daarop --> in de lijst die je dan krijgt kies je HTML/ JAVASCRIPT en je klikt op het +
Je geeft de gadget geen titel.
Je plaatst onderstaande code bij inhoud. (code vind je op deze link)
Klik op opslaan en klaar!! Neem maar eens een kijkje! Je blog is aangepast!

  • Pin it IN de foto? (zoals op mijn blog?)

Dan ga je naar SJABLOON --> AANPASSEN-->geavanceerd-->CSS toevoegen (onderaan in het lijstje staat dit)
Je vult daar onderstaande code in

a[class*='pin_it_button_inline'] {
position: relative;
right: 45px;
bottom: 10px;
}

Druk op toepassen op blog rechts bovenaan en neem een kijkje!
Gelukt?!
Laat je me weten of het is gelukt?



Special thanks to Marie Mosley!














33 opmerkingen:

  1. Super thanks! Het werkt. Dit had mij anders een avond gekost... gr femke http://www.femkeido.blogspot.nl/

    BeantwoordenVerwijderen
  2. wow wat een geweldige uitleg, super dank daarvoor. en dus gelukt! mint-and-mocha.blogspot.nl

    BeantwoordenVerwijderen
    Reacties
    1. Wat een prachtige blog! Blij dat ik je kon helpen:) Succes met je blog

      Verwijderen
  3. dankjewel voor de duidelijke uitleg. Het is gelukt

    BeantwoordenVerwijderen
  4. Super hard bedankt !!!! Het ging als een fluitje van een cent en duurde maar 5 min ! Als je nog zo'n supertips hebt..? Delen ;)

    x

    www.bardotandcoco.blogspot.be

    BeantwoordenVerwijderen
  5. sorry maar het lukt mij niet hoor. Ik krijg alleen waar ik de gadget gebruikt heb de link. Maar verder geen pin in/op mijn foto.

    BeantwoordenVerwijderen
    Reacties
    1. oei.. probeer nog eens helemaal opnieuw? misschien is er toch 1 foutje in geslopen. Al gelukt intussen?

      Verwijderen
  6. Bedankt Liesbeth, het werkt, grote klasse

    BeantwoordenVerwijderen
  7. Ik zoek me suf naar een manier om dit te doen maar ik loop steeds vast bij stap 2. Ik kan nergens Html javascrips toevoegen. Is dit soms veranderd in de sjablonen van google? Ik hoop dat je mij verder kan helpen!

    BeantwoordenVerwijderen
    Reacties
    1. Beste Marga,
      Probeer nog eens. ga naar boven rechts ONTWERP.
      Daar kies je in de linkse kolom INDELING
      Dan zie je een overzicht waarbij er staat GADGET TOEVOEGEN
      Als je daar op klikt kan je nog steeds kiezen voor HTML/JAVASCRIPT toevoegen.
      Ik heb het gecheckt en het is nog steeds hetzelfde.
      misschien even checken of je de code juist plaatst? Hopelijk lukt het nu
      succes!

      Verwijderen
  8. Gelukt.
    Wilde dit al heel lang, maar lukte eigenlijk niet zo goed. Met jouw uileg, fluitje van en cent. Bedankt.
    www.muntstraatje.blogspot.com

    Sandra

    BeantwoordenVerwijderen
  9. Ah :) Daar ben ik blij om Sandra! Wat leuke dingetjes maak jij allemaal zeg :)! Succes met je muntstraatje! (heerlijke naam)

    BeantwoordenVerwijderen
  10. Yeszzzzz, gelukt!! Dank je wel!!

    Groetjes,
    Margriet

    BeantwoordenVerwijderen
  11. Super bedankt, het is de eerste keer niet gelukt, waarschijnlijk toch nog iets fout gedaan ondanks de duidelijke uitleg. De tweede keer lukte het wel. (voordat ik jouw uitleg gevonden had was ik al een halve dag aan het zoeken op het internet).
    Ik geef de tip door op mijn blog. Nogmaals hartelijk dank!!!

    BeantwoordenVerwijderen
  12. ik probeer het al 3 uur zonder blijvend succes. ik denk dat ik niet precies weet waar ik de tekst moet plakken boven skin. en ik weet niet of ik voor de hover functie alledrie je stapjes moet doen.

    BeantwoordenVerwijderen
  13. gelukt dankzij deze uitleg :) ik wou het al zo lang! joepie :-) thx

    BeantwoordenVerwijderen
  14. Helemaal gelukt :-) Bedankt voor de uitleg!

    BeantwoordenVerwijderen
  15. Mama sieraden, persoonlijk cadeau voor moeders Gepersonaliseerd gravering kindernamen, data of teksten Het liefste mama kado! Bestel hier online

    BeantwoordenVerwijderen
  16. De Pin bij de foto lukt me echt niet...de code die je opschrijft mag toch gewoon achter elkaar staan..?? Zie dat het gewoon moet lukken...maar dat soort dingen heb ik altijd..;-) Het is een super uitleg, ga het nog een keer controleren, er hoeft maar één klein foutje in te zitten...fijn weekend...

    BeantwoordenVerwijderen
  17. Dank je voor de uitleg, het is gelukt!

    BeantwoordenVerwijderen
  18. Het is me gelukt hoor, even zwoegen maar ik heb het, thanx

    BeantwoordenVerwijderen
  19. Hoi het is me niet gelukt doordat ik niet kon vinden in mijn HMTL, weet u hoe dit zou kunnen?

    BeantwoordenVerwijderen
  20. Nou je wil niet weeeeeeeeeeeeeten hoe blij ik ben dat ik vandaag jouw artikel tegen kwam in google. Ik heb eigenlijk weinig verstand van codes en dergelijke. Maar ik heb jouw stappen goed gevolgd en dan kan het niet mis gaan. Echt super! Was er al zo lang mee aan het zwoegen!

    http://easydailyfood.com

    BeantwoordenVerwijderen