Ir al contenido principal

Personalizar las descripciones del proyecto con el Constructor de Contenido

Escrito por Ken Van Mechelen

Este artículo es una máquina traducida del engaño

¿Cuál es el generador de contenido?

El Construidor de Contenidos es una potente herramienta para personalizar las descripciones del proyecto. Proporciona una forma flexible de construir páginas interactivas combinando textos, imágenes, multimedia, e incrustaciones de terceros.

Con el Content Builder puedes:

  • Crear diseños ricos usando secciones y columnas

  • Añadir elementos multimedia como vídeos, presentaciones y documentos

  • Insertar encuestas y formularios para la interacción del público

  • Colabore en documentos o comparta actualizaciones directamente en la descripción del proyecto

  • Añadir texto, imágenes e incrustar contenido

  • Incluye encuestas, diapositivas o actualizaciones de noticias antes o durante el compromiso

  • Crear botones para enlazar entre proyectos o fases

  • Añade un bloque HTML para insertar código HTML personalizado directamente en la página de tu proyecto

  • Puedes usar widgets como columnas para rellenar tu página de forma creativa (e. . añadir contenido solo en el centro, añadir una imagen a la derecha, ...)

¿Cómo se encuentra el generador de contenido?

Para proyectos

  1. Pasa el cursor por encima de la vista previa de la página del proyecto

  2. Haz clic en «Editar contenido de la página»

  3. Haz clic en «Ver página » para ver el diseño del escritorio en tiempo real (la vista previa del back-office es más estrecha)

Para carpetas

  1. Ve a la parte más profunda de tu carpeta.

  2. Haz clic en la pestaña «Configuración ».

  3. Debajo de «Descripción de la carpeta », haz clic en «Editar descripción» en el generador de contenido

¿Cómo utilizar los diferentes widgets?

  1. Abrir el editor de Constructores de Contenido

  2. Localice el menú de la izquierda con tres categorías: secciones, diseño y contenido

  3. Arrastra cualquier elemento (por ej., sección, bloque de diseño) al lienzo en el centro de la pantalla

  4. Haga clic en un bloque para editar su texto, imagen o configuración; el editor aparece en el lado derecho de la pantalla

  5. Reorganizar o eliminar bloques según sea necesario

  6. Para borrar un bloque, pasa el cursor por encima de él en el lienzo y usa el icono de borrar que aparece en el propio bloque; el panel de configuración de la derecha no tiene la opción de borrar

Añadir fases y añadir encuestas adicionales

Widget de fases

El widget «Fases» se añadirá por defecto a la página de tu proyecto; puedes cambiar su ubicación arrastrándolo y soltándolo con el generador de contenido, y también puedes eliminarlo. Mostrará automáticamente el nombre de las fases; la fase que esté activa en ese momento aparecerá resaltada en verde, y si esa fase tiene alguna oportunidad de participación (encuesta, enviar una idea, etc.), también aparecerá el botón para enviar una aportación.

Siempre puedes usar el recuadro de participación, donde está el botón de participación, para añadir otro botón de participación más arriba en la página del proyecto.

Widget «Encuestas adicionales» (encuestas paralelas)

Si quieres tener una encuesta siempre activa que no esté vinculada a una fase concreta, puedes crear encuestas adicionales en tu proyecto. Y para que se vean en la página del proyecto, tendrás que añadir el widget «Extra Surveys» en el editor de contenido del proyecto.

Puedes personalizar dónde aparece esta encuesta adicional en la página del proyecto arrastrando y soltando este widget en cualquier lugar del editor de contenido.

ℹ️ Para saber cómo crear una, consulta «Crear una encuesta en la plataforma».

Incrustar en el editor de contenido

Tipos de incrustados soportados

Content Builder soporta una amplia gama de contenido incrustable.

Encuestas: Tipforma, SurveyMonkey, Calidad y otros. Copie el enlace por defecto para compartir y péguelo en el campo incrustado.

Documentos: Google Docs/Sheets/Slides, PDFs y archivos de Microsoft Office a través de OneDrive son compatibles. Extraiga la URL del código incrustado si es necesario.

Mapa: Google Maps y enlaces ArcGIS requieren limpiar el código incrustado para mantener solo la URL https.

Visualizaciones de datos: Las inserciones de Tableau y Google Data Studio requieren que extraigas y modifiques ligeramente la URL de iframs.

Publicaciones sociales: Facebook y Eventbrite son compatibles; Twitter e Instagram no.

Videos: YouTube, Vimeo, Dailymotion, Wistia y Dreambroker (con edición de URL especial) son compatibles.

¿Cómo integrar herramientas de terceros?

  1. Haz clic en la opción <Embed> en el menú de la izquierda

  2. Obtener la URL incrustada de su proveedor de terceros

  3. Pegar la URL en el campo incrustado en Content Builder

Los enlaces incrustados pueden aparecer de forma diferente en dispositivos de escritorio y móviles. Utilice la opción de configuración de altura para asegurar una correcta visualización en todos los dispositivos.

⚠️ Siempre pruebe las incrustaciones abriendo una ventana del navegador incógnito para asegurar que el enlace funcione públicamente.

Editando URLs incrustadas

Muchos enlaces embebidos necesitan ser recortados antes de usarlos.

Cómo limpiar enlaces incrustados:

  1. Copia el código iframe largo.

  2. Eliminar todo antes de https://.

  3. Elimina todo después de la URL (por ejemplo, width= o frameborder=).

Ejemplo para YouTube a continuación:

  1. Prensa Compartir

  2. Insertar en prensa

  3. Obtendrás un enlace parecido a: <iframe width="560" height="315" src="<https://www.youtube.com/embed/abc12>" …>

  4. Sólo copia el enlace https: https://www.youtube.com/embed/abc123

Incrustar PDF

  1. Selecciona el widget Adjuntar archivo para subir un archivo al proyecto

    1. ⚠️ La entrada 360 se abrirá en una nueva ventana, asegúrate de guardar tu proyecto antes

  2. Vuelve al proyecto, en el widget de archivos adjuntos, selecciona el archivo que deseas incrustar

  3. Guarda

  4. Haz clic con el botón derecho del ratón en el archivo adjunto en el front office y selecciona «Abrir enlace en una pestaña nueva».

  5. Copia la URL en la nueva pestaña

  6. Vuelve al generador de contenido y selecciona el widget «Incrustar»; en el campo «Dirección del sitio web», pega la URL de la pestaña «Archivos adjuntos».

  7. Si no quieres que el archivo adjunto sea visible en la descripción del proyecto:

    1. Crea un nuevo proyecto y ocúltalo estableciendo los Derechos de acceso en No listado

    2. Adjunta a este proyecto los PDF que quieras incrustar en otros proyectos

    3. Sigue las mismas instrucciones anteriores para incrustar los PDF

Cómo añadir código HTML personalizado con el bloque HTML

El bloque HTML te permite pegar tu propio código HTML directamente en la descripción de un proyecto o una carpeta. Úsalo cuando los widgets estándar no te permitan crear lo que necesitas, como una tabla con estilo, una lista de definiciones o código de marcado que ya tengas de otra parte.

ℹ️ Tienes que activar el bloque HTML en tu plataforma. Si no lo ves en el menú de la izquierda, ponte en contacto con tu responsable de éxito gubernamental.

Cómo añadir un bloque HTML

  1. Abre el editor de Content Builder.

  2. En la categoría «Contenido» del menú de la izquierda, arrastra el bloque HTML (que aparece justo debajo de «Texto») al lienzo.

  3. Haz clic en el bloque. Se abre un campo de código en el panel de la derecha.

  4. Pega o escribe tu código HTML y, a continuación, haz clic en «Guardar».

  5. Haz clic en «Ver página » para ver el resultado en el diseño de escritorio en tiempo real.

ℹ️ El bloque HTML se puede traducir. Usa el selector de idioma que hay encima del campo de código para introducir código HTML específico para cada idioma de la plataforma. Si dejas un campo de idioma en blanco, los visitantes que hablen ese idioma no verán nada; el sistema no lo rellena automáticamente por ti.

¿Qué código HTML está permitido?

Por motivos de seguridad, tu código HTML se depura al guardarlo.

Guardado:

  • Estructura y texto: títulos, párrafos, saltos de línea, listas, tablas, div, span, encabezado, pie de página

  • Imágenes y enlaces, incluidos los atributos «alt» y «aria-»

  • Multimedia: vídeo, audio, fuente e iframe, incluyendo controles, borde del marco y permitir pantalla completa

  • Estilo en línea mediante el atributo «style», por ejemplo: <h2 style="font-size:30px;">

Eliminado:

  • <el script>, las etiquetas y todo el código JavaScript, incluidos los controladores de eventos como onerror y onclick

  • Elementos de formulario: form, input, button, select, textarea y fieldset. Se elimina todo el formulario, no solo la etiqueta, así que no puedes crear un formulario que funcione en un bloque HTML. Para recopilar respuestas, usa una fase de encuesta o integra un formulario externo con el widget «Incrustar ».

⚠️ Esta limpieza se lleva a cabo al guardar, sin previo aviso. Si parte de tu código HTML desaparece después de guardarlo, es que contenía algo de la lista anterior. Actualiza la página después de guardar para comprobar qué se ha conservado.

ℹ️ A los enlaces que configures para que se abran en una pestaña nueva se les añade automáticamente rel="noopener noreferrer".

Es bueno saberlo

  • El bloque está centrado y tiene el mismo ancho máximo (1200 px) que el resto del contenido de la página.

  • Tu código no se adapta automáticamente a diferentes tamaños de pantalla. Comprueba siempre el resultado en el móvil.

  • El bloque HTML está disponible en cualquier lugar donde haya un generador de contenido: el generador de páginas de proyectos, el generador de descripciones de carpetas y las páginas personalizadas. Cualquiera que pueda editar esa página puede usarla, incluidos los responsables de proyectos y carpetas.

Limitaciones en el generador de contenido

Algunas funciones del Constructor de Contenido tienen restricciones:

  • El redimensionamiento de imágenes no es compatible; las imágenes llenan automáticamente su contenedor.

  • Algunas plataformas sociales (Twitter, Instagram) no pueden integrarse debido a políticas exteriores.

  • Los enlaces embebidos a menudo requieren la edición manual para eliminar el código iframe.

  • En la página del proyecto, puedes arrastrar los elementos a cualquier sección, excepto al encabezado y al título, que se quedan donde están.

Artículos relacionados
¿Ha quedado contestada tu pregunta?