Navegación en la vista de código

En la vista de código puede ver otros archivos del proyecto, ir a varias ubicaciones dentro del documento y buscar en el código.

Examinar archivos

Cuando se encuentra en la vista de código de Google Web Designer, el panel Archivos de la izquierda muestra la lista de archivos y subcarpetas de la carpeta del proyecto. El panel se actualiza automáticamente para reflejar cualquier cambio que se produce en la lista.

Abrir archivos

Seleccione un archivo en el panel para abrirlo en una pestaña nueva. Puede abrir los siguientes tipos de archivo:

• Archivos .html de origen creados mediante Web Designer
• Otros archivos .html*
• .css*
• .js*
• .json*
• .svg*
• .xml*

^{* Solo se puede editar en la vista de código.}

También puede abrir archivos de imagen (.jpg/.jpeg, .png o .gif) para verlos. Coloque el cursor sobre el nombre de un archivo de imagen del panel Archivos para ver una miniatura de la imagen.

Los archivos que Web Designer no puede abrir se muestran atenuados.

Para abrir archivos de otros proyectos o de otras carpetas, utilice el comando de menú Archivo > Abrir.

Filtrar la lista de archivos

Introduzca parte de un nombre de archivo en el campo Filtrar archivos  para mostrar solo los archivos correspondientes.

Ocultar el panel Archivos

Haga clic en el botón Ocultar , situado en la esquina superior derecha del panel Archivos, para ocultar la lista de archivos. Haga clic en el botón Mostrar  para volver a abrir el panel.

Desplazarse por el documento

Si selecciona un elemento cuando está en la vista de diseño y cambia a la vista de código, el cursor se posiciona en el código correspondiente al elemento seleccionado.

Ir a una línea

Haga clic en el número de línea o de columna de la barra del pie de página para introducir un nuevo valor y, a continuación, pulse Intro.

Utilizar el minimapa

El minimapa de la parte derecha de la ventana muestra una versión en miniatura de todo el documento en la vista de código. La parte del código que está visible en el editor se destaca en el minimapa.

Haga clic en el minimapa para ir a la parte correspondiente del documento o arrastre el cursor hacia arriba o hacia abajo para desplazarse por el documento.

Puede desactivar el minimapa en las preferencias.

Buscar en el código

Para buscar texto:

1. Vaya a Editar > Buscar o pulse Ctrl + F (Windows) o ⌘ + F (Mac) para abrir la barra de búsqueda situada en la parte inferior de la ventana.
2. Introduzca el término de búsqueda en el campo Buscar.
3. Alterne las opciones de búsqueda que quiera:
   • Expresiones regulares (.*)
   • Distinción entre mayúsculas y minúsculas (Aa)
   • Palabras completas ()
   • Restringir a la selección ()
4. Se muestra el número total de coincidencias y se destaca la primera coincidencia que se encuentra después de la posición del cursor en Google Web Designer.
   • Para buscar la siguiente coincidencia, haga clic en  o pulse Ctrl + G (Windows) o ⌘ + G (Mac).
   • Para buscar la coincidencia anterior, haga clic en  o pulse Mayús + Ctrl + G (Windows) o Mayús + ⌘ + G (Mac).
   • Para seleccionar todas las coincidencias y poder editarlas simultáneamente, haga clic en Buscar todo.

Pulse Esc o haga clic en la X para cerrar la barra de búsqueda.

Para buscar y sustituir texto, haga lo siguiente:

1. Vaya a Editar > Buscar/Sustituir o pulse Ctrl + Mayús + F (Windows) o ⌘ + Mayús + F (Mac) para abrir la barra de búsqueda y reemplazo situada en la parte inferior de la ventana.
2. Introduzca el término de búsqueda en el campo Buscar y el texto de sustitución en el campo Sustituir.
3. Puede utilizar las mismas opciones que para buscar texto (las encontrará más arriba), además de sustituir el texto:
   • Para sustituir la coincidencia actual y buscar la siguiente, haga clic en Sustituir.
   • Para sustituir todas las coincidencias, haga clic en Sustituir todo.

Cambiar a la vista de diseño

Haga clic en el botón Vista de diseño , situado en la esquina superior derecha de la ventana.