Blogger tips & tricks: eenvoudige (HTML) tutorials

donderdag 19 september 2013 |




Hee wacht, niet afhaken bij het woord 'HTML'! Zó moeilijk zijn die codes niet (als je ze even doorhebt). Mijn blog zou niet kunnen bestaan zonder honderden (HTML)-tutorials. Ik ben namelijk niet iemand die zelf de beste codes kan maken en daarmee mijn blog kan opzetten. Hell no. Gelukkig bestaat er Google en ken ik wat fijne sites om tutorials op te zoeken, en deze wil ik graag met jullie delen! Een eerdere post 'tips om je blog extra leuk te maken' was wel een succes, dus nu ga ik jullie méér tips geven om je (Blogger) lay-out nog meer te personaliseren en mooier te maken! Klik gauw op 'lees verder'!

Een header met Image-maps
Mijn header bestaat uit een logo, volg-knopjes én menuknoppen. En dat allemaal in één header, hoe cool? Met allerlei verschillende links, dus. Dit heb ik gedaan met Image-maps, thanks to Joyce ken ik deze site. Op deze site kun jij je header uploaden, tekst selecteren en daar een link aan toevoegen. Zoals voor 'over mij' of 'contact' op je blog. Heb je alle links ingevuld, dan krijg je een HTML-code. Meer uitleg over de code op je blog zetten kun je hier vinden. Handig toch, om al je volg- en menuknopjes in de header te zetten? 

Blogger-tutorials op Blog Bulk 
Op Blog Bulk heb ik aardig wat tijd doorgebracht, op zoek naar HTML codes. De meest handige codes voor je blog worden daar gegeven. Hoe krijg je een mooie achtergrond? Hoe plaats je een icoontje voor elke titel van een post? Wat je maar wilt weten wordt verteld op Blog Bulk! Gewoon even zoeken wat je wilt weten en je krijgt duidelijke uitleg. Fijne website!

Een Instagram widget op je blog
Dit kan easypeasy! Via Snapwidget heb je meerdere keuzes aan widgets om je Instagram-foto's te laten zien. Heb je mijn foto's al gezien onderaan mijn blog? Jup, dat is een mooi voorbeeld! Je hebt nog meer manieren om je foto's op je blog te laten zien, zoals in een slideshow of 'board'. Je kunt selecteren wat je wilt om de gadget helemaal naar jouw smaak te maken. Dan kopieer je de code en hoppa, zet 'm op je blog bij Indeling -> gadget toevoegen -> HTML/Javascript. Let op, dit werkt alleen als je geen 'slotje' op je account hebt, dus als je Instagram-foto's openbaar zijn.

Reactie'box' boven de reacties
Normaal komt het gedeelte waar je je reactie op een artikel in kunt vullen, onderaan de al bestaande reacties, op Blogger. Met een code kun je dit veranderen, zodat je lezers niet helemaal naar beneden hoeven te scrollen om te reageren! Erg moeilijk is het niet, volg de instructies maar. Het is een kleine verandering, maar makkelijker is het wel, om de 'box' bóven de reacties te hebben. Zie hier hoe je het kunt doen. 

I want more!
Verschillende tutorials kun je vinden op verschillende blogs en sites. Het gaat er dus om dat je ze opzoekt. Hierdoor is mijn lay-out ook zoals het nu is! Ik wil nog één blog noemen waar meerdere tutorials op staan: Nouk-san. Zij vertelt onder andere over hoe je je blogs deelt op social media, een favicon toevoegt of 'opacity' (doorzichtigheid) aan je foto's toevoegt. Heel leuk en leerzaam om doorheen te scrollen! Klik hier voor haar tutorials. 

Heb jij eventueel nog een vraag hierover, dan is het handig om mij even te mailen. Kijk hiervoor bij 'contact' bovenaan mijn blog. Of wil je iets anders weten over HTML of mijn lay-out, mail me, ik probeer zo snel mogelijk terug te mailen! 
Veel succes allemaal! Liefs, Luna

31 opmerkingen:

Je kunt reageren met je Google- of Wordpress account, naam (en optioneel: website), of anoniem. Dankjewel voor je reactie! ♥

  1. Handig artikel! Ik ga zeker even kijken op Blog Bulk :) en ik vind je layout heel mooi <3

    BeantwoordenVerwijderen
  2. AAAH thnx ! Echt een superhandig artikel ! Ik wou dit artikel ook al schrijven maar je bent mij steeds voor haha♥

    Liefs, Nadia

    BeantwoordenVerwijderen
  3. Handig zeg! Ik ga zeker wel even een kijkje nemen! Kisses Jentel

    BeantwoordenVerwijderen
  4. Hele handige tips! Als ik tijd zou hebben...

    Liefs, Mariette

    BeantwoordenVerwijderen
  5. wat handig, thanks.! ik heb een vraag, misschien dat jij het weet. ik heb al een blog, maar in mijn bewerk scherm kan ik klikken op "een nieuwe blog" of zo iets, verdwijnt mijn oude/huidige blog dan niet.? xx

    BeantwoordenVerwijderen
    Reacties
    1. Nee, je huidige blog verdwijnt dan niet hoor! Good luck!

      Verwijderen
  6. Dankjewel voor de tips, ik heb al veel van je geleerd!

    BeantwoordenVerwijderen
  7. Heel handig dit artikel, ga hem opslaan in mijn favorieten haha!

    Liefs Carlijn
    www.madebycarlijn.nl

    BeantwoordenVerwijderen
  8. Superhandig artikel, duidelijk uitgelegd ook :)

    BeantwoordenVerwijderen
  9. Ik gebruik alleen de image-map tot nu toe, maar die reactie systeem boven de reacties lijkt me echt handig, super dat je die er bij hebt gedaan! Ik ga dat op mijn nieuwe blog lay out denk ik aanpassen, haha, veel handiger zo! Heel handig en leuk artikel! Nouk-san is inderdaad een leuke website!
    liefs

    BeantwoordenVerwijderen
    Reacties
    1. Ik zou trouwens alleen nog graag een "beantwoorden" reactie willen hebben, ik weet alleen niet hoe dat moet, misschien maar testen op mijn test blog ook, haha!

      Verwijderen
  10. Heel handig uitgelegd weer! (: Liefs

    BeantwoordenVerwijderen
  11. Wat ontzettend handig! Ik ben ook bezig met HTML, haha! Het is wel 'n gepruts hoor, niet alles doet het nog, maaaar 't gaat al wel veel beter! :-) Ik zal 'ns een kijkje nemen op weergeven sites. Jouw website doet het in ieder geval! Keeei goee! Liefs uit Brabant.

    BeantwoordenVerwijderen
  12. Heel handig artikel! Ik ga gelijk even een kijkje nemen op Blog Bulk. Neem je ook een kijkje op mijn blog? Liefs xx

    BeantwoordenVerwijderen
  13. Wat een ontzettend handig artikel! Bedankt:)

    BeantwoordenVerwijderen
  14. Heel handige tips! Maar zoals je op mijn blog kan zien heb ik dat van de plaatjes in de header uitgeprobeerd maar ik kan mijn hoofdheader niet verwijderen... kan je mij hier misschien mee helpen? :)

    BeantwoordenVerwijderen
    Reacties
    1. Oh en hoe krijg je je header in precies dezelfde kleur als je achtergrond? Dat lukt me namelijk ook niet haha!

      Verwijderen
  15. Super handig deze tips! Blog Bulk kende ik nog niet, eens even checken wat daar allemaal te vinden is :)

    BeantwoordenVerwijderen
  16. Handige post! Ik heb laatst ook bij Nicole een post over HTML gezien en daar ook veel aan gehad :)

    Xx Alex

    BeantwoordenVerwijderen
  17. Wat een handig artikel met zoveel tips! :)
    Hoewel ik les heb gehad in html op school en ik er dus al aardig wat vanaf weet (maar dat was gewoon standaard html en niet specifiek codes die op een blog van pas komen), stonden hier nog wat dingen tussen die ik niet wist/kende! Blog bulk lijkt me erg handig, hoewel ik het tot nu toe ook altijd wel redde met gewoon googlen in het engels!
    Kwam ook pas geleden artisteer tegen, lijkt me ook erg handig! Dus als ik over een tijdje m'n layout zat ben (én tijd heb) ga ik daarmee eens aan de slag :)

    BeantwoordenVerwijderen
  18. Wauw, bedankt voor deze tips. Hier ga ik echt héél veel aan hebben :)

    BeantwoordenVerwijderen
  19. Bij mij doet die header met image maps het niet :(

    BeantwoordenVerwijderen
  20. Super handig dit! heel erg bedankt nu heb ik ook mijn comment box boven aan de reacties! heel erg bedankt om dit te delen xx.

    BeantwoordenVerwijderen
  21. Aaaah heel handig! Alleen zou je miss ook uit kunnen leggen hoe je een tekstje + foto aan de zijkant van je blog doet? Liefs

    BeantwoordenVerwijderen