Tutorial: leuke social media buttons toevoegen aan je blog

Van de technische kant van bloggen weet ik eigenlijk niet zo heel veel, al zeker niet hoe ik HTML-code moet schrijven. Het heeft even geduurd voor ik doorhad dat je helemaal geen HTML-kennis moet hebben om aan je blog te sleutelen. Zo toonde ik jullie de afgelopen twee weken hoe je zelf een thema kan maken voor je Blogger. En op veelvuldig verzoek voeg ik daar vandaag nog aan toe hoe je zonder HTML-kennis leuke social media-buttons kan toevoegen aan je homepage.

  1. Ga op zoek naar leuke icoontjes. Als je in de zoekbar van Pinterest "free social media buttons" ingeeft, ga je een hele resem aan mogelijkheden vinden. Op mijn Pinterestbord 'bloggen' selecteerde ik er al enkele voor jullie. Er zijn ook Etsy-shops waar je een bestaand of gepersonaliseerd pakket kan aankopen.
  2. Sla deze icoontjes op op je pc. Zorg ervoor dat je ze makkelijk terugvindt.
  3. Open de beheerpagina van je blog en ga naar berichten.


  4. Maak een nieuw bericht aan. Ik gaf het de titel "social media - niet verwijderen".
    (Ter info: het bericht zal niet gepubliceerd worden. Klik wel regelmatig eens op opslaan om je werk niet kwijt te raken.)
  5. Dan klik je links boven op "HTML". Om ervoor te zorgen dat je buttons/icoontjes mooi op je pagina verschijnen, is het belangrijk dat je ze upload terwijl het bericht op HTML staat. (Maar no worries, buiten knippen en plakken is er niets meer wat we gaan doen met de HTML-code).
  6. Klik op het afbeelding-icoon en kies voor uploaden.


  7. Ga naar de map waar je de buttons en icoontjes opsloeg en selecteer degene die je wilt gebruiken.
  8. Zorg ervoor dat er rond alle afbeeldingen een blauw kadertjes staan (d.w.z. dat ze geselecteerd zijn) en klik op 'geselecteerde toevoegen'.


  9. Als de afbeeldingen zijn geüpload, klik je links bovenaan op "opstellen". Nu zie je alle afbeeldingen staan.


  10. Je kan de afbeeldingen nu aanpassen: groter of kleiner, onder elkaar, naast elkaar, ... Heel belangrijk is dat je ze centreert (in het midden zet dus). Dat heeft een mooier effect.
  11. Nu linken we elk icoon aan de juiste social media site. Ik zal het even tonen met Pinterest (de werkwijze is hetzelfde voor eender welke website):

    - Open in een nieuw tabblad Pinterest.

    - Ga naar jouw profiel.

    - Selecteer de url en kopieer hem.

    - Ga terug naar het bericht in Blogger.

    - Selecteer de juiste afbeelding.

    - Klik op link.

    - Plak de URL, selecteer "openen in nieuw venster" en klik op ok.

    Als er nu iemand op de afbeelding klikt, komt hij terecht op de pagina die bij de link hoort.


  12. Doe dit voor alle icoontjes.
  13. Dan klik je linksboven opnieuw op "HTML".
  14. Selecteer alle tekst en druk CTRL + C


  15. Druk nog een laatste maal op opslaan en sluit dan het bericht.
  16. Klik in de linkerkolom op indeling.
  17. Klik op gadget toevoegen.
  18. Scroll tot je "HTML/Javascript" ziet en selecteer dit.
  19. Er zal een pop-up openen waar je de HTML-code kan in plakken (CTRL + V).
  20. Klik op opslaan.
  21. Kies waar in de zijbalk je de buttons wilt door het gadget te verslepen.
  22. Klik op "indeling opslaan".


Wanneer je nu op je blog gaat kijken, zal je de social media buttons zien staan op je homepage. En nog leuker: als je er op klikt, opent een van jouw social media pagina's.



Zo, dit was mijn stappenplan om social media buttons toe te voegen aan je blog. Of het de juiste manier is weet ik niet. Maar het werkt in ieder geval. Ik hoop dat jullie de afgelopen weken wat bruikbaars hebben bijgeleerd over de praktische kan van bloggen? Wat vonden jullie het interessantst?
Als er nog vragen of verzoeken zijn i.v.m. tutorials mogen jullie die zeker hieronder posten.
Liefs,
Miss Pixie

Reacties

  1. Geweldig!!! Ik heb het direct gedaan ze, ik had er zelf toch niet achter gekomen. En inderdaad, zo simpel. Eeuwige dank hiervoor. Nog een kleine laatste gunst, mag ik ook in jouw blogrol? Ik zet je zeker in die van mij. Groetjes.

    BeantwoordenVerwijderen
    Reacties
    1. Blij dat het gelukt is! Is heel graag gedaan :)
      Jah natuurlijk, was hem nog aan het aanvullen, maar kreeg gisteren hoofdpijn van zolang achter de pc te zitten ;)

      Verwijderen
  2. Met heel wat geknoei had ik die van pinterest er al in gekregen maar Facebook wou niet echt lukken. Ga het zeker eens opnieuw proberen nu

    BeantwoordenVerwijderen
    Reacties
    1. Ja, soms is het echt gepruts.
      Ik hoop dat het nu wel lukt :)

      Verwijderen
  3. Zalig! Kei hard bedankt hiervoor...
    Nog een vraagske ... Hoe link je je mail? Daar ben ik precies de weg kwijt ...

    Liefs Marieke

    BeantwoordenVerwijderen
    Reacties
    1. Heel graag gedaan.
      Voor e-mail: link > e-mail aanklikken (ipv webadres) > e-mailadres ingeven en dan opslaan :)

      Verwijderen
  4. Zo eenvoudig! Had ik dat maar eerder geweten! Het was altijd een gesukkel met die codes! Bedankt! x

    BeantwoordenVerwijderen
  5. Dankzij Eefje van Wollebol hier terecht gekomen. En je bericht meteen gesaved om het op een rustig moment toe te passen (als in: als ik geen zuigende baby aan m'n borst heb 😜). Timing is perfect net nu ik actiever aan het worden ben op social media en ik bedacht dat links op m'n blog in dat kader wel handig zouden zijn.
    http://dewereldvansazul.blogspot.nl

    BeantwoordenVerwijderen
    Reacties
    1. Ooh, onlangs mama geworden? Proficiat :)
      Ja, tegenwoordig gaan bloggen en social media hand in hand eh? Veel succes ermee en als je nog vragen hebt mag je zeker mailen ofzo :)

      Verwijderen
    2. Ja, 7 weken geleden van nummertje 2, daarom dat ik niet naar femma's blogschool kon komen. Hopelijk een volgende keer wel. Ik weet je te vinden als ik vast zit.

      Verwijderen
    3. Waauw dat is echt nog ieniminie!
      Geniet er maar volop van :)

      Verwijderen
  6. Als ik nog eens veel tijd en goesting heb ga ik hier zeker en vast het een en ander van toepassen!Dank je wel,hé!

    BeantwoordenVerwijderen
    Reacties
    1. Graag gedaan en veel succes ermee :)
      Je blog ziet er nu al keileuk uit trouwens.

      Verwijderen
  7. Geweldig, dank voor dit stappenplan! Als zeer beginnende blogster was ik al bang dat ik me in het HTML verhaal moest gaan verdiepen, maar dit was een heel bruikbaar verhaal!

    BeantwoordenVerwijderen
  8. Voila, juist mijn knopjes gemaakt en toegevoegd. Bedankt voor de duidelijke uitleg!
    Nu alleen nog eens kijken hoe ik die knopjes om te delen onder elk bericht krijg. Ik heb dat al aangeduid, maar ze staan er niet! Iemand enig idee wat ik mis?

    BeantwoordenVerwijderen
    Reacties
    1. Bij mij stonden die er vanzelf bij, dus kan je niet echt verder helpen.. Ik hoop dat je het ondeetussen al hebt gevonden?

      Verwijderen
  9. bedankt voor je blogtutorials, ik heb als dank een linkje geplaatst op mijn blog (http://spoetniksels.blogspot.be) onder "hoe maakt u het" :) Mijn blog ziet er een pakje beter uit nu (al zeg ik het zelve :) )
    alleen willen die social media buttons niet lukken. hij blijft telkens vaststeken bij het uploaden, ik spit dit nog es verder uit, want wil ze heel graag toevoegen. Nog een ander vraagje: ik zou ook graag zo'n lijstje willen plaatsen van de blogs waar je overal gelezen hebt

    BeantwoordenVerwijderen
    Reacties
    1. Ooh dat is lief van je! Dankjewel :)
      Je blog ziet er inderdaad leuk uit.
      oei, dan zit er misschien een fout op de buttons zelf. Eens proberen met een ander setje?
      Voor die blogs: bij gadgets kan je kiezen voor "blogroll" en daar kan je de blogs die je graags leest toevoegen. Ik heb het zo ingesteld dat er maar een aantal zichtbaar zijn en dat de laatst verschijnde blogposts zichtbaar zijn :)
      Hopelijk snap je het zo? Anders mag je me altijd eens een PB sturen op Facebook.

      Verwijderen
  10. Ik heb net de buttons op mijn blog toegevoegd dankzij jouw uitleg!! Bedankt!!!

    BeantwoordenVerwijderen
  11. Hier ben ik al een hele tijd naar op zoek! Dikke merci!

    BeantwoordenVerwijderen
  12. kijk, alweer een hele tijd na datum helpt je post nog steeds beginnende bloggers! heel mooie handleiding hoor. Bedankt!

    BeantwoordenVerwijderen
    Reacties
    1. Super! Blij dat er nog steeds mensen mijn tutorial gebruiken :) Veel blogsucces!

      Verwijderen
  13. Dankjewel voor deze heldere uitleg!!!

    BeantwoordenVerwijderen

Een reactie posten

Populaire berichten