Navigeren in de codeweergave

In de codeweergave kunt u andere projectbestanden bekijken, naar verschillende locaties in uw document springen en de code doorzoeken.

Browsen door bestanden

Als de codeweergave in Google Web Designer is geactiveerd, ziet u links in het deelvenster Bestanden een lijst met bestanden en submappen in uw projectmap. Het deelvenster wordt automatisch geüpdatet om wijzigingen in de lijst weer te geven.

Bestanden openen

Selecteer een bestand in het deelvenster om dit op een nieuw tabblad te openen. U kunt de volgende bestandstypen openen:

• .html-bronbestanden gemaakt door Web Designer
• andere .html-bestanden*
• .css*
• .js*
• .json*
• .svg*
• .xml*

^{* Alleen voor bewerking in de codeweergave.}

U kunt ook afbeeldingsbestanden (.jpg/.jpeg, .png, .gif) openen voor weergave. Plaats de muisaanwijzer op de bestandsnaam van een afbeelding in het deelvenster Bestanden om een miniatuur van de afbeelding te bekijken.

Bestanden die Web Designer niet kan openen, worden grijs weergegeven.

Als u bestanden voor andere projecten of in andere mappen wilt openen, gebruikt u de menuopdracht Bestand > Openen.

De lijst met bestanden filteren

Geef een deel van een bestandsnaam op in het veld Bestanden filteren  om alleen overeenkomende bestanden weer te geven.

Het deelvenster Bestanden verbergen

Klik rechtsboven in het deelvenster Bestand op de knop Samenvouwen om de lijst met bestanden te verbergen. Klik op de knop Uitvouwen om het deelvenster opnieuw te openen.

Navigeren in uw document

Als u een element selecteert in de ontwerpweergave en overschakelt naar de codeweergave, wordt de cursor bij de relevante code voor het geselecteerde element geplaatst.

Naar een regel gaan

Klik op het regel- of kolomnummer in de voettekstbalk om een nieuwe waarde op te geven en druk vervolgens op Enter.

De minikaart gebruiken

De minikaart aan de rechterkant van het venster geeft een miniatuurversie weer van uw volledige document in de codeweergave. Het codegedeelte dat zichtbaar is in de editor, wordt gemarkeerd op de minikaart.

Klik in de minikaart om naar het bijbehorende gedeelte van het document te gaan of sleep omhoog of omlaag om door het document te scrollen.

U kunt de minikaart via uw voorkeuren uitschakelen.

Zoeken in de code

Tekst zoeken:

1. Ga naar Bewerken > Zoeken of druk op Ctrl+F (Windows) of ⌘+F (Mac) om de zoekbalk onderaan het venster te openen.
2. Geef uw zoekterm op in het veld Zoeken.
3. Schakel de gewenste zoekopties in:
   • Reguliere expressies (.*)
   • Hoofdlettergevoelig (Aa)
   • Hele woorden ()
   • Beperken tot selectie ()
4. Google Web Designer geeft het totale aantal overeenkomsten weer en markeert de eerste overeenkomst na uw cursorpositie.
   • De volgende overeenkomst zoeken: Klik op of druk op Ctrl+G (Windows) of ⌘+G (Mac).
   • De vorige overeenkomst zoeken: Klik op of druk op Shift+Ctrl+G (Windows) of Shift+⌘+G (Mac).
   • Alle overeenkomsten selecteren zodat u ze tegelijkertijd kunt bewerken: Klik op Alles zoeken.

Druk op Esc of klik op X om de zoekbalk te sluiten.

Tekst zoeken en vervangen:

1. Ga naar Bewerken > Zoeken/vervangen of druk op Ctrl+Shift+F (Windows) of ⌘+Shift+F (Mac) om de zoek- en vervangbalk onderaan het venster te openen.
2. Geef uw zoekterm op in het veld Zoeken en uw vervangende tekst in het veld Vervangen.
3. U kunt dezelfde opties gebruiken als bij het zoeken naar tekst (zie hierboven), in aanvulling op het vervangen van tekst:
   • De huidige overeenkomst vervangen en de volgende overeenkomst zoeken: Klik op Vervangen.
   • Alle overeenkomsten vervangen: Klik op Alles vervangen.

Overschakelen naar de ontwerpweergave

Klik rechtsboven in het venster op de knop Ontwerpweergave .