Bloques de creación¶
Diseña tu sitio web al arrastrar y soltar bloques de creación que podrás editar para adaptarlos a tus necesidades de contenido y diseño.
Agregar un bloque de creación¶
Para agregar un bloque a una página del sitio web, accede a la página, haz clic en Editar y luego arrastra y suelta el bloque de creación deseado en la ubicación correcta. Hay dos tipos de bloques de creación disponibles: Categorías y Contenido interno. Los bloques de contenido interno solo pueden estar dentro de bloques de categorías.
Al hacer clic en un bloque de categoría aparece una ventana emergente que te permite elegir entre varias plantillas para cada categoría.
Truco
Busca un bloque específico en la ventana emergente Inserta un bloque con la barra de búsqueda.
Una vez que agregues el bloque de categoría podrás arrastrar y soltar los bloques de contenido interno dentro de él. Los bloques de contenido interno te permiten agregar elementos, como videos, imágenes, botones de redes sociales y otros elementos a los bloques de categoría ya existentes.
Nota
También puedes agregar un bloque de creación en la página de inicio de sesión. Para hacerlo, ve a la página principal del sitio web, agrega
/web/logina la URL y presionaenter.El acceso a ciertos bloques requiere instalar su respectiva aplicación o módulo (por ejemplo, Comercio electrónico para el bloque Productos).
Example
Agrega todas tus cuentas de redes sociales a un solo lugar con el bloque de contenido interno para redes sociales. Presiona el botón que se encuentra junto a cada plataforma para mostrarlo u ocultarlo y copia y pega la URL de tu cuenta.
Formulario¶
El bloque Formulario sirve para recopilar información de los visitantes del sitio web y, si aplica, crear registros en tu base de datos. Para agregar un formulario a una página del sitio web, arrastra y suelta el bloque de categoría Contacto y formularios y después elige un bloque en la ventana emergente.
Acción¶
De forma predeterminada, al enviar el formulario, el sistema envía un correo de forma automática con la información que ingresa el visitante. Según las aplicaciones que tengas instaladas en tu base de datos, aparecerán acciones adicionales que crean registros de forma automática. Para elegir otra acción haz clic en Editar, haz clic en el formulario, ve a la pestaña Estilo y selecciona la acción deseada:
Postular (Reclutamiento)
Crear un cliente (Comercio electrónico)
Crear un ticket (Soporte al cliente)
Crear una oportunidad (CRM)
Suscribir al boletín (Marketing por correo)
Crear una tarea (Proyectos)
Más modelos: para generar otros tipos de registros
Enviar el formulario redirige a los visitantes a una página de agradecimiento de forma predeterminada, pero puedes usar el campo URL para enviarles a otra página. También puedes dejar que los visitantes permanezcan en la página del formulario si seleccionas la opción Nada o Mostrar mensaje en el campo Éxito.
Campos¶
Para agregar un nuevo campo al formulario, ve a la pestaña Estilo y haz clic en el botón + Campo ubicado junto a la sección Formulario o Campo. Para modificar un campo del formulario, selecciónalo y usa las opciones disponibles en la sección Campo de la pestaña Estilo. Por ejemplo, puedes:
Cambiar el tipo de campo.
Truco
Puedes seleccionar un campo existente de una base de datos y usar su respectiva información. Los campos disponibles dependen de la acción que hayas seleccionado. También puedes utilizar los campos de propiedad que hayas agregado a la base de datos.
Algunos campos son similares visualmente, pero la información ingresada debe seguir un formato específico.
Editar la etiqueta del campo y adaptar su posición.
Habilita una descripción del campo. Presiona el botón y haz clic en la descripción predeterminada del formulario para modificarla.
Agregar un marcador de posición o valor predeterminado.
Especificar si el campo es obligatorio.
Editar los ajustes de visibilidad del campo.
Agregar una animación.
Haz clic en Guardar una vez que hayas hecho todos los cambios necesarios.
Agregar un formulario de contacto de Odoo a un sitio web que no sea de Odoo¶
Puedes mostrar un formulario de contacto de Odoo en otro sitio web mediante un iframe. Sigue estos pasos para hacerlo:
Diseña el formulario de Odoo: Crea un formulario de contacto en una página del sitio web de Odoo y elimina el diseño del encabezado y el diseño del pie de página. Asegúrate de que solo quede el formulario de contacto en la página.
Genera un código incrustable: Copia la URL de la página del formulario de Odoo y pégala en un generador de iframes, como La Digitale.dev o iFrame Generator. Ajusta el ancho y la altura para que se muestre correctamente.
Agregar el código incrustable al sitio web que no es de Odoo: Abre el HTML de la página correspondiente (en el editor de código o CMS) e inserta el código incrustable donde quieras que aparezca el formulario.
Example
Ejemplo de un código incrustable:
<iframe src="https://example.com/odoo-form"
style="border:0;"
name="odooForm"
scrolling="no"
frameborder="0"
marginheight="0"
marginwidth="0"
height="400px"
width="600px"
allowfullscreen>
</iframe>
Incrustar código¶
Insertar código le permite integrar contenido de servicios externos en una página, como videos de YouTube, mapas de Google Maps, publicaciones de redes sociales como Instagram, etc.
Después de arrastrar y soltar el bloque Código incrustado desde la sección Contenido interno en una página, haz clic en el bloque, ve a la pestaña Estilo y haz clic en Editar. Reemplaza el código de ejemplo con tu código incrustado personalizado.
Advertencia
No copies ni pegues código que no entiendes, ya que podrías poner tu información en riesgo.
Mover, cambiar, duplicar o eliminar un bloque de creación¶
Tira de los bordes turquesa del bloque para reducir o aumentar el espacio en la parte superior o inferior.
Cambia el orden de los bloques al hacer clic en (flecha hacia arriba) o (flecha hacia abajo) y haz clic en (flechas) para mover el bloque en la página. Si tienes varias columnas, puedes moverlas a la izquierda o derecha si haces clic en (flecha hacia la izquierda) o (flecha hacia la derecha).
Para duplicar un bloque de creación, haz clic en (duplicar). Tras duplicarlo, el nuevo bloque aparecerá en la página abajo del bloque original.
Truco
También puedes hacer clic en el icono (duplicar) ubicado en la parte superior de la pestaña Estilo para duplicar el bloque seleccionado.
Haz clic en (papelera) para eliminar un bloque.
Editar un bloque de creación¶
Para editar el contenido de un bloque de creación, haz clic en él y ve a la pestaña Estilo. Las opciones de personalización varían según el tipo de bloque que selecciones.
Consulta
Fondo¶
Para modificar el fondo de un bloque de creación, selecciona el bloque, ve a la pestaña Estilo y haz clic en el punto de color u otra opción de fondo. Puedes cambiar el color o agregar una imagen, un video o una forma. Si eliges una forma aparecen nuevos campos para personalizarla.
Truco
Coloca un elemento (imagen, texto, etc.) atrás o adelante de otro con los iconos Enviar atrás o Traer al frente.
Para cambiar el tamaño de un bloque, haz clic y arrastra los puntos alrededor de sus bordes para ajustarlo según sea necesario.
Consulta
Diseño: Cuadrículas y columnas¶
En la mayoría de los bloques de creación puedes elegir entre dos estilos de diseño: cuadrícula o columnas (cols). Para cambiar el estilo de diseño predeterminado, haz clic en el bloque, ve a la pestaña Estilo y elige entre las opciones Cuadrícula o Cols en el campo Diseño.
Cuadrícula¶
El diseño de cuadrícula te permite reposicionar y cambiar el tamaño de los elementos, como imágenes o texto, al arrastrarlos y soltarlos. Al seleccionar Cuadrícula aparecen otras opciones para agregar elementos si haces clic en Imagen, Texto o Botón.
Columnas¶
Al elegir el diseño Cols defines la cantidad de elementos por línea dentro del bloque. Para hacerlo, selecciona el bloque que deseas modificar, haz clic en el menú desplegable junto al campo Cols y ajusta el número. Luego puedes modificar los ajustes de una columna específica con las opciones de la sección Columna de la pestaña Estilo.
Nota
De forma predeterminada, en los dispositivos móviles solo hay un elemento (columna) visible por línea para garantizar que el contenido siga siendo legible y accesible con facilidad en pantallas más pequeñas. Para ajustar el valor, haz clic en el icono (celular) que se encuentra en la parte superior del editor del sitio web y modifica el número de columnas. Las formas están ocultas de forma predeterminada para los celulares.
Guardar un bloque de creación personalizado¶
Puedes guardar un bloque de creación personalizado para reutilizarlo en otro lugar. Para ello, selecciónalo, ve a la pestaña Estilo y haz clic en el icono (disquete). Haz clic en el botón Guardar de la ventana emergente para almacenar este bloque.
Para agregar un bloque de creación que hayas guardado a la página, ve a la pestaña Bloques y arrastra y suelta el bloque personalizado de la sección Categorías. Esta acción abrirá una ventana emergente, allí haz clic en el bloque que quieres en la categoría Personalizado.
Truco
En la ventana emergente Inserta un bloque, haz clic en (editar) para cambiar el nombre del bloque personalizado o en (papelera) para eliminarlo.
Crear un enlace ancla¶
Los enlaces ancla son hipervínculos que dirigen a los usuarios a una sección específica de una página. Sigue estos pasos para crear uno:
Haz clic en Editar y selecciona el bloque que quieres vincular.
Haz clic en (enlace) en la parte superior de la pestaña Estilo.
Para editar el nombre de ancla predeterminado, haz clic en Editar en el mensaje emergente verde que aparecerá.
Reemplaza el nombre de ancla y haz clic en Guardar y copiar.
Una vez que hayas guardado el ancla podrás enlazarlo desde cualquier parte de tu sitio web.