Cómo agregar un cuadro de Inscripción Boletín Después de Su Publicar en el marco de Génesis

Es muy fácil añadir una caja de registro boletín después de su mensaje en los niños temas de Genesis. Impulsar número de suscriptores de correo electrónico mediante la adición de caja de la inscripción de noticias.

A+ A-

Cuántos suscriptores de correo electrónico tiene su blog? ¿Quieres aumentar el número de suscriptores de correo electrónico? Entonces por qué no añadir caja de la inscripción de noticias después de su entrada? Después de la publicación de Génesis modificaciones temáticos artículo, muchos usuarios temáticos Génesis nos pidieron escribir tutorial sobre la adición de la caja de registro boletín. Así que aquí en este artículo vamos a compartir un camino por el cual se puede añadir una caja de la inscripción de noticias después de que su mensaje en sitios web de Génesis alimentados.

Brian Gardner ya ha publicado artículo sobre un mismo tema, su método se basa en defecto 'Génesis eNews y actualizaciones' widget. Sin embargo, aunque la aplicación de caja de la inscripción de noticias usando esa guía, que nos hemos enfrentado algunas dificultades. Método dado por Brian funciona, pero problema principal es que no se puede añadir caja de la inscripción de noticias en ambos lugares - en el área de widget y por debajo de post porque misma CSS aplicado tanto a la zona por lo caja de la inscripción en el área de widget se verá raro. Muchos usuarios quieren añadir cuadro boletín de inscripción en ambos lugares, así que aquí vamos a mostrar mejor método para conseguirlo, se añade por defecto 'Genesis eNews y actualizaciones' widget en el área de widgets de la barra lateral primaria y método de uso que se proporcionan aquí para añadir cuadro de suscripciones a boletines informativos por debajo de su puesto . Aunque nuestro método es diferente, todavía se basa en el método de Brian tan créditos va a él.

Newsletter Signup Box Preview

La adición de esta caja de la inscripción en los niños temas de Genesis es relativamente simple. Sólo tienes que seguir los sencillos pasos que se indican a continuación y añadir caja de la inscripción de aspecto profesional, como se muestra en la imagen después de que sus mensajes.

Paso 1

En panel de WordPress -> Apariencia -> Editor -> Mira en la columna derecha de archivo function.php, abrir ese archivo y añadir siguiente código al final de la misma.

A) Fragmento de código para los usuarios de FeedBurner:

/** Add a Newsletter Signup Box After Posts */
function add_newsletter_box() {
if(is_single()) {
?>

<div id="newsletterbox">
<div class="white-border">
<div class="newsletterbox-wrap">
<h4>Join Our Newsletter</h4>
<p>Join over 5,000 people who get free and fresh content delivered automatically each time we publish.</p>
<form id="subscribe" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=Google/FeedburnerID', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow" method="post" action="http://feedburner.google.com/fb/a/mailverify">
<input id="subbox" type="email" name="email" onblur="if ( this.value == '' ) { this.value = 'Enter your email address...' } " onfocus=" if ( this.value == 'Enter your email address...') { this.value = '' }" value="Enter your email address..." />
<input type="hidden" value="Google/FeedburnerID" name="uri">
<input type="hidden" value="en_US" name="loc">
<input id="subbutton" type="submit" value="Sign Up">
</form>
</div>
</div>
</div> <?php
}
}
add_action ( 'genesis_after_post_content', 'add_newsletter_box', 10, 1);

Nota: No se olvide de cambiar el texto "Google / FeedburnerID" por su real Google / ID de Feedburner en dos lugares.

B) Fragmento de código para los usuarios de MailChimp:

/** Add a Newsletter Signup Box After Posts */
function add_newsletter_box() {
if(is_single()) {
?>
<div id="newsletterbox">
<div class="white-border">
<div class="newsletterbox-wrap">
<h4>Join Our Newsletter</h4>
<p>Join over 5,000 people who get free and fresh content delivered automatically each time we publish.</p>
<form target="_blank" class="validate" name="mc-embedded-subscribe-form" id="mc-embedded-subscribe-form" method="post" action="http://techlila.us5.list-manage.com/subscribe/post?u=eefa99bc3d40d94a1820fed4b&id=b28d5bf727">
<input type="email" required="" placeholder="Enter your email address ..." id="mce-EMAIL" class="email" name="EMAIL" value="">
<input type="submit" class="button" id="mc-embedded-subscribe" name="subscribe" value="Sign Up">
</form>
</div>
</div>
</div>
<?php
}
}
add_action ( 'genesis_after_post_content', 'add_newsletter_box', 10, 1);

Nota: No se olvide de cambiar "URL de acción de forma" por la URL de su acción de forma MailChimp. Encontrará su URL de acción en forma de MailChimp -> Listas -> Para su pestaña Sitio Web y elija primera opción del menú desplegable - Formulario de registro Código de inserción y buscar la URL de su acción de formulario (<form action = "SU ACCIÓN MailChimp URL").

Si está utilizando AWeber o cualquier otro servicio, entonces simplemente cambiar el código entre <form> </ form> en consecuencia.

Paso 2

Descargar las Boletín caja de gráficos y extraerlos en "images / /" carpeta de su hijo Génesis tema. Este impresionantes gráficos creados por Brian, que acaba de añadir una "enews-cinta-blue.png" imagen y cambiaron archivo enews.png.

Paso 3

En panel de WordPress -> Apariencia -> Editor -> style.css. Añadir siguiente código y actualizar el archivo.

/* Newsletter Box below Posts
------------------------------------------------------------- */
#newsletterbox {
background-color: #f5f5f5;
border: 10px solid #e4e4e4;
margin-top: 30px;
}
#newsletterbox .white-border {
border: 1px solid #fff;
}
.newsletterbox-wrap {
background: url(/p;quot;images/enews-ribbon.png&quot;) no-repeat scroll left top transparent;
margin: -17px -18px;
overflow: hidden;
padding: 45px 30px 40px;
text-align: center;
text-shadow: 1px 1px #fff;
}

.newsletterbox-wrap h4 {
text-align: center;
}

.newsletterbox-wrap p {
margin: 0 35px 20px;
text-align: center;
}
.newsletterbox-wrap input[type=&quot;email&quot;] {
background: url(/p;quot;images/enews.png&quot;) no-repeat scroll left center #fff;
box-shadow: 0 0 5px #ccc inset;
color: #999;
font-family: 'proxima-nova',sans-serif;
font-size: 12px;
margin: 0 5px;
padding: 15px 0 15px 45px;
width: 40%;
}

.newsletterbox-wrap input[type=&quot;submit&quot;] {
box-shadow: 0 1px 1px #a24a1d;
font-size: 14px;
font-weight: bold;
padding: 10px 15px;
text-transform: uppercase;
}

Este CSS funcionará para los usuarios de MailChimp FeedBurner y, si está usando cualquier otro servicio a continuación, cambiar el código en consecuencia, porque es difícil para nosotros para proporcionar el código para cada servicio, ya que hay una gran variedad de servicios que se pueden utilizar. No se olvide de cambiar el nombre de la imagen de "enews-ribbon.png" si desea utilizar otra imagen en color, por ejemplo enews-cinta-blue.png.

Si estás frente a cualquier dificultad, mientras que la adición de una caja de la inscripción de noticias a continuación, háganoslo saber en forma de comentarios.

Ads

Compartir