Ir a contenido principal
Nota: Este contenido se tradujo a través de un software y es posible que no haya sido revisado. La versión en inglés se considera, por tanto, la versión oficial y es posible que haya sido actualizada. Para acceder a la versión en inglés, haz clic aquí.

Personalizar configuración del administrador de diseño

Última actualización: noviembre 3, 2023

Disponible con cualquiera de las siguientes suscripciones, a no ser que se indique de otro modo:

Todos los productos y planes

Personaliza tu experiencia de desarrollador con los ajustes del gestor de diseño. Los ajustes incluyen el comportamiento de inicio predeterminado del gestor de diseño, los ajustes de código para archivos codificados personalizados y el linting de JavaScript.

Para acceder a estas configuraciones:

  • En tu cuenta de HubSpot, dirígete a Marketing > Archivos y plantillas > Herramientas de diseño.
  • En la parte inferior derecha, haz clic en Configuración, luego selecciona Abrir configuración.

design-manager-settings

  • Haz clic en el menú desplegable Configuración para seleccionar el tipo de configuración que quieres ajustar.

    design-manager-settings-dropdown

Configuración general

  • Abrir el buscador al inicio: si está activado, el buscador de la izquierda se abrirá cuando se acceda por primera vez al gestor de diseño.
  • Actualizar previsualizador al cambiar de archivo: al activarlo, el previsualizador del gestor de diseño mostrará el archivo seleccionado en ese momento. Activa esta configuración si deseas obtener una vista preliminar de un archivo a la vez.

Ajustes del código

Apariencia

  • Tema: el esquema de colores utilizado por los editores de código.
  • Fuente: la fuente primaria y el tamaño de fuente utilizados por el editor de código.

Fuente

  • Tamaño de tabulación: la anchura de un carácter de tabulación al pulsar la tecla de tabulación en el editor de código.
  • Unidad de sangría: el número de espacios que debe sangrar un bloque de código mediante sangría inteligente.
  • Tabulaciones suaves: cuando está activada, la tecla de tabulación inserta caracteres de espacio iguales a Tamaño de tabulación en lugar de un carácter de tabulación.
  • Sangría inteligente: cuando está activada, las líneas nuevas siguen la sangría establecida en la línea anterior.
  • Sangría en la entrada de formato: cuando está activada, sangrar la misma línea en la entrada sensible al contexto. Por ejemplo, una sentencia case x:, o un cierre } se sangrarán correctamente cuando se inserten.
  • Sangría con tabuladores: cuando está activada, la sangría automática causada por la sangría inteligente o la entrada de formato utiliza tabuladores.
  • Ajuste de líneas: cuando está activado, las líneas se ajustan en lugar de requerir desplazamiento horizontal.
  • Cierre automático de corchetes: cuando está activado, el editor de código cierra automáticamente los corchetes y las comillas, como:

    () [] {} '' ""
  • Cierre automático de etiquetas: cuando está activado, el editor de código cierra automáticamente las etiquetas XML.
  • Hacer coincidir corchetes: cuando está activado, al colocar el cursor junto a un carácter de corchete se resalta el corchete de apertura o cierre correspondiente.
  • Hacer coincidir etiquetas: cuando está activado, al colocar el cursor junto a una etiqueta se resalta la etiqueta de apertura o cierre correspondiente.
  • Continuar comentarios de bloque: cuando está activado, el editor de código continúa automáticamente los comentarios de bloque al crear nuevas líneas.

Configuración de linting de JavaScript

  • Haz clic para activar o desactivar el interruptor Activar ESLint. Si está activada, ESLint se ejecutará sobre JavaScript al ver la salida en archivos codificados.

    design-manager-coded-file-show-output
  • En el panel izquierdo, establece tu configuración de SELint. Más información sobre la configuración de ESLint.
  • En el panel derecho, una demostración de JavaScript refleja los cambios que haces en la izquierda.
  • Haz clic en Restaurar eslintrc por defecto para restaurar la configuración por defecto.

    js-linter-settings
¿Te resultó útil este artículo?
Este formulario se utiliza solo para recibir comentarios a la documentación. Cómo recibir ayuda con HubSpot.