Nota: Sólo necesita esta información si desea programar su propia plantilla o realizar cambios muy grandes en las plantillas existentes en el código fuente. Esta técnica de plantilla se refiere al Editor clásico. Técnicamente, el editor clásico ya no es compatible. Le recomendamos que cree su mailing en nuestro Editor de boletines en el futuro. Este editor está en desarrollo permanente y le ofrece muchas funciones fáciles de usar. Aquí encontrará la plantilla técnica para el editor del boletín de noticias. |
Con nuestra tecnología de plantillas puede convertir cualquier boletín electrónico (HTML) en una plantilla que puede utilizarse en un editor clásico. Para ello, debe insertar etiquetas de plantilla especiales en el código fuente de su archivo HTML. Casi todas las etiquetas constan de dos partes: una de apertura y otra de cierre. Entre esas partes puede introducir texto estándar que se rellenará previamente durante el uso de la plantilla y que puede editarse en consecuencia. Para la versión en línea de las etiquetas , darse de baja y acerca de nosotros, CleverReach inserta automáticamente su propio texto estándar. Cualquier texto existente dentro de estas etiquetas será completamente ignorado.
Versión en línea: | <!--#versión_online #--><!--#/versión_online#--> |
Nuevos elementos: | <!--#loop #--><!--#/loop#--> |
Enlace para darse de baja: | <!--#unsubscribe #--><!--#/unsubscribe#--> |
Aviso legal: | <!--#aboutus #--><!--#/aboutus#--> |
Imagen: | <!--#image #--><!--#/image#--> |
Enlace: | <!--#link #--><!--#/link#--> |
Área HTML: | <!--#html #--><!--#/html#--> |
Línea de texto: | <!--#text_line #--><!--#/text_line#--> |
Área de texto: | <!--#text #--><!--#/text#--> |
Índice: | <!--#summary #--><!--#/summary#--> |
Separador de elementos: | <!--#loopsplit#--> |
Elemento de plantilla: | <!--#my_element name="Nombre" #--><!--#/my_element#--> |
Configuración de estilos: | data-cr-edit="Nombre de la empresa" |
Estilos para elementos personalizados: | class="editable" |
Versión en línea
Con el enlace a la versión en línea permite a los destinatarios consultar el correo electrónico en su navegador.
Ejemplo con texto por defecto:
<!--#online_version #-->
Si este boletín no se visualiza correctamente, haga clic en <a href="{ONLINE_VERSION}">aquí (en línea)</a>.<!--#/online_version#-->
Nota importante: Si define contenido personalizado en esta etiqueta, se sobrescribirá con el texto estándar de CleverReach. En este escenario debe definir un área HTML.
Elementos
Los marcadores colocados dentro de su código fuente (etiqueta loop) le permiten añadir un nuevo elemento a su correo electrónico. Puede utilizar la función Drag & Drop para colocar un elemento en el área que haya definido con la etiqueta de bucle.
Ejemplo con texto por defecto:
<>
<h2><!--#text_line #-->Beispiel Titel<!--#/text_line#--></h2><!--#html #-->
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<!--#/html#-->
<!--#/loop#-->
Se pueden añadir nuevos elementos en cualquier formato. CleverReach ofrece algunos elementos predefinidos en su editor, pero también puede utilizar elementos personalizados para sus correos electrónicos.
Cancelar suscripción
Con la etiqueta de baja se añade un área que incluye un enlace que permite al destinatario darse de baja de sus correos electrónicos.
Ejemplo con texto por defecto:
<!--#unsubscribe #-->
<a href="{UNSUBSCRIBE}" >Abmelden</a><!--#/unsubscribe#-->
Nota importante: Si define contenido personalizado dentro de esta etiqueta, éste será sobrescrito por el texto estándar de CleverReach. En este escenario debe definir un área HTML. definieren.
Menciones legales
Esta etiqueta le permite añadir un aviso legal a sus correos electrónicos.
<>
<>
Nota importante: Si define contenido personalizado dentro de esta etiqueta, éste será sobrescrito por el texto estándar de CleverReach. En este escenario debe definir un área HTML.
Imagen
Utilice la etiqueta de imagen para insertar una imagen. La imagen puede editarse y enlazarse.
Ejemplo con imagen por defecto:
<center>
<!--#image #-->
<!--#/image#-->
</center>
Nota importante: Si desea centrar la imagen en el editor clásico, debe enmarcarla con una etiqueta de centrado. De lo contrario, sólo podrá elegir entre la alineación izquierda y derecha.
Enlace
Utilice la etiqueta de enlace para insertar un enlace editable.
Ejemplo con enlace por defecto:
<>
<a href="http://www.ihredomain.de">Enlace</a><>
Nota importante: Este elemento puede utilizarse exclusivamente para enlaces de texto. Si desea enlazar una imagen, debe utilizar el elemento image.
Área HTML
Utilice la etiqueta HTML para colocar un área HTML editable dentro del editor.
Ejemplo con texto por defecto:
<!--#html #-->
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<!--#/html#-->
Nota importante: Para habilitar la alineación de texto dentro del área HTML (izquierda/derecha/centro/bloque) necesita incluir un elemento de bloque dentro de su HTML - ya sea una etiqueta P o DIV.
Línea de texto
Utilice la etiqueta de texto para insertar una línea de texto que pueda editarse (por ejemplo, para titulares). Esta etiqueta permite los hipervínculos.
Ejemplo con texto por defecto:
<>
Soy una línea de texto que se puede editar.<>
Área de texto
Esta etiqueta se puede utilizar para insertar una línea editable de texto corto No se puede formatear el texto dentro y no hay función hyplerlink.
Ejemplo con texto por defecto:
<!--#text #-->
Soy un área de texto que se puede editar.<!--#/text#-->
Índice
Este elemento crea automáticamente un índice con enlaces internos a los elementos individuales del artículo que se han añadido a través del editor clásico. Casi todos los elementos nuevos aparecerán como elementos independientes en el índice. Los elementos personalizados se muestran en el índice por defecto. Haciendo clic en el índice puede ocultar artículos individuales haciendo clic en en el símbolo del ojo. Sugerencia: Este elemento ya está disponible como elemento estándar.
Ejemplo:
<div class="summary">
<!--#summary #-->
<ul>
</ul>
<!--#/summary#-->
</div>
Separador de elementos
Puede colocar tantos elementos editables como desee dentro de un bucle, independientemente de si son elementos HTML, imágenes, enlaces o líneas de texto. Si desea mover o eliminar estos elementos, debe separarlos con la etiqueta loopsplit.
Ejemplo:
<!--#html #-->Texto de muestra 1<!--#/html#-->
<!--#loopsplit#-->
<!--#html #-->Texto de muestra 2<!--#/html#--><!--#/loop#-->
Elemento de plantilla
La creación de mensajes de correo electrónico con el editor Classic no se limita a los elementos estándar de CleverReach. Dentro de sus plantillas puede declarar elementos específicos e insertarlos en el editor. Para ello, basta con marcar la zona en cuestión como un elemento independiente.
Ejemplo:
<!--#my_element name="Nombre Ihres Elements" #-->
<h2><!--#text_line #-->Titel<!--#/text_line#--></h2> <!--#html #-->Soy tu propio elemento:-)
<!--#/html#-->
<!--#/my_element#-->
<!--#loopsplit#-->…
<!--#/loop#-->
Nota importante: cada elemento debe tener un nombre individual, ya que de lo contrario no aparecerá en la vista general. Estos elementos pueden utilizarse si se ha seleccionado la plantilla correspondiente para el correo electrónico en el que está trabajando. Así que los elementos están relacionados con una plantilla. Asegúrese de definir el elemento de plantilla dentro de un bucle. Como alternativa puede ir a [Emails] > [Elementos] en su cuenta e insertar elementos personalizados independientes que están disponibles en cada plantilla (recomendado).
Configuración de estilos
En la barra lateral derecha, dentro del editor, puede editar sus áreas dentro de la plantilla en función de las que usted mismo haya definido. A través de [Diseño] puede editar el área en cuestión. También puede configurar los estilos de determinadas áreas dentro de su propia plantilla utilizando la barra de herramientas. Para activarlo, sus elementos HTML (por ejemplo, tablas) pueden incluir la etiqueta cr_edit="Nombre del área". A continuación, verá el nombre en la barra de herramientas.
Ejemplo:
<tr>
<td></td>
</tr>
</table>
Estilos para elementos personalizados
Siempre que desee que los estilos de sus elementos personalizados sean editables, deberá añadir class="editable". Pase el ratón por encima de estos elementos y haga clic en el símbolo de edición que aparece para modificar los estilos.
Ejemplo:
<tr>
<td></td>
</tr>
</table>
Notas importantes:
- Las etiquetas de apertura y cierre del bucle deben colocarse dentro de una etiqueta HTML conjunta (TD, DIV) con un ancho limitado. Una anchura del 100% causará problemas cuando se editen los elementos.
- No se pueden anidar etiquetas de bucle (). No se puede insertar un segundo bucle en una etiqueta de bucle.
- Si utilizas elementos personalizados debes crearlos siempre en base a tablas HTML o capa DIV.
- Si su plantilla no aparece en su cuenta, es porque no contiene etiquetas de Asistente o son incorrectas (más información aquí).
- Cuando utilices tus propias plantillas, te recomendamos que leas nuestros consejos y trucos para plantillas HTML
- CleverReach no ofrece soporte para plantillas y elementos personalizados.