Container-widget
Het container-widget stelt je in staat extra widgets toe te voegen in een specifiek container- of blokgebied.
Containers helpen content te organiseren en lay-outs efficiënt te structureren.
Ga naar Widgets – Open de Widgets-paneel in uw editor.
Selecteer "Container" – Vind de Container-widget en voeg deze toe aan je pagina.
Dit stelt je in staat om elementen te groeperen, de ruimte te verbeteren en de ontwerpflexibiliteit te vergroten, waardoor een nette, gestructureerde uitstraling wordt gewaarborgd!
Zodra je container is ingesteld, zijn er veel instellingen beschikbaar om je te helpen de perfecte sectie voor je pagina te creëren en te ontwerpen.
Laten we eens nader kijken naar de containerinstellingen.
Hieronder zie je:
Blokinstellingen
Kolominstellingen
Tabblad blokweergave
Blok toevoegen
Binnen een container kun je bewerken:
Achtergrondkleur
Video toevoegen
Verlopen
Overlays
Vormscheidingen
Ankerpunten
Containerelementen
Voordat we ingaan op de fijnere details, laten we de belangrijkste containerelementen bekijken.
Zoals bij elk container/blok kun je indelingen maken en meerdere horizontale kolommen en ook verticale kolommen creëren. De afbeelding hieronder toont het container/blok dat is verdeeld in 3 horizontale kolommen.
Om de container in maximaal 5 kolommen te splitsen, beweeg je de muis naar de bovenkant van de geselecteerde container of het blok. Er verschijnt een knop om de splitsing uit te voeren.
Opmerking: Elke kolom kan naar de door jou gewenste breedte worden aangepast. Daarnaast kun je ook randen en verschillende kleuren aan elke kolom toevoegen.
In de afbeelding hieronder hebben we een kleur toegevoegd aan de kolommen zodat je visueel kunt zien wat we bedoelen.
Voordat we verder gaan met hoe je kolommen voor je inhoud gebruikt, laten we het creëren van verticale kolommen bespreken. Je kunt een nieuwe kolom boven of onder de bestaande drie kolommen toevoegen. Klik bijvoorbeeld op het plus (+) pictogram om een nieuwe kolom boven toe te voegen.
We hebben een nieuwe rij boven de vorige toegevoegd. Deze rij heeft twee kolommen: wit en zwart ter referentie.
Nu hebben we één container met:
2 kolommen
3 kolommen
Globale kolom
Globale kolommen stroomlijnen je ontwerpproces door je in staat te stellen dezelfde blok op meerdere pagina's te gebruiken. Met de instelling voor globale kolommen kun je één locatie bijwerken en zullen de wijzigingen automatisch worden toegepast op alle kolommen die dezelfde globale kolominformatie delen.
Om een globale kolom te maken, selecteer eerst de gewenste kolom. Ga vervolgens naar het instellingenpop-out en selecteer 'Dit is een globale kolom'.
Na selectie verschijnt er een keuzemenu. Voor nieuwe gebruikers is er slechts één optie beschikbaar, zoals hieronder geïllustreerd:
Na het selecteren van de optie geef je je kolom een naam en klik je op opslaan. Nu is je kolom globaal. Dit betekent dat als je deze kolom kopieert en plakt naar meerdere pagina's op je website, eventuele bewerkingen op alle exemplaren van de globale kolom worden doorgevoerd.
De afbeelding hieronder toont de kolom die we hebben omgezet in een globale kolom. Geen andere kolommen zullen worden beïnvloed.
Om een kolom te verwijderen of te hernoemen, deselecteer je de optie of klik je op de hernoemtekst.
Ankerpunten
Ankerpunten zijn specifieke secties van je website waar je bezoekers naartoe leidt wanneer ze op een call-to-action-knop of een link binnen de tekst klikken.
Als je een knop op je website hebt waarop je wilt dat bezoekers klikken, kun je deze linken naar een specifieke sectie op dezelfde pagina. Bij aanklikken brengt het gebruikers direct naar de sectie waar de ankerpunt is geplaatst.
Hoe voeg je een ankerpunt toe:
Navigeer naar Containerinstellingen.
Selecteer Ankerpunt.
Label je ankerpunt voor toekomstige referentie.
Voeg de ankerpuntlink toe aan de call-to-action (bijv. een knop).
Je ankerpunt toevoegen vanaf je call-to-action
Selecteer je oorspronkeleijke call-to-action. In dit geval gebruiken we een knop.
Selecteer het ankerpunt en kies vervolgens de pagina, sectie of trechterstap waar je ankerpunt zich bevindt. Het zal hetzelfde label hebben dat je eerder hebt toegewezen.
Let op: je kunt, indien nodig, verschillende ankerpunten hebben voor verschillende apparaten 'Mobiel en desktop'.
Zorg dat je je ankerpunt hebt opgeslagen als het niet in het keuzemenu verschijnt. Zodra het is opgeslagen, wordt het vermeld.
Aanvullende containerinstellingen
Binnen de container kun je regelen:
Containervertraging
Verberg/maak container concept
Blok/container positionering
Containervertraging functioneert net als elke widgetvertraging: je kunt een specifieke tijdsduur kiezen waarop de hele container verschijnt wanneer een bezoeker je website bekijkt.
Verbergen of het markeren van een container als concept maakt het onzichtbaar voor websitebezoekers.
Tot slot, blok/container positionering stelt je in staat je containers snel omhoog en omlaag op de pagina te verplaatsen.
Laatst bijgewerkt