Modo de desarrollador

Descripción general

El modo de desarrollador ofrece acceso para editar y modificar los códigos HTML y CSS del sitio web. La incorporación de código personalizado permite una personalización avanzada que no es posible con el editor mediante el método de arrastrar y soltar. Sin embargo, solo los usuarios avanzados con un amplio conocimiento del código de desarrollo web deben realizar esta tarea.

Guía

Hay dos formas de acceder al modo de desarrollador. La forma más sencilla consiste en hacer clic en el botón Modo de desarrollador del menú superior.

developermode1_en-US.png

Otra forma es hacer clic con el botón derecho en un complemento y seleccionar Editar HTML/CSS.

developermode2_en-US.png

A continuación, haz clic en el botón "Modo de desarrollador" ubicado en la parte inferior izquierda.

developermode3_en-US.png

A continuación, procede con tus cambios. Utiliza los botones "Guardar" y "Vista previa" para ver tu trabajo.

developermode4_en-US.png

Utiliza la función "Obtener URL de la imagen" para obtener la dirección URL de una imagen existente o cargar una nueva imagen en este modo para poder introducirla directamente en el código HTML. 

developermode5_en-US.png

Consideraciones

  1. Asegúrate de no salirte de las columnas. Nuestros sitios web responsivos se basan en una estructura de filas y columnas. Esto significa que cada fila contiene una columna, que, en última instancia, contiene los complementos. Al añadir o editar tu propio código HTML, asegúrate de que se encuentra dentro de la columna.
  2. Deja las clases en su lugar. El editor utiliza las diversas clases que se añaden a los elementos. Si ves una clase existente (por lo general, comienza con dm), déjala en su sitio. Si quitas las clases, es posible que el sitio no presente el mismo aspecto en la vista previa.
  3. Observa los tamaños de las clases. La columnas presentan un valor de tamaño que se añade como una clase, por ejemplo, "large-6" o "small-12". Este determina el tamaño de las columnas dentro de esa fila. Es recomendable dejarlas tal cual, ya que son la parte central del ajuste de tamaño de la fila en los diferentes dispositivos.
  4. Evita añadir extensiones siempre que sea posible. En el código HTML, aparecerán marcadores de posición de los elementos de la página. Si es posible, evita modificarlos, sobre todo, los datos-valores incluidos en ellos. Su modificación puede interrumpir los elementos al regresar al creador de sitios web. 
  5. Se realiza automáticamente una copia de seguridad del sitio al acceder al modo de desarrollador. Solo introduce código si conoces su función y realiza copias de seguridad con frecuencia. No podemos solucionar problemas relacionados con el código personalizado.

Errores

DUPLICATE_ID: cada elemento debe tener un ID exclusivo.

INVALID_ELEMENT_LOCATION: todos los elementos deben encontrarse en una columna, que debe estar a su vez en una fila.

BAD_PROPORTION: las columnas de una fila deben sumar 12.

INVALID_CLASS_FOR_ELEMENT: se ha añadido una clase a un elemento no válido.

Preguntas frecuentes

¿Dónde se inserta el código personalizado?

El código personalizado que estará visible en el sitio debe añadirse mediante un complemento de HTML. El que no lo estará debe incluirse en el encabezado. Por lo general, siempre es mejor seguir primero las instrucciones proporcionadas por el autor del código antes de añadirlo al sitio responsivo.