Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.
Cómo usar Bloques de código

You can use Code Blocks to add custom code to a page, blog post, sidebar, or footer. Code Blocks are good options if you want to embed third-party widgets or customize pages beyond what's possible with other blocks. You can also use Code Blocks to display code snippets or render HTML and Markdown.

Para conocer más acerca de cómo elegir el mejor bloque de contenido, consulta Bloques de Contenido Integrado vs. Bloques de Código.

On all plans, Code Blocks support HTML, plain text, Markdown, and CSS code surrounded by <style></style> tags.

Adding JavaScript or iframes to Code Blocks is a Premium feature available in the current Website Business plan and higher, or while in trial.

Para conocer más, visita Funciones premium.

Mira el video

Paso 1 - Agrega el Bloque de Código

  1. Abre una página o un editor de publicación.
  2. Haz clic en un punto de inserción o en el signo +.
  3. Selecciona Code (Código) del menú.
  4. Para ver los pasos, visita Agregar bloques

Paso 2 - Agrega el código

Si muestras contenido con el Bloque de Código, asegúrate de que HTML o Markdown estén seleccionados en el menú desplegable.

Luego ingresa o pega el código en la casilla y elimina el marcador de posición <p>Hello, World!</p>. Para pegar el código, cópialo, haz clic en la casilla y presiona Ctrl + V (Windows) o Command + V (Mac).

Note: Code Blocks have a 400 KB limit, which is around 300,000 characters.

Tip: CSS and JavaScript display as text by default. To add them to Code Blocks, choose the HTML drop-down and add tags. Surround CSS code with <style></style> tags and surround JavaScript with <script></script> tags.

Paso 3 - Mostrar la fuente (opcional) 

Si estás utilizando el Bloque de Código para mostrar un código, consulta Display Source (Mostrar la fuente).

This is useful for showing examples of code, since Code Blocks automatically format code snippets for readability, making it a better option than the Text Block.

Nota: Ver Origen está siempre seleccionado para las opciones CSS, JavaScript y texto sin formato.

Paso 4 - Guarda

Haz clic en Apply (Aplicar) para publicar los cambios.

Vista previa de un código integrado

Como medida de seguridad, a veces el código no aparecerá cuando hayas iniciado sesión, aun si los visitantes lo pueden ver. Si no puedes ver el código que agregaste a un Bloque de Código, puedes seleccionar Preview in Safe Mode (Aplicar la vista previa en modo seguro) para ver los elementos integrados.

Resolución de problemas

  • Code Blocks have a 400 KB limit, which is around 300,000 characters.
  • El código puede no renderizar si lo agregaste a una página dentro de un índice. Para verificarlo, quita la página del índice dentro del panel de Páginas y cierra la sesión en la página web.
  • La carga de Ajax puede generar problemas con el código personalizado. Para probarla, desactiva Ajax para ver si aún tienes el problema. 

Si todavía tienes inconvenientes para ver el código, recomendamos que contactes a la fuente (por ejemplo, el servicio del cual recibiste el fragmento de código para una aplicación), ya que ellos están más familiarizados con su correcto funcionamiento.

Nota: La personalización de terceros está fuera del alcance de nuestro soporte. Esto significa que no podemos ayudarte más con la configuración o la resolución de problemas de códigos personalizados. Además, con una solución basada en un código, no podemos garantizar su fucionamiento o la compatibilidad total con Squarespace. Esto incluye cómo funciona con nuestro diseño adaptable, en especial su apariencia en dispositivos móviles y sus funciones en todas las plantillas. La personalización de terceros también puede ocasionar problemas de visualización con actualizaciones futuras de nuestra plataforma. Aunque no podemos ayudarte más, hay muchos recursos que te pueden orientar en la dirección correcta.
¿Fue útil este artículo?
Usuarios a los que les pareció útil: 69 de 200
Cómo usar Bloques de código