Het structuuroverzicht biedt een structuurweergave van de elementen en clips in uw document. Zet het deelvenster Structuuroverzicht aan of uit via het menu Venster.
De vermelding van elementen van het structuuroverzicht bevat gedeeltelijk dezelfde functionaliteit als elementen op het werkvlak. U kunt bijvoorbeeld op elementen in het structuuroverzicht klikken om ze te selecteren en met de rechtermuisknop klikken om een pop-upmenu weer te geven met opdrachten die specifiek zijn voor dat element. U kunt dubbelklikken op componenten met een bewerkingsdialoogvenster om het dialoogvenster te openen.
Organisatie
Voor HTML5-advertenties en HTML-documenten met pagina's organiseert het structuuroverzicht elementen onder elke pagina in het document. Als u zich in de groepsbewerkingsmodus bevindt, ziet u alleen de elementen in de groep.
Standaard geeft het structuuroverzicht elementen in dezelfde volgorde weer als de lagen op de tijdlijn in de geavanceerde modus. In de voorkeuren voor de ontwerpweergave kunt u overschakelen naar de DOM-volgorde.
Een element uitvouwen of samenvouwen: Klik op de pijl naast een element in het structuuroverzicht om geneste elementen weer te geven of te verbergen.
Alle geneste elementen uitvouwen of samenvouwen: Dubbelklik op de pijl naast een element om alle elementen onder dat element uit te vouwen of samen te vouwen. U kunt dit ook doen door Ctrl (Windows) of ⌘ of Alt (Mac) ingedrukt te houden terwijl u op de pijl klikt.
Elementen opnieuw ordenen: Sleep een element naar de gewenste plek in de vermelding. Er verschijnt een gele lijn waar het element naartoe gaat. U kunt een onderliggend element ook naar een ander bovenliggend element slepen.
Elementen nesten: U kunt een element in een ander element nesten door het over het nieuwe bovenliggende element te slepen. Er wordt een geel vak weergegeven rond het mogelijk bovenliggende element.
Selectie
De selectie wordt gespiegeld op het werkvlak, op de tijdlijn van de geavanceerde modus en in het structuuroverzicht. Dit betekent dat als u een element op de ene locatie selecteert, het ook op de andere locaties wordt geselecteerd. Google Web Designer schakelt waar nodig naar verschillende niveaus binnen geneste elementen of naar verschillende pagina's. Het label van het huidige bovenliggende element wordt geel weergegeven.
Een element selecteren: Klik op een element om het te selecteren.
Meerdere elementen selecteren: U kunt meerdere elementen selecteren als ze hetzelfde bovenliggende element hebben.
- Houd Ctrl (Windows) of ⌘ (Mac) ingedrukt terwijl u op de elementen klikt die u wilt toevoegen aan de selectie.
- Als u een reeks elementen wilt selecteren, klikt u op het eerste element en houdt u vervolgens Shift ingedrukt terwijl u op het laatste element klikt.
Een element deselecteren: Houd Ctrl (Windows) of ⌘ (Mac) ingedrukt terwijl u op het element klikt dat u wilt verwijderen uit de selectie.
Navigeren binnen een element: Dubbelklik op een element om ernaar te navigeren zodat dit het huidige bovenliggende element wordt. U kunt bestaande onderliggende elementen bewerken of nieuwe elementen nesten onder het bovenliggende element. Als het element een component met een bewerkingsdialoogvenster is, wordt het dialoogvenster geopend als u dubbelklikt.
Elementtype en -status
Voor elk element geeft het structuuroverzicht een icoon weer dat het elementtype aangeeft, evenals de element-ID, naam of tekstcontent (indien beschikbaar). Het structuuroverzicht geeft ook de volgende statusiconen weer:
- Een ruiticoon geeft aan wanneer een element een dynamische gegevensbinding heeft.
- Lagen met hulplijnen geven een icoon weer waarop u kunt klikken om de laag met hulplijnen weer te converteren naar een gewoon element.
- Verborgen en vergrendelde elementen worden aangegeven door statusiconen waarop u kunt klikken om het element zichtbaar te maken of te ontgrendelen. Plaats de muisaanwijzer op een zichtbaar of ontgrendeld element om iconen weer te geven waarmee u het element kunt verbergen of vergrendelen.
Iconen voor elk elementtype
Pagina's
| Primaire pagina | |
| Pagina |
Elementen
| Groep | |
| Div | |
| Afbeelding | |
| amp-img (afbeelding in een AMP-document) | |
| Video-element | |
| Tekstcontainer | |
| Genummerde lijst | |
| Lijst met opsommingstekens | |
| Link |
Vormen
| Pad (getekend met het gereedschap Pen) | |
| Rechthoek | |
| Ovaal | |
| Lijn |
Componenten
| Component Gebaar | |
| Component Afbeeldingsknop | |
| Component Parallax | |
| Component Tikgebied | |
| Component Tik om te bellen/sms'en | |
| Component 360°-galerij | |
| Component Carrouselgalerij | |
| Component Galerijnavigatie | |
| Component Veegbare galerij | |
| Component Overgangsgalerij | |
| Component amp-carousel | |
| Component Audio | |
| Component Video | |
| Component YouTube | |
| Component 3D-modelviewer | |
| Component Afbeeldingseffect | |
| Component Deeltjeseffecten | |
| Component Sprite-sheet | |
| Component Krul | |
| Component Knop | |
| Component Selectievakje | |
| Component Dropdownmenu | |
| Component Label | |
| Component Nummerinvoer | |
| Component Keuzerondje | |
| Component Schuifregelaar | |
| Component Tekstveld | |
| Component Toevoegen aan Agenda | |
| Component Datum wisselen | |
| Component Kaart | |
| Component Street View | |
| Component iFrame | |
| Component Sterbeoordelingen |
Achtergrondelementen
| Achtergrondvorm rechthoek | |
| Achtergrondvorm ovaal | |
| Achtergrondvorm polygoon |
Clips
| Audioclip | |
| Videoclip of afbeeldingsclip |
Statusiconen
| Heeft een dynamische of variantbinding | |
| Laag met hulplijnen | |
| Verborgen/weergegeven (wordt weergegeven als u de muisaanwijzer plaatst) | |
| Vergrendeld/ontgrendeld (wordt weergegeven als u de muisaanwijzer plaatst) |
Filteren
U kunt de lijst met elementen filteren die wordt weergegeven in het structuuroverzicht. Als een element overeenkomt met een filter, worden het bovenliggende element en andere bovenliggende elementen ook weergegeven, zodat u kunt zien waar de overeenkomende elementen zich bevinden in de documentstructuur.
Filter elementen door op de ruimte naast het vergrootglasicoon bovenaan het deelvenster structuuroverzicht te klikken en een deel van een element-ID, waarde voor een naameigenschap, tagnaam of groepsnaam te typen. Tekstelementen komen ook overeen op basis van hun tekstcontent. Als u de naam van een item opgeeft, komen componenten die dat item gebruiken overeen.
U kunt ook filters voor elementtype gebruiken.
Filters voor elementtype
Het structuuroverzicht bevat filters om alleen bepaalde elementtypen zoals tekst of vormen weer te geven. Klik bovenaan het deelvenster op de iconen voor de elementtypen die u wilt bekijken in het structuuroverzicht. Wanneer er meerdere filters voor elementtype actief zijn, ziet u elementen die overeenkomen met een of meer van de actieve filters.
Iconen van filters voor elementtype
| Afbeeldingen en video's weergeven | |
| Componenten weergeven | |
| Tekst weergeven | |
| Vormen weergeven |