homefinance blog
Por defecto, los correos electrónicos de WordPress son bastante feos. Sin logotipo, encabezado o sótano o cualquier estilo. ¿No sería bueno agregar su propia marca? Haga que parezca un correo electrónico que alguien realmente quiere leer para parecer el desayuno de mensajes de texto de un perro. No solo esto, sino que desea facilitarlos para todos los que leen los correos electrónicos móviles, ¡no tienen que casarse y desplazarse tanto horizontal como verticalmente para leer!
Woo hoo! Hermosos correos electrónicos de notificación de WordPress! Bien tu puedes. Lanzamos un nuevo complemento gratuito que hace exactamente esto: plantillas de correo electrónico HTML. Cuando WordPress envía un correo electrónico, nuestro complemento lo intercepta y coloca una plantilla que especifique en torno al mensaje.
No te emociones demasiado. No hemos incluido un generador de plantillas de correo electrónico personalizado, pero hay absolutamente un grupo de recursos gratuitos en Internet desde donde puede elegir plantillas de correo electrónico perfectas si busca algo más sofisticado de lo que podría producir usted mismo. Sin embargo, tenga en cuenta que simplemente puede introducir HTML por su cuenta. El tutorial a continuación es para aquellos que desean lidiar con plantillas prefabricadas. Antes de comenzar, ¡me alegra anunciar que el complemento también es compatible con multisits! Sin embargo, en lugar de configurar la plantilla en el WP-Admin, configela en WP-Admin/Network/. Pero llegaré a esto más tarde.
Paso 1
¡Necesitamos encontrar una plantilla para usar! Rápidamente busqué en las plantillas de etiquetas blancas que eran compatibles con los dispositivos móviles y me encontré con las plantillas de correo electrónico receptivas. Obviamente, si ya tiene una plantilla de correo electrónico HTML para su marca, ¡úsela! Sin embargo, pasaré por su uso. Continúe y descargue la plantilla base. Cambiaremos esto y, finalmente, lo usaremos como una plantilla de correo electrónico receptiva. Paso 2 Una vez que lo ha descargado, necesitamos cambiar algunas cosas en la plantilla para que coincida con nuestra marca. Son: escupir el contenido de correo electrónico en el área de mensajes
Cambiar la imagen del logotipo
Cambie la palabra “básico” a la parte superior derecha en un enlace a nuestro blog
Actualizar la información en el sótano; Facebook, Twitter, Google+, correo electrónico y teléfono
El reemplazo del contenido textual hay varios elementos de texto en la plantilla que actualmente son lorem ipsum, ¡no queremos nada de todo esto!
Para comenzar, en la línea 47, reemplace “Hola, Elijah Baily” (envuelto en un elemento H3), con “¡Hola!” Desafortunadamente, debido a que el complemento simplemente filtra la función wp_mail (), no tenemos mucha información disponible para nosotros. ¿Cuál sería la estrella si tuviéramos el sujeto, el perfil del receptor, etc. ¡Pero no lo tenemos! Así que tendremos que mantenerlo bastante vainilla por el momento. Después de eso, querrá cambiar el próximo párrafo, clasificado “liderar” en “su sitio de WordPress necesita su atención. ¡Lea a continuación y continúe con ello! ” Una hermosa directiva para que su lector observa el correo electrónico y se toman medidas.
Finalmente, reemplace el siguiente párrafo (una gran pieza de Lorum ipsum) con “mensaje”. ¡Incluyendo la etiqueta
! El complemento filtra la plantilla de la cadena del mensaje y la reemplaza con el mensaje enviado por WordPR. Lo eliminaré, pero si puedes pensar en una razón para usarlo, ¡por todos los medios! Aquí sería útil tener más información sobre el correo electrónico enviado. El encabezado también debe reemplazar el logotipo y el texto “básico” en la parte superior. Hice un logotipo de 200 × 50 para él, ¡pero no dude en reemplazarlo con el tuyo!
Una vez que haya creado su propio logotipo y lo haya cargado en su servidor o en un servicio compartido, como Imgur, necesita el enlace directo: este es el enlace que termina en nombre del archivo. Mi logotipo es http://i.imgur.com/xb27xye.png. En la línea 25, reemplace IMG SRC con la URL de su registro en la siguiente línea, donde un H6 es visible, simplemente cambie “básico” con el nombre de su blog.
Enlaces de contacto Lo último que debe cambiar es la información de contacto en la parte inferior. Te dejaré esto. Las filas de edición son 62 (donde ingresó los detalles de la red social) y 75/76 para correo electrónico y número.
¡Y finalmente su plantilla de correo electrónico está completa! Sin embargo, es una última cosa que hacer antes de poder usarlo. Las plantillas de correo electrónico (para compatibilidad entre clientes) deben tener todos los estilos en línea. Nunca espere que un cliente de correo electrónico sea lo suficientemente inteligente como para extraer un recurso externo (es decir, CSS). Las imágenes están bien, pero muchos clientes no juegan bien con los lazos CSS externos o el . Los clientes de correo electrónico son más o menos horribles en la forma en que formatan y juegan HTML. Solo mire cuán irregular e inconsistente es esta comparación entre los principales clientes que deberíamos considerar en nuestro trabajo.
Sin embargo, hay dos reglas generales al construir correos electrónicos HTML.
Siempre use tablas para modelos
Siempre tienes CSS en línea
Sí, sé que se asemeja a la web alrededor de 1995, pero los motores de rango de correo electrónico son tan afectados y extrañados que es la única forma de crear un aspecto sólido. Afortunadamente, con la aparición del Zurb que usamos, hicieron la parte difícil. Usando tablas, eso es. ¡Todo lo que tenemos que hacer es convertir el correo electrónico.css en estilos en línea! Me gustaría reservar unas cinco horas para hacer esto, la copia manual de cada estilo en cada mesa, el elemento Strong, A, EM y P llevará algún tiempo.
¡Estaba bromeando! Afortunadamente, hay un servicio en línea que convertirá su estilo en línea. De hecho, hay algunas, pero después de hacer algunas pruebas, encontré el mejor servicio de las aplicaciones de Torchbox. ¡Descubrí, junto con otros, que algunos de mis estilos fueron completamente ignorados! (Nota al editor: este sitio parece haber sido abolido. Intente usar la herramienta CSS Inliner de MailChimp.) Mueva CSS a la plantilla Abra el correo electrónico.css que descargó cuando descargó el Zurb. Copie todo al portapapeles. En la parte superior de Basic.html donde ve Reemplácelo con algunas etiquetas de estilo, junto con todo el documento CSS en quien lo acaba de copiar.
Hasta ahora deberías tener un documento bastante voluminoso. Está a punto de empeorar, pero desafortunadamente, el correo electrónico HTML va.
Visite inlinestyler e inserte todo el archivo básico.html en el cuadro. Deben tener todos los cambios que realizamos antes, así como un documento CSS completo.
¡Listo! Estilos en línea! ¡Tómese un momento para deleitarlo con lo que el código parecía hace 15 años!
!, sans-serif; line-heigt: 1.1; margen-bottom: 15px; color: #000; font-peso: 900; tamaño de fuente: 17px “> Información de contacto:
Ahora, una advertencia a este proceso es que las declaraciones familiares son escapadas por las comillas (como puede ver en el fragmento anterior). Coloque todo el código recién convertido en Basic.html y haga una búsqueda y reemplace “. Con “Su plantilla de correo electrónico ahora está lista para WordPress! Paso 4, lo último que debe hacer es pegar todo el elemento básico.html en el cuadro de arado. Puede encontrar la página de arado en la configuración> plantilla de correo electrónico HTML.
Si desea probarlo, presione “Vista previa”, y el complemento le enviará un correo electrónico de prueba para ver cómo se ve.
Culo. Asi que aqui esta. ¡Hermosas notificaciones por correo electrónico de WordPress! Ha sido mucha ira mía, ¡así que me complace que finalmente puedan tener hermosos correos electrónicos en todas partes! Consíguelo aquí con el nuevo complemento. ¿Cuáles son tus pensamientos? ¿Utiliza una solución existente que no conozco? ¡Avísame a continuación! Etiquetas:
Email
