Functies gevorderden per onderwerp

Werken met HTML-elementen

Met een Content Management Systeem zoals WebHare kun je websites beheren zonder enige kennis van HTML/programmeercode. Toch zijn er soms leuke extra's die je het makkelijkste met een klein stukje HTML-code voor elkaar kan krijgen.

We hebben een aantal tips verzameld, zodat je website ondanks eigen stukjes HTML-code ook op smartphones blijft werken, want dat is niet vanzelfsprekend.

Wanneer gebruik je HTML?

HTML kun je bijvoorbeeld gebruiken om informatie uit een andere website in te laden: 

  • Content van een andere website embedden/insluiten in je eigen webpagina
    • video's (zie hieronder voor specifieke knop)
    • social media elementen
    • presentaties van slideshare
    • content uit andere systemen, bijvoorbeeld de publicaties van je afdeling of van een persoon 
  • Extra functionaliteiten toevoegen aan je pagina

Voor het toevoegen van extra functionaliteiten moeten we je teleurstellen: daar heb je programmeerkennis nodig. Voor het toevoegen van extra functionaliteiten echter niet! Veel systemen bieden je een klein stukje html aan, dat je ook zonder enige programmeerkennis in je website kunt gebruiken. Hieronder leggen we uit hoe je dat in je website zet.

Publicaties van een medewerker of afdeling automatisch in WebHare inladen?
Lees meer

Waar moet ik op letten?

Meeschalen op kleine schermen

De standaard UT-template is zo gebouwd dat deze op kleinere apparaten als smartphones meeschaalt voor goede interactie en leesbaarheid. Als je eigen html gebruikt, kun dit voor problemen zorgen. Als je een klein stukje html (meestal niet meer dan 2 of 3 regels tekst) in je pagina zet, bijvoorbeeld voor een video, dan komen vaak afmetingen erin voor. Voorbeeld: <iframe width="560" height="315" src="https://www.youtube.com/embed/KgzM_YS8258" frameborder="0" allowfullscreen></iframe>. Als je dit soort afmetingen in je HTML-code hebt staan, dan zal je video niet meeschalen op kleine schermen. Het resultaat zie hier in het plaatje hieronder. Daarom is het belangrijk dat je

  • zoveel mogelijk de specifieke elementen in WebHare gebruikt om schaalproblemen te voorkomen of
  • HTML-elementen zonder vaste afmetingen gebruikt

Gebruik daarom van het embedden van video's in WebHare altijd de video-embed functie van de editor, zodat WebHare je video's kleiner maakt op kleinere schermen: 

Voor het embedden van bladerbare PDF's via Isssuu.com kun je de volgende knop (inline elementen) gebruiken. Voor veel andere HTML-elementen zoals het embedden van Slideshare-presentaties of andere inhoud heb je geen specifieke knoppen in WebHare. Indien veel gebruikt, kunnen deze wellicht toegevoegd worden. Je kunt dan bij gebrek aan alternatief gewoon een stukje HTML in je website zetten, met het gevaar dat het element niet netjes meeschaalt als er afmetingen in genoemd zijn.

Veilige content: http en https

De UT-website gebruikt een veilige verbinding via http in plaats van http. Browsers tonen HTML-elementen alleen maar als de geembedde stukken HTML minimaal even veilig zijn. Een stukje HTML-code mag dus nooit http://.. bevatten maar als dit voor een link getoond wordt, dan moet het het https://... zijn. Anders wordt je element niet getoond en zie je alleen een wit vlak. Voorwaarde is natuurlijk dat de website waar je het stukje code vandaan haalt ook HTTPS aanbiedt, maar dat is voor alle grote website meestal het geval. Het toevoegen van de 's' in een link zou daarom meestal voldoende moeten zijn als je HTML-element niet getoond wordt.

HTML gebruiken binnen een WebHare-editor pagina

Als je een html-element op je website wilt gebruiken, doe dit dan met het daarvoor gemaakt inline element. Klik in de editor op de knop met het symbook {...} en kies uit de lijst van inline elementen raw html. Je kan dan een stuk HTML in je pagina plakken en opslaan:

Zo voeg je een HTML-element in je WebHare-editor-pagina toe.

Het volledige bestand/pagina in HTML neerzetten

Indien gewenst kun je een html-bestand aanmaken in plaats van een WebHare-editor-bestand (upload > html file uploaden, bijv xxx.html). Dan is je complete pagina HTML. Dit heeft een aantal nadelen, zoals het niet meer kunnen maken van interne linkjes die automatisch meeveranderen bij het verplaatsen van bestanden of het niet meer kunnen gebruiken van de inline elementen die specifiek voor de editor beschikbaar zijn. Voor gevorderde gebruikers kan een .html bestand in sommige gevallen een optie zijn. We adviseren echter om bij voorkeur de hierboven genoemde optie van HTML in de WebHare-editor te gebruiken, om de uitlijning van de informatie op de website te verbeteren.