Bekijk ook

Uitleg bij de video

Tekst bewerken & links toevoegen

Om tekst te bewerken, dubbelklik je op het tekstvak. Je kan vervolgens beginnen typen, tekst selecteren en verwijderen, net zoals je in Word doet. Je ziet ook een aantal opties staan boven het tekstvak:


Vervolgens 

Text style

Om je website zo consistent mogelijk te houden qua stijl, raad ik je aan om eerst je tekststijlen in te stellen bij de design instellingen.



Wil je toch een specifiek tekstvak een andere stijl geven, dan kan je dit doen bij Text Settings. Hier kan je allerlei opties instellen voor je tekst zoals het lettertype, lettergrootte, uitlijning, ... en hoe de links in het tekstvak er uit moeten zien.

Let op: als je de tekststijl wilt aanpassen, vergeet dit dan niet te doen voor zowel mobile als desktop. Bovenaan kan je switchen tussen beiden d.m.v. de tabbladen!

Text properties

Bij Text properties kan je twee instellingen terug vinden:

Contact Form: Enable input
Deze optie kan je aanvinken als je wilt dat mensen het tekstvak kunnen invullen. Dit gebruiken we dus voor contactformulieren. Klik op onderstaande knop om de tutorial over contactformulieren te bekijken, waarin ik je deze optie ook helemaal uitleg!




Advanced: Text Tag
Voor elk tekstvak kan je een text tag instellen. Dit gebruik je voor SEO doeleinden (zoekmachineoptimalisatie). Wil je meer weten over SEO en text tags? Klik dan op onderstaande knop om de video tutorial te bekijken!

Size & position

Om de positie van je tekstvak te wijzigen, kan je het tekstvak gewoon selecteren en slepen naar waar jij wilt. Dat is het handige aan het drag & drop systeem van Showit!

Bij Size & Position vind je nog enkele andere opties. Daar kan je de positie echt instellen o.b.v. pixels en vind je ook handige knoppen terug zoals centreren in het canvas en edge locking.
Lees hier meer over edge locking!

Click actions

Bij Click Actions kan je instellen waar het tekstvak naar moet linken. Wil je in de tekst zelf linken, dan gebruik je de opties die tevoorschijn komen boven het tekstvak zelf.

Click actions bij tekstvakken is handig voor tekst van knoppen bijvoorbeeld.

Je hebt verschillende mogelijkheden, zo kan je linken naar:
  • Een pagina op je website
  • Een andere canvas op dezelfde pagina
  • Een externe URL 
  • Jouw social media
  • Jouw telefoonnummer of  e-mailadres
  • ...

Andere bewerkingsmogelijkheden

Tot slot heb je nog een aantal andere bewerkingsmogelijkheden voor tekst:
  • Transitions: creëer bepaalde effecten voor tekst (vb. fade, slide, zoom, ...)
  • Hover: wat moet er gebeuren met de tekst als je hier overgaat met je muis?
  • Effects: hier kan je de transparantie van de tekst instellen, schaduwen en hoeken.

Nieuwe tekst toevoegen

Om nieuwe tekst toe te voegen, heb je twee opties: ofwel dupliceer je een bestaand tekstvak en pas je de tekst aan, ofwel voeg je een nieuwe tekststijl toe. 

Om een bestaand tekstvak te dupliceren kan je het tekstvak gewoon selecteren en kopiëren (ctrl / cmnd + C) en vervolgens plakken (ctrl / cmnd + V). 

Om een nieuw tekstvak toe te voegen, ga je naar de onderkant van je Showit dashboard en selecteer je de tekststijl die je wilt toevoegen. Hier zullen de tekststijlen staan die je hebt toegevoegd bij je Design instellingen. 

Cursief
Doorstreept
Lijst met bullet points
Genummerde lijst
Vet
Link invoegen
Link verwijderen
Design instellingen
Contactformulieren
Content optimaliseren
Daarnaast kan je ook een action instellen voor het klikken op tekst. Zo kan je:
  • Een canvas laten verschijnen wanneer iemand op de tekst klikt (vb. een pop-up laten verschijnen)
  • Een canvas laten verdwijnen wanneer iemand op de tekst klikt (vb. een pop-up laten sluiten)
  • Een galerij actie instellen wanneer iemand op de tekst klikt (vorige. / volgende foto tonen)
Design instellingen

Uitleg bij de video

Afbeeldingen toevoegen aan een pagina

Om nieuwe afbeeldingen toe te voegen, zal je eerst moeten zien dat deze in de mediabibliotheek zijn geupload.

Mediabibliotheek

Een afbeelding uit de template kan je eenvoudig vervangen door te dubbelklikken op de afbeelding, waarna je in de mediabibliotheek terecht komt. Selecteer de foto, je zal nu merken dat de originele template afbeelding wordt vervangen door de jouwe. 

Wil je een extra afbeelding toevoegen aan een pagina? Dan kan je dit doen door eerst naar de pagina en het canvas te gaan waar je de afbeelding wilt plaatsen. Klik nu onderaan op het afbeelding icoontje, dit brengt je naar de mediabibliotheek. Selecteer vervolgens de afbeelding die je wilt plaatsen en klik op de blauwe knop Add To Page. 

Selecteer de afbeelding
Klik op 'Add To Page'

Image

Bij het tabje Image kan je de SEO gegevens invullen van de afbeelding zodat Google weet waarover de afbeelding gaat. Kijk daarvoor even naar de tutorial van SEO!

SEO: Content optimaliseren

Opties voor afbeeldingen

Wanneer je een afbeelding op de pagina selecteert, zal je verschillende tabs te zien krijgen aan de rechterkant van het Showit dashboard:

Je kan hier ook de vulling en positie van de afbeelding wijzigen. Een positie van 50% betekent dat het middelste punt van de afbeelding als referentie genomen wordt, verander je dit bijvoorbeeld naar 0% dan zal het bovenste punt van de afbeelding als referentie genomen worden. Probeer het zelf eens uit!

Let op: voor je een afbeelding upload in Showit...

Zijn je afbeeldingen geoptimaliseerd om te plaatsen op je website? Velen vergeten dit immers, wat leidt tot een trage website!

Neem eerst even een kijkje op onderstaande blog om meer te weten te komen over het optimaliseren van afbeeldingen.

Afbeeldingen optimaliseren voor SEO

Lees de blog

Size & position

Om de positie van de afbeelding te wijzigen, kan je de foto gewoon selecteren en slepen naar waar jij wilt. Dat is het handige aan het drag & drop systeem van Showit!

Bij Size & Position vind je nog enkele andere opties. Daar kan je de positie instellen o.b.v. pixels en vind je ook handige knoppen terug zoals centreren van de afbeelding in het canvas en edge locking.

Lees hier meer over edge locking!

Click actions

Wil je een link plaatsen achter een afbeelding? Dan moet je bij click actions zijn. 

Je hebt verschillende mogelijkheden, zo kan je linken naar:
  • Een pagina op je website
  • Een andere canvas op dezelfde pagina
  • Een externe URL 
  • ...

Andere bewerkingsmogelijkheden

Tot slot heb je nog een aantal andere bewerkingsmogelijkheden voor tekst:
  • Transitions: creëer bepaalde animaties voor afbeeldingen (vb. fade, slide, zoom, ...)
  • Hover: wat moet er gebeuren met de afbeelding als je hier overgaat met je muis?
  • Effects: hier kan je de transparantie van de afbeelding instellen, schaduwen en hoeken.

How to: afbeelding in boogvorm maken

Wil je graag je afbeelding in zo'n mooie boogvorm gieten? Selecteer de afbeelding en ga vervolgens naar Effects. Selecteer vervolgens het middelste icoontje bij de optie Corners en selecteer de vorm die je wilt bekomen!
Selecteer het middelste icoontje
Kies de vorm voor je afbeelding

Galerijen

In Showit heb je ook de mogelijkheid om een galerij toe te voegen aan je website. Hiervoor ga je onderaan in je Showit dashboard naar het middelste icoontje en selecteer je vervolgens Gallery. Je zal zien dat er een grijs kader verschijnt met een mededeling dat je aan de rechterkant de afbeeldingen kan toevoegen aan de galerij. Klik op de blauwe knop Manage Images om foto's toe te voegen.

Showit beschikt over meerdere types galerijen die je kan terugvinden bij Gallery Settings aan de rechterkant:

Simple gallery

Tiled gallery

Sliding gallery

Een simple gallery is een galerij waarbij telkens één afbeelding getoond wordt. De afbeeldingen wisselen elkaar af door een fade of slide transitie die je kan instellen bij Gallery Settings. 

Een tiled gallery is een galerij waarbij alle foto's getoond worden, net zoals een mozaïek. Bij Gallery Settings kan je o.a. het aantal kolommen instellen, de ruimte tussen de foto's, etc.

Een sliding gallery is een galerij in de vorm van een slideshow. Je kan bij Gallery Settings kiezen of deze afbeeldingen automatisch afspelen, maar je kan ook vb. pijltjes toevoegen op de pagina en bij Click Actions een actie instellen om naar de volgende foto van de galerij te gaan. Een andere optie is om bij Gallery Settings aan te duiden om bolletjes te tonen, waar de gebruiker dan ook op kan klikken om te navigeren.

Uitleg bij de video

Video's op je Showit website plaatsen

Wanneer je een video op je website wilt plaatsen, kan je deze best niet rechtstreeks op je website plaatsen (maw uploaden in je mediabibliotheek) aangezien dit je website enorm vertraagd.  Je kan dit eventueel wel doen als je een video wilt instellen als achtergrond bijvoorbeeld, maar zie dus zeker dat deze geoptimaliseerd is voor web!

Er zijn wel twee andere handige methoden om video's op je site te plaatsen: via YouTube en Vimeo. 

Een video toevoegen via YouTube

Upload je video op je YouTube kanaal en kopieer de YouTube ID. Dit is het laatste stukje in de URL van de video:

Stap 1: Voeg een video widget toe

Ga naar het canvas waar je de video wilt plaatsen en ga vervolgens naar de onderkant van je Showit dashboard om een video widget toe te voegen. Je zal zien dat er een grijs kader verschijnt waar straks de video in getoond zal worden.

Selecteer 'Video'
Klik hier om een element toe te voegen

Stap 2: Kopieer de YouTube ID van de video

Stap 3: Plak de YouTube ID in de video widget in Showit

Ga nu terug naar je Showit account en klik op de video widget. Selecteer aan de rechterkant bij 'Video' Type > YouTube. Plak vervolgens de YouTube ID in het daarvoor voorziene veld. Je zal nu een preview te zien krijgen van de video. 

Vervolgens kan je nog allerlei instellingen aanpassen, zoals het al dan niet tonen van de knoppen, of je de video automatisch wilt laten afspelen, ... etc.

Selecteer 'YouTube'
Plak de YouTube ID

Een video toevoegen via Vimeo

Upload je video op je Vimeo profiel en kopieer de Vimeo ID. Dit is het laatste stukje in de URL van de video:

Stap 1: Voeg een video widget toe

Ga naar het canvas waar je de video wilt plaatsen en ga vervolgens naar de onderkant van je Showit dashboard om een video widget toe te voegen. Je zal zien dat er een grijs kader verschijnt waar straks de video in getoond zal worden.

Selecteer 'Video'
Klik hier om een element toe te voegen

Stap 2: Kopieer het laatste stukje van de URL

Stap 3: Plak de Vimeo ID in de video widget in Showit

Ga nu terug naar je Showit account en klik op de video widget. Selecteer aan de rechterkant bij 'Video' Type > Vimeo. Plak vervolgens de Vimeo ID in het daarvoor voorziene veld. Je zal nu een preview te zien krijgen van de video. 

Vervolgens kan je nog allerlei instellingen aanpassen, zoals het al dan niet tonen van de knoppen, of je de video automatisch wilt laten afspelen, ... etc.

Selecteer 'Vimeo'
Plak de Vimeo ID

Daarnaast zie je bij Icon settings ook de optie Custom Icon staan. Dit wilt zeggen dat je ook je eigen icoontjes kan gebruiken. Lees daarvoor deze handige tutorial van Showit!

Uitleg bij de video

Icoontjes toevoegen: pijlen, social media icons, ...

Om een icoontje toe te voegen ga je eerst naar het canvas waar je het icoontje wilt plaatsen. Selecteer vervolgens onderaan in je Showit dashboard het middelste icoontje en klik op Icon. 

Er zal een standaard smiley icoontje verschijnen, maar aan de rechterkant bij Icon chooser kan je zelf je icoontje kiezen. Je hebt icoontjes voor social media, maar ook voor pijlen of mobiele menu icoontjes.

Onder het tabje Icon settings kan je de kleur instellen voor het icoontje, dit zowel voor op desktop als mobile.

Lijnen toevoegen

Om een lijn toe te voegen ga je onderaan in het Showit dashboard naar het middelste icoontje en selecteer je de optie Line. Aan de rechterkant ga je nu verschillende opties te zien krijgen, zoals de kleur van de lijn, de dikte, ... bij Size & Position kan je ook de grootte en positie instellen.

Knoppen toevoegen

Een knop in Showit is niets meer of minder dan een rechthoek met daarboven een tekstvak. Achter deze rechthoek en tekst plaats je vervolgens een klikactie die bepaalt wat er gebeurt wanneer er iemand op de knop klikt. 

Als eerste ga je naar het canvas waar je de knop wilt toevoegen en selecteer je onderaan het middelste icoontje en vervolgens Rectangle. Er verschijnt nu een vorm op de pagina die je eenvoudig kan verkleinen / vergroten d.m.v. de drag & drop functie. Aan de rechterkant zal je een aantal opties zien staan, waaronder Shape Style waar je de kleur en evt. rand van de rechthoek kan instellen.

Uitleg bij de video

Nu is het tijd om tekst in de knop te plaatsen. Voeg een nieuw tekstvak toe en plaats deze boven de rechthoek.

Vervolgens selecteer je beide (tekstvak + rechthoek) en ga je naar Click Actions. Klik op Configure Link en stel de gewenste klikactie in. Zo kan je ervoor kiezen om te linken naar een andere pagina, een canvas op dezelfde pagina, een externe URL, ... etc.

Vormen toevoegen: vierkant, cirkel, ...

Om een vorm toe te voegen selecteer je onderaan in het Showit dashboard de optie Rectangle. Er zal nu een rechthoek verschijnen. Pas deze aan naar wens en maak er vb. een vierkant van.
Bij de optie Effects aan de rechterkant kan je vervolgens bij Corners de hoeken instellen, bij deze optie zorg je er dus voor dat het vierkant een cirkel wordt.

volgende Modules in de Showit cursus

Brochure templates

jouw aanbod in een prachtige brochure

Shop brochure templates

Instagram templates

Til jouw instagram naar een hoger niveau

Shop instagram templates