Elke hub is een stapel rijen. Elke rij is verdeeld in kolommen, en elke kolom bevat één element: een tekst, een video, een lijst met cursussen. Deze opbouw houdt hubs leesbaar op elk scherm en laat je een pagina omgooien zonder opnieuw te beginnen. Dit artikel legt uit hoe je die opbouw in de editor maakt en wijzigt.
Open een hub met Bewerken in de hublijst. De editor toont je concept. Wat je hier wijzigt, blijft onzichtbaar voor leden tot je publiceert.
Rijen en hun lay-outs
Klik op Rij toevoegen onderaan de pagina of tussen twee rijen. Het venster toont het tabblad Lay-out met tien lay-outs:
- één kolom van 100%
- twee kolommen van 50% / 50%, 33% / 67%, 67% / 33%, 75% / 25% of 25% / 75%
- drie kolommen van 33% / 33% / 33% of 25% / 50% / 25%
- vier kolommen van elk 25%
- vijf kolommen van elk 20%
De rij verschijnt waar je hebt geklikt, met een lege plek per kolom.
Elke rij heeft een kop met het veld Titel (optioneel). In het voorbeeld toont een rij zonder titel helemaal geen kop. De penseelknop opent Accentlijn, een schakelaar voor het gekleurde accent van de rij. Zodra je die omzet, neemt Op alle rijen toepassen die keuze over voor elke rij van de hub.
Wil je de lay-out van een rij later wijzigen, klik dan op het kleine kolomvoorbeeld in de rijkop, met het label Lay-out. Een lay-out wordt grijs weergegeven als die niet past: Sommige elementen vragen een bredere kolom betekent dat een element te smal zou worden, De laatste kolommen bevatten nog elementen betekent dat je kolommen zou kwijtraken die niet leeg zijn. Verplaats of verwijder die elementen eerst.
Rijen verplaatsen en verwijderen
Met de pijlknoppen verplaats je een rij omhoog of omlaag, of je sleept hem aan de handgreep. In de rijkop staan ook Dupliceren, dat er direct onder een kopie invoegt, Kopiëren en Verwijderen. Bij verwijderen vraagt de editor om bevestiging: “Wil je de hele rij echt verwijderen? Alle elementen erin worden verwijderd!”
Rijen kopiëren tussen hubs
Kopiëren zet een verwijzing naar de rij op je klembord. Klik in een willekeurige hub van je werkruimte op Uit klembord plakken naast Rij toevoegen, en de rij wordt ingevoegd met zijn titel, lay-out, accentlijn en alle elementen. Staat de browser niet toe dat het klembord wordt gelezen, dan vraagt een venster je de verwijzing naar de rij met de hand te plakken.
Elementen toevoegen
Klik op Element toevoegen in een lege kolom. De elementkiezer groepeert elementen in categorieën en heeft een zoekfunctie die op namen en beschrijvingen zoekt. Elke kaart toont de breedtes die het element ondersteunt. Een element dat niet in de kolom past, is gemarkeerd met Niet beschikbaar bij deze kolombreedte. Elementen die bij elke breedte werken, tonen Alle formaten.
Een klik op een kaart opent een voorbeeld, waarin je kunt wisselen tussen Demo-inhoud en Lege staat. Element toevoegen plaatst het element; de knop blijft uitgeschakeld als het element niet in de kolom past. Het nieuwe element wordt meteen opgeslagen en de instellingen gaan ernaast open. Vanaf dan worden wijzigingen automatisch opgeslagen, kort nadat je stopt met typen. In de header staat Opslaan…, Opgeslagen of, als er iets misgaat, Opslaan mislukt.
De volledige lijst met elementen staat in Overzicht van elementtypes.
Elementen wijzigen, verplaatsen en kopiëren
In de werkbalk van het element vind je de instellingen. Afhankelijk van het element staan er ook Lay-out voor de visuele variant en Vak voor het kader. Het elementmenu bevat:
- Element dupliceren, alleen zichtbaar zolang de rij nog een vrije kolom heeft
- Element kopiëren, om het met Uit klembord plakken in een lege kolom te plakken
- Element verwijderen, dat eerst Element verwijderen? vraagt voordat er iets verdwijnt
Om een element te verplaatsen, sleep je het naar een andere kolom, in dezelfde rij of in een andere rij. Laat je het los op een volle rij met gelijke kolommen, dan krijgt die rij er een kolom bij, tot maximaal vijf. Twee meldingen kunnen het verplaatsen tegenhouden: Dit element heeft een bredere kolom nodig en Geen vrije kolom in deze rij.
Controleren voordat je publiceert
Wissel in de header tussen Editor en Voorbeeld. Het voorbeeld verbergt de bewerkingsknoppen, toont lege kolommen als witruimte en laat je de pagina controleren op Desktop, Tablet en Mobiel.
De publicatieknop in de header toont een getal voor de elementen die sinds de laatste publicatie zijn toegevoegd, verwijderd of gewijzigd, plus één als het aantal rijen is veranderd. Wijzigingen aan titels, lay-outs of de volgorde van rijen worden niet meegeteld, maar maken de knop wel actief.
Publiceren wordt uitgelegd in Hubsjablonen en publiceren.