Crear Add-ons

Agrega bloques de código personalizado a tu site para añadir una variedad de funciones personalizadas.

Descripción

Griddo permite la posibilidad de añadir Add-ons desde la configuración del site. En esta sección podemos crear todos los Add-ons que necesitemos de forma rápida y acceder a ellos desde cualquier página. Cuando agregas código personalizado, puedes optar por incluirlo en todas las páginas del sitio o solo en páginas específicas.

Info

Accedemos desde la configuración del site, en la sección Add-ons. Sólo podrás acceder a esta sección si tienes rol Administrator o Super admin.

Crear Add-ons en el site

Los Add-ons se hacen creando Código personalizado que se añade a las páginas que lo necesiten. Incluye opciones de añadirlo en el Head o en el Body.

Trabajar con código de terceros

Cuando recibes código de terceros, te darán instrucciones sobre dónde colocarlo y cómo usarlo. La ubicación correcta es crucial para su correcto funcionamiento.

Add-ons para todas las páginas del site

New: Dando al botón New custom code accedemos a la página para crear un nuevo add-on.
Name: Dale un nombre al add-on. Puedes añadir una breve descripción para identificarlo desde del listado más fácilmente.
Code: Elige dónde colocar tu código, en el Head o en el Body de la página.

Note

Si el código va en el body, se activa la opción para elegir si queremos que vaya al inicio o al final del body de la página.
Code in: Selecciona dónde quieres que aparezca este add-on:
- All pages of the site: Aparecerá en todas las páginas del site por defecto.
- Select manually on page: No aparecerá en ninguna página, la seleccionaremos manualmente desde la página si la necesitamos.
- Choose specific pages: Elegimos las páginas en las que queremos que aparezca este add-on por defecto.
Save: Guardamos, el add-on se crea y se añade a las páginas del site que hayamos seleccionado.
Listado: Volvemos al listado y aparecen los add-ons creados. El último creado aparece el último.

Tip

Dale un nombre fácil de reconocer para que puedas identificarlo rápidamente desde el listado.

Añadir variables a un add-on

Tenemos la opción de añadir variables al código para poder hacer algunas modificaciones en la página. Por ejemplo, cambiar el texto del saludo en un chatbot o modificar un color específico.

Warning

Asegúrate de que el add-on permite el uso de las variables y sigue sus instrucciones para añadirlo en el código.

Add variable: Una vez creado el add-on, añadimos las variables para poder customizarlo después en la página.
Panel: Abre panel lateral con los campos para crear las variables. Elegimos si la variable depende del idioma de la página o no.
Campos: Rellenamos los campos de la variable: Name, Variable key y Default value.
Add: Al darle se crea la variable y se cierra el panel.

Tip

Podemos eliminar una variable accediendo a las acciones de la variable.

Eliminar un add-on

Si ya no necesitamos un add-on, podemos eliminarlo accediendo a las acciones del listado. Siempre nos pedirá que confirmemos la acción antes de realizarla.

Desactivar un add-on

Cuando desactivas un add-on, este add-on no aparece en el listado de add-ons para añadir en una página. Las páginas que lo tuvieran asignado anteriormente, dejan de hacer caso a esa parte del código hasta que vuelva a activarse.

Copiar un add-on en otro site

Podemos copiar un add-on de un site a otro para no tener que hacerlo de cero. Por seguridad, se copia con la opción Add code to: Select manually on page, independientemente de la opción que tuviera seleccionado en el add-on original.

Ordenar el listado

Puedes ordenar y filtrar el listado de add-ons según necesidad:

Ordenar por orden alfabético
Filtrar por el número de páginas que tengan asignadas
Filtrar por estado

Usar los add-ons en las páginas

Una vez creados los add-ons que necesitemos para nuestro site, podemos gestionarlos en las páginas que queramos. Para ello, vamos al listado de páginas y accedemos a una página.

Config: Una vez dentro de la página, entramos en la pestaña config de la página y vemos una sección para gestionar los add-ons.

Note

Los add-ons que hayamos definido para que aparezcan en todas las páginas, apareceran listados aquí.
Add-ons: Para añadir un add-on, damos a y se abre panel lateral con todos los add-ons que hayamos creado previamente en la configuración. Seleccionamos el add-on que queramos añadir.
Añadido: El nuevo add-on se añade a la página. El contenido del add-on se renderiza una vez la página está publicada, por lo que no se visualiza en el editor de Griddo.

Warning

Si el add-on tiene un icono de un , indica que no se puede hacer ninguna edición en el add-on. Cualquier cambio hay que hacerlo desde la configuración de los add-ons.

Editar una variable de un add-on

Cuando añades un add-on a una página que tiene variables asociadas, ésta aparece con la opción Edit. Para editar sus valores, sólo tenemos que darle y se nos abrirá un panel para editar lo que hayamos definido al crearla.

Añadir un add-on propio de la página

Además de los add-ons que creamos en la configuración del site, podemos crear un add-on directamente en una página y sólo actuará en esa página.

Config: Una vez dentro de la página, entramos en la pestaña config de la página y vemos una sección para gestionar los add-ons.
Add-ons: Para añadir un add-on, damos a y se abre panel lateral con todos los add-ons hayamos creado previamente en la configuración. Seleccionamos la última opción que aparece en el listado: Custom code.
Custom code: Rellenamos el Name y ponemos el script en el campo que nos haya indicado el proveedor: en el Head code o en el Body code.

Note

Si el código va en el body, se activa la opción para elegir si queremos que vaya al inicio o al final del body de la página.

Copiar un add-on propio de la página en otra página

Podemos copiar un add-on de una página a otra para no tener que hacerlo de cero.

Copy: Accedemos a las acciones del add-on y seleccionamos la opción copy. El add-on se guarda en el portapapeles.
Paste: Accedemos a la página donde queramos pegarla, ya sea en el mismo site o en uno distinto. Entramos en la pestaña config y clicamos en para pegar el add-on.

Warning

Sólo permite copiar los add-on que se han creado en la propia página.

Quitar un add-on de una página

Si no queremos un add-on en una página, podemos eliminarlo accediendo a las acciones del listado de add-ons. en la pestaña config. Siempre nos pedirá que confirmemos la acción antes de realizar la acción.

Configurar add-ons en paquetes de Content types

Podemos definir que las templates de cualquier tipo de contenido incluyan add-on por defecto. Por ejemplo, podemos definir que el template de una ficha de programa (content type program) siempre apareza con un chatbot por defecto. De esta manera, cuando se cree un nuevo programa, no habrá que ponerlo a mano.

Info

Para acceder a esta configuración, ve a la configuración de site y selecciona Content types.

Configuración template: Al seleccionar una de las templates, nos lleva a un editor con la visualización del template por defecto.
Add-ons: En la sección Add-ons, aparecen los add-ons que se hayan configurado que aparezcan en All pages of the site. Para añadir un add-on, damos a y se abre panel lateral con todas los add-ons disponibles. También tenemos la opción de crear un custom code para este tipo de contenido.
Añadido: El add-on se añade al template.
Save: Guardamos la configuración. A partir de ahora, cuando se crea una nueva página con esta template en este site, tendrá este add-on incluido por defecto. También se actualiza el cambio en todas las páginas previas del site que tengan este template asociado.

Añadir add-ons en páginas de tipo de contenido

Para añadir un add-on adicional a una página de un template de tipo de contenido, lo hacemos de la misma manera que en las páginas normales.

Si la página es global podremos añadir un add-on en la página desde el site, entrando en la pestaña config.