HTML op je blog: soms kun je even niet zonder

Gevorderd-klein

html op je blogTegenwoordig bestaan de meeste blogs uit een Content Management Systeem (CMS), waarbij je zelf eenvoudig blogcontent kunt toevoegen, wijzigen en verwijderen. Maar jaren geleden was het bewerken van webpagina’s niet altijd zo simpel. Vaak was kennis van HTML (HyperTekst Markup Language) vereist, de programmeercode voor webpagina’s, en zonder die kennis was het lastig om webpagina’s naar smaak te bewerken.

Bij veel blogsystemen hoef je (gelukkig) geen HTML meer te kennen om je blog te onderhouden. Maar wat als je in WordPress een foto of link in de zijbalk wilt plaatsen? Dan is HTML toch wel erg handig! Daarom leg ik hierbij uit hoe je dat doet.



Een afbeelding plaatsen met HTML

Als je een afbeelding met HTML op een webpagina wilt plaatsen, dan moet je eerst zorgen dat die afbeelding online staat. De HTML-code verwijst namelijk alleen naar de afbeelding en uploadt die niet.

  1. Upload de afbeelding naar een map op je webruimte, bijvoorbeeld in de map ‘afbeeldingen’ (die kun je zelf aanmaken). Je doet dit via de bestandsmanager van je webhostingsoftware of via een FTP-programma zoals FileZilla).
  2. Bewerk of maak een webpagina aan waar de afbeelding moet komen.
  3. Gebruik de volgende HTML-code op deze webpagina om de afbeelding te plaatsen:

<img src=”http://www.website.nl/afbeeldingen/afbeelding.jpg”>

Het deel tussen aanhalingstekens is de URL naar de afbeelding, dus de plek waar je de afbeelding geüpload hebt. Vervang dit deel door de URL van jouw eigen afbeelding.

Bij een webpagina in je blogsysteem heb je bij het bewerken vaak een HTML-gedeelte waar je deze code in kunt plaatsen (in WordPress het tabblat HTML in de bewerker).

html bewerker wordpress

HTML-bewerker in WordPress

Wil je een afbeelding in de zijbalk van je WordPress-blog? Plaats dan een Tekst-widget in de zijbalk en zet daar de HTML-code in. Je vindt de widgets op je Dashboard bij Weergave / Widgets.

html op je blog

HTML in een WordPress-widget

 




Een link plaatsen met HTML

Het is ook mogelijk om via HTML naar een andere webpagina te verwijzen via een link. Gebruik hiervoor de volgende code:

<a href=”http://www.website.nl/webpagina.html”>Linktekst</a>

Het gedeelte tussen aanhalingstekens is de pagina waarnaar je verwijst. Vervang dit deel door de gewenste pagina. De linktekst is de tekst die klikbaar wordt, dus de link op je webpagina. Vervang deze door de tekst die je als link wilt gebruiken.

Misschien wil je de pagina wel in een nieuw venster geopend hebben als iemand erop klikt. Gebruik dan deze code:

<a href=”http://www.website.nl/webpagina.html” target=_blank>Linktekst</a>

Hiermee voorkom je dat webbezoekers je website verlaten als ze de link volgen.

Comments

  1. Leuk artikel Mariska! Hoe meer kennis van HTML, hoe beter je je zakelijke blog in kunt richten. Eigenlijk onmisbaar dus! Ik zou graag eens met je in contact willen komen, maar kan nergens contactgegevens vinden. Vandaar even op deze manier! Wij van HTML Express zouden het heel erg leuk vinden om eens wat verder te praten over HTML en we hebben misschien ook nog wel een leuk voorstel voor je. Mocht je interesse hebben, neem dan gerust contact met me op via bovenstaand e-mailadres. Hopelijk tot spreeks!