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

Usa Bloques de código para añadir código personalizado a una página, una publicación de blog, una barra lateral, un pie de página u otra área de contenidos. Los Bloques de código son una buena alternativa si quieres integrar widgets de terceros o personalizar una página más allá de las posibilidades que ofrecen los otros bloques. También puedes usar Bloques de código para incluir HTML o Markdown, o para mostrar fragmentos de código.

Para obtener más información sobre cómo elegir el mejor bloque para tu contenido personalizado, visita Bloques de contenido para insertar versus Bloque de código.

En todos los planes, los Bloques de código admiten HTML, texto sin formato, Markdown y código CSS rodeado por etiquetas <style></style>.

Usar JavaScript o iframes en el Código de bloque es una función Premium disponible en los planes Business y Commerce.

Mira el video

Añadir un Bloque de código

Para añadir un Bloque de código:

  1. Edita una página o una publicación, presiona un punto de inserción y selecciona Código en el menú. Si necesitas ayuda, accede a Cómo agregar bloques.
  2. Añade tu código en la casilla de texto.
  3. Si estás utilizando el Bloque de código para mostrar fragmentos de código, marca Mostrar la fuente.
  4. Haz clic en Aplicar para guardar tus cambios.

Agregar código

Si estás utilizando el Bloque de código para incluir código, cerciórate de seleccionar HTML o Markdown en el menú desplegable.

Ingresa o pega el código en la casilla de texto 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).

Los Bloques de código configurados como CSSJavaScript muestran el código como texto por defecto. Para incluir CSS o JavaScript en Bloques de código, selecciona HTML en el menú desplegable. A continuación, para CSS, rodea el código con tags <style></style>. Para JavaScript, agrega los tags <script></style> antes y después del código.

Nota: Los Bloques de código tienen un límite de 400 KB, que equivale, aproximadamente, a 300 000 caracteres.

Mostrar origen

Si estás utilizando el Bloque de código para mostrar fragmentos de código, marca Mostrar la fuente.

Esto resulta útil para mostrar ejemplos de códigos, ya que los Bloques de código formatean automáticamente fragmentos de código para que sean legibles, por lo que es una mejor alternativa que el Bloque de texto.

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

Vista previa de un código integrado

Como medida de seguridad, a veces el código no aparecerá cuando hayas iniciado sesión, aunque los que visitan el sitio lo puedan ver. Si no puedes visualizar el código que agregaste a un Bloque de código, haz clic en Aplicar la vista previa en modo seguro para ver los elementos incrustados.

Resolución de problemas

Si tienes problemas con los Bloques de código, ten en cuenta lo siguiente:

  • 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 el problema continúa.
  • Si los problemas con el Bloque de código te impiden editar tu sitio, desactiva los scripts en la vista previa para modificar o eliminar el código.

Si todavía tienes inconvenientes, recomendamos que contactes a la fuente (por ejemplo, el servicio del cual recibiste el código para un widget), 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: 87 de 244