Section outline
-
En la edición de un boletín distinguimos secciones y elementos. Ambos conceptos son idénticos, en ambos casos partimos de la siguiente imagen
La diferencia estriba en donde la colocamos. Si en el momento de arrastrar el elementos enccontramos que la línea azul va desde ambos extremos del boletín
En este caso insertamos una sección.
Si la línea no va desde ambos extremos, en ese caso estamos insertando un elemento dentro de una sección
En este punto describimos las opciones de los elementos que podemos agregar a un boletín. En el supuesto de que una opción se repita en varios elementos, la describiremos unicamente en la primera opción que tratemos.
Hemos seleccionado en un paso anterior la plantilla por defecto (Default template).
Esta plantilla constar de las siguientes secciones y elementos:
- Versión web
- Versión web
- Encabezado, con
- Imagen
- Banner, con
- Titular
- Imagen del producto
- Imagen, con
- 2 imágenes de producto
- Texto, con
- Titular
- Texto
- Botón
- Pie de página
- 5 textos
- Pie de página
Podemos cambiar el nombre de las secciones y elementos. Al hacer clic en ellos nos aparece en el márgen izquierdo las diferentes opciones, en primer lugar nos aparece el nombre. Si pasamos el cursor or encima de él visualizamos un icono con forma de lápiz, haciendo clic sobre el podremos modificar el nombre.
-
Imagen
Insertar una imagen
Si hacemos clic sobre una imagen, en la parte derecha nos aparecerá un menú con el texto "Reemplazar" y una reproducción de la imagen. También nos aparecerá en la parte inferior de la imagen una barra de iconos, uno de ellos se corresponde con el texto "Reemplazar imagen". Haciendo clic sobre cualquiera de estos elementos accedemos a la biblioteca de contenido de Sendinblue, desde el que podemos subir nuevas imágenes a la biblioteca y/o insertar las imágenes en el boletín.
Bordes
Tenemos dos opciones:
- Configurar los 4 bordes con las mismas opciones, o
- Configurar los 4 bordes de forma independiente
En ambas opciones tenemos a la altura de cada borde un botón para modificar el color.
Espaciado
Nos permite modificar el espaciado interior y exterior de la imagen
En la imagen ambos márgenes se corresponden con lo que podemos observar en la siguiente
Configuración de la imagen
Las opciones se corresponden con la siguiente imagen
Texto alternativo
Se trata del texto que aparecerá en lugar de la imagen cuando el usuario o la interfaz del proveedor de e-mails no permitan que se muestren.
Alineación del bloque
Si el ancho de la imagen es inferior al ancho del cuerpo del boletín, en este supuesto podemos insertar la imagen a la izquierda, a la derecha o en el centro del boletín.
Ancho
El ancho de la imagen lo podemos indicar en % sobre el ancho del boletín o en pitxels. Tenemos 2 límites máximos, el ancho de la imagen y el ancho del cuerpo del boletín. Al modificar el ancho de una imagen se activa la opción "Volver a empezar" (Esta opción se sitúa debajo del título de este apartado).
Esquinas redondeadas
Si indicamos un número de pitxels para los bordes, en este supuesto también podemos aumentar y disminuir la redondez de las esquinas. Si indicamos 0 anulamos la redondez.
Insertar imagen desde una URL
Además de insertar imágenes de la biblioteca de medios de sendinblue, también podemos subir imágenes de la red. En este último caso debemos indicar su URL.
Reemplazar
Nos permite sustituir la imagen
Barra de herramientas situada bajo la imagen
Los botones "Duplicar bloque", "Reemplazar imagen" y "Eliminar bloque", duplican la imagen, permiten sustituirla y la eliminan respectivamente. Su uso es intuitivo.
Mostrar u ocultar bloque
La imagen solo se mostrará si se cumplen las condiciones.
Guardar bloque
Guarda la imagen con su configuración para poder usarla con posterioridad en este u otro boletín. Para futuros usos lo encontramos en la pestaña "Mi contenido" de la barra vertical izquierda.
Agregar link
volver a ver volver a ver volver a ver
-
Editar imágenes
Accedemos a una ventana que se correspnde con la siguiente imagen. En la parte izquierda vemos un menú vertical con botones de cada una de las opcones: library, transform, filters, text y text design
En la imagen vemos también estas otras opciones: undo (de una serie de modificaciones volver a la anterior), redo (de una serie de modificacines volver a la siguiente), % de visualización (tamaño de visualización en la pantalla actual (no implica una modificación del tamaño de la imagen insertada, el porcentaje indicado se aplica a la visualización en la pantalla actual), save (guardar) y close (cerrar, en un paso posterior nos permite "cancelar" el cierre o "sair sin guardar").
Library
Sendinblue contiene un banco de imágenes. Podemos insertarlas o subir imágenes nuevas. En ambos casos las imágenes son guardadas en "Mis archivos" de la "Biblioteca de contenido"
A la pantalla de la segunda imagen accedemos desde "Reemplazar" la hacer clic sobre la imagen en el momento del diseño del boletín
Transform
Esta opción nos permite recortar una imágen, ya sea de manera libre (common), cuadrado (square), en una proporción concreta (4:3, 16:9, 3:4 o 9:16) o en los tamaños predefinidos de las diversas opciones de Facebook, Instagram o Twitter.
La opción "Keep Resolution" (mantener proporciones) solo se puede activar/desactivar para "Common". En el resto de las opciones está activado sin que sea posible desactivarla.
Otras opciones de Transform:
- Reset to default: abandonar cambios
- Crop size: nos permite modificar el ancho y alto. En todas las opciones la modificación del alto y ancho se realiza proporcionalmente, con excepción de "Custom" donde podemos activar/desactivar "Keep resolution".
- En la parte inferior tenemos opcines para girar la imágen y voltearla.
Filters
Nos permite aplicar diversos filtros a la imagen, además de aumentar y disminuir la intensidad del filtro
Text
Nos permite agregar texto a la imagen, duplicar el texto agegado y eliminarlo (respectiamente"Edit", "Duplicate" y "Delete" repectivamente de la barra de herramientas horizontal). También nos permite agregar un nuevo texto, modificar el tipo de fuente, la alineación del texto, el color de la fuente, el color del fondo y el interlineado desde la barra vertical (respectivamente "New text", "Font Family", "Font Size", "Aligment", "Font Color", "Backgrount Color" y "Line Spacing").
Al entrar en esta opción, por defecto nos propone insertar un texto. Si quisieras añadir nuevos textos haremos clic sobre "New text" de la barra la barra vertical.
En la parte inferior del recuadro que rodea el texto tenemos un círculo que nos permite girar el texto
Haciendo clic sobre el texto o sobre el espacio del rectángulo que lo contiene podemos modificar el tamaño haciendo clic sobre las esquinas de los bordes y arrastrando. También podemos mover la imagen haciendo clic sobre el mismo espacio y desplazando el cursor.
Text Design
Similar a la opción anterior. En ete caso podemos seleccionar textos con formato predefinido.
Además, en la barra horizontal tenemos la opción "Invert" que modificar la opción de color de texto a fondo y viceversa.
En la barra vertical también tenemos una opción nueva, Shuffle Layout modifica el formato del texto.
-
Editar texto
Una vez insertdo un texto, partiendo de la siguiente imagen, Sendinblue nos ha agregado un texto tipo (segunda imagen, la imagen se corresponde a un texto una vez hecho clic en el, es decir, aparece con las opciones para configurarlo) que debemos configurar.
Elementos comunes con los vistos para imágenes
De la barra de opciones vertical:
- Bordes
- Espaciado
- Ajustes de bloqueo. Las opciones aparecen en la configuración de imágenes dentro de "Configuración de imagen".
De la barra de opciones bajo el texto
Todas las opciones de texto están contenidas en lo visto para la misma barra en las imágenes. En las imágenes además tenemos un botón para agregar un hiperenlace y una imagen, similares opciones las encontramos para los textos en "Fondo" de la barra vertical en textos y en la bara horizontal situada sobre el texto.
Fondo
Las opciones son intuitivas.
Ajustes de texto
Las opciones son intuitivas
Menús horizontales situados por encima y por debajo del texto
Aqui también podemos considerar las distintas opciones como intuitivas.
No obstante haremos incapié en el botón "Add personalitation"
COMENTAR COMENTASR COMENTAR COMENTAR
-
Texto
Todo lo dicho en el punto anterior para "Título" es válido para este apartado. La única diferencia está en que por defecto "Título" el texto tiene formato de "Heading 1" y "Texto" tiene formato "Paragraph".
-
Botón
Reproducimos a continuación la barra de opciones vertical y los menús horizonatales inferior y superior. Podemos considerar todas las opciones como muy intuitivas.
Las opciones de "Espaciado" son idénticas a las vistas con anterioridad.
Si quisieramos modificar el texto del botón debemos hacer clic sobre el.
-
Social
Nos permite agregar accesos directos a nuestras redes sociales. Consideramos también que el proceso es muy intuitivo. Las opci8ones "Ajuste de bloqueo" y "Espaciado" ya fueron vistas en apartados anteriores.
-
Estilo 1, Estilo 2, Estilo 3, Columnas
En la primera columna tenemos una imagen de las distintas opciones:
- Estilo 1. Inserta una imagen, debajo un texto y un botón
- Estilo 2. Inserta dos columnas, en una de ellas una imagen, y en la otra columna un título y texto
- Estilo 3. Inserta tres columnas, y en cada una de ellas una imagen, un título y un texto
Todo lo dicho con anterioridad para las imágnes, títulos y textos vale para esta opción.
Columnas
Todas las secciones tienen columnas. Si hacemos clic en una sección veremos cuantas columnas tienen. Si varios elementos los queremos colocar en una misma linea horizontal debemos insertar previamente columnas. en la imagen del apartado anterior, el"Estilo 3" está formado por 3 columnas. En la parte izquierda de la siguiente imagen, que se corresponde con "Estilo 2", observamos 2 columnas, en la parte derecha la barra de opciones de los estilos 1, 2 y 3.
¿Cómo eliminar / agregar columnas?
Entre columnas encontramos una línea punteada vertical, y unos rectángulos verticales a la altura de la mitad de la línea. Estos rectángulos tienes dos signos, con el más se agrega una nueva columna, con el menos se elimina. Al eliminar una columna, su contenido pasa a la adyacente.
Solo podemos eliminar las columnas exteriores. Agregar una nueva columna también solo lo podemos hacer desde las columnas exteriores.
Los rectángulos de las líneas nos permiten modificar el ancho de las columnas entre las que se encuentra situado.
Otras opciones de columnas
Desde "Fondo" podemos agregar un color o una imagen. El color o la imagen pueden abarcar solo el ancho del cuerpo del boletín (ancho del cuerpo) o abarcar desde los márgenes izquierdo a derecho del boletín (ancho completo).
Ejemplo de relleno con un color, opción ancho completo
Ejemplo de relleno con el mismo color anterior, opción ancho del cuerpo
Cuando insertamos una imagen, a las opciones de "Fondo" se le agregan las de la siguiente imagen
Estas opciones son relevantes cuando el tamaño de la imagen es mayor o menor del asignado para la imagen.
En relación con las opciones de "Ajuste de bloqueo"
Nos permite modificar la separación entre columnas, y si tuvieramos una sola columna se modificarían los márgenes izquierdo y derecho. Si tuvieramos varias columnas "Alineación vertical" nos alinearía vertricalmente el contenido de cada una de las columnas en relación con el resto.
Encabezado
Tal como lo podemos observar en la imagen superior, al insertar un encabezado en realidad estamos insertando una columna con una imagen en el centro. Todas las opciones se han visto en apartados anteriores. La particularidad de esta opción consiste en que el tamaño por defecto de la imagen y de la columna van a ser diferentes a las de otras opciones, estan pensadas para que se correspondan con las que en la mayoría de los casos precisamos para un encabezado con logo.
Pie de página
Esta opción nos presenta una sección con diferentes elementos de texto que contienen la información que habitualmente se coloca en el pie.
Divisor
Inserta una linea. Las opciones de configuración se vieron en otros puntos. Aqui tenemos una opción con el nombre de Estilo
Navegación
Con esta opción insertamos enlaces con una presentación más explícita
- Versión web