Tutorial: Hermoso Formulario para conseguir miles de suscriptores en Feedburner

davidtorresruiz

Delta
Programador
Verificación en dos pasos desactivada
Desde
5 Ene 2014
Mensajes
554
Hola mis amigos de ForoBeta!

:drunk: Aca les dejare un hermoso formulario hermoso para que se suscriban miles de usuarios en su Web o Foro mediante Feedburner, dure varias horas desarrollandolo para publicarlo en mi Blog y en Forobeta, espero que les guste mucho, lo hice con mucho amor a la programación.

Tutorial%u00252BBlogger%u00252BAtractivo%u00252Bformulario%u00252Bde%u00252Bsuscripcion%u00252BF.png

Es espectacular para conseguir miles de suscriptores ya que está programado con style y script, al colocar tu correo electrónico correctamente el formulario detectara que está bien escrito con el @ y se colocara el borde del campo color verde, si no detecta el @ se colocara el botón en celeste y el borde del campo del E-Mail en Rojo, si el campo del E-Mail se encuentra vacío y le das clic en el botón suscribirse aparecerá un aviso que le dirá al usuario: (rellene este campo), si escribes el E-Mail sin el @ dirá: (introduzca una dirección de correo).

Su presentación o titulo es muy llamativo para animar al usuario a suscribirse ya que dice lo siguiente: ¡Suscríbete al Blog! ¿Quieres recibir los artículos directamente en tu email? Suscríbete aquí.

Cuando coloques tu E-Mail correctamente y le des clic a Suscríbete saldrá una ventana pop de 550 ancho por 520 de largo donde colocaras el código o letras del captcha para prevenir el spam.

Comencemos:

Nos vamos a la pestaña que esta a mano izquierda a PLANTILLA = > EDITAR HTML, luego le damos a la tecla Ctrl + F y luego pegamos </style> antes de </style> pegamos el siguiente código style, que es el que le dará el color a lo que hablamos anteriormente:



PHP:
<!--  Style Suscríbete al Blog HablaChento.BlogSpot.Com!  -->

    #subscribe-floater.open{right:50px}
    #subscribe-floater input{border:1px solid #47C8C3;height:26px;float:left;-webkit-border-radius:0;-moz-border-radius:0;-webkit-appearance:none;border-radius:0}
    #subscribe-floater input[type=&quot;email&quot;]{width:189px;height:32px;border-top:1px solid #e6e6e6;border-left:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;background:#fff!important;padding:1px 5px;color:#999}
    #subscribe-floater input[type=&quot;submit&quot;]{height:36px;background:#47C8C3;color:#fff;font-size:15px;padding:0 20px}
    #subscribe-floater input[type=&quot;submit&quot;]:invalid{border-color:#ED5260;background:#ED5260}
    #subscribe-floater input[type=&quot;email&quot;]:required:focus:valid{border-color:#4aa342}
    #subscribe-floater input[type=&quot;email&quot;]:required:focus:valid + input[type=&quot;submit&quot;]{border-color:#4aa342;background:#4aa342}#subscribe-floater .x{position:absolute;right:13px;top:9px;font-size:14px;color:#222}
    #subscribe-floater h1{font-size:32px;color:#333;margin:0}

     <!-- FIN  Style Suscríbete al Blog HablaChento.BlogSpot.Com!  -->
:encouragement: Una vez echo ese paso nos vamos a la pestaña que está a mano izquierda => Diseño para agregar por fin el formulario de suscripción FeedBurner, le damos clic a Añadir Gadget y luego buscamos HTML/Javascript Añadir le das clic y pegas el siguiente código:

Imagen Nº 4 Atractivo formulario de suscripción FeedBurner

PHP:
 <!-- Suscripcion FeedBurner de HablaChento -->

<div id="subscribe-floater">   
    <h1>¡Suscríbete al Blog! <i></i></h1>    <p>
 ¿Quieres recibir los artículos directamente<br /> en tu email? Suscríbete aquí.</p>

<div class="follow-by-email-inner">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" onsubmit='window.open("https://feedburner.google.com/fb/a/mailverify?uri=BienvenidosAHablachento", "popupwindow", "scrollbars=yes,width=550,height=520"); return true' target="popupwindow" method="post" onsubmit="if ((/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/).test(this.email.value))subscribe(this.email.value);this.email.value='';return !1">
<input class="follow-by-email-address" type="email" required="required" pattern="^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$" name="email" placeholder="Ingresa tu Email" />
<input class="follow-by-email-submit" value="Suscríbete" type="submit"  />
<input name="uri" value="BienvenidosAHablachento" type="hidden" />
<input name="loc" value="es_ES" type="hidden" />
    </form>
</div></div>

  <!-- FIN suscripcion FeedBurner de HablaChento -->
SPAM | REFERIDOS

Gracias a los compañeros que les gusto mi tutorial, cualquier duda, sugerencia me la hacen llegar al privado o por este medio, más imagenes o información en la fuente del tutorial. :encouragement:
 
Última edición por un moderador:

luismaster2009

Xi
Diseñador
Verificación en dos pasos desactivada
Verificado por Whatsapp
Desde
7 Feb 2014
Mensajes
4.043
Increible me lo llevo!
 

ramseeey

Baneado
Curioso
Verificación en dos pasos desactivada
Desde
10 May 2015
Mensajes
10
Gracias por compartirlo con nosotros, está de lujo:welcoming:
 

leit0s

Gamma
Redactor
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios!
Desde
24 Dic 2012
Mensajes
459
Tiene buena pinta, solo has olvidado actualizar el del lado derecho de tu web.
 

JimmyBalarezo

Dseda
Verificación en dos pasos desactivada
Verificado por Whatsapp
Desde
22 Mar 2014
Mensajes
1.219
Esta muy bueno bro! Gracias por compartir :eek:
 

GalaxiaUrbe

Delta
Social Media
Verificación en dos pasos desactivada
Desde
26 Dic 2014
Mensajes
569
Verga mijo vos como que sois paisano mio, que molleja de bueno esta el blog tuyo. :encouragement:
 

SneyderCante

Delta
Social Media
Verificación en dos pasos desactivada
Desde
15 Nov 2013
Mensajes
584
Muchas gracias me sirve :encouragement:
 

Poka

VIP
Zeta
Social Media
Verificación en dos pasos activada
Desde
24 Sep 2012
Mensajes
1.634
Se agradece:encouragement:
 

Doroteo78

Iota
Verificación en dos pasos desactivada
Desde
30 Jun 2014
Mensajes
2.249
Me agrada la parte de evitar spam, voy a darle una checada y muchas gracias por compartir, a muchos nos sera util
 

davidtorresruiz

Delta
Programador
Verificación en dos pasos desactivada
Desde
5 Ene 2014
Mensajes
554
No entiendo por que mis tutoriales el moderador le quita mi URL que es la fuente de donde provienen los tutoriales ?? SPAM | REFERIDOS, Última Edición por cicklow; Ayer a las 15:40
 

jannuz

Delta
Redactor
Verificación en dos pasos desactivada
Desde
14 Nov 2010
Mensajes
688
Al parecer colocaste algún enlace de referido en tu tutorial, otro problema es que los tutoriales deben tratar de ser originales y en este caso al parecer es un copy paste de algún articulo de tu blog lo cual se puede confundir que estas haciendo spam para que visiten tu blog o ganar un enlace.
 

kj2

Iota
Verificación en dos pasos activada
Desde
1 Abr 2011
Mensajes
2.158
No entiendo por que mis tutoriales el moderador le quita mi URL que es la fuente de donde provienen los tutoriales ?? SPAM | REFERIDOS, Última Edición por cicklow; Ayer a las 15:40
¿Preguntas porqué te tienen fichado luego de que pusiste código malicioso en un tutorial?

Además que es obvio que lo haces como spam y no por aportar :/.

kj
 

Korvic

VIP
Delta
Programador
Verificación en dos pasos desactivada
Desde
1 Ago 2014
Mensajes
637
Gracias man de seguro le sacare provecho

- - - Actualizado - - -

¿Preguntas porqué te tienen fichado luego de que pusiste código malicioso en un tutorial?

Además que es obvio que lo haces como spam y no por aportar :/.

kj
El codigo es malicioso?? el de este tutorial? o_O
 

IGNACIO

VIP
Mi
SEO
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
7 Dic 2011
Mensajes
3.221
A revisar, gracias :)
 

zetanight

Baneado
Gamma
Redactor
Verificación en dos pasos desactivada
Desde
4 Ene 2015
Mensajes
409
¿Que hay que modificar para que la suscripcion sea a nuestro blog y no la de el?
 

mikealme

Zeta
Redactor
Verificación en dos pasos desactivada
Desde
22 Oct 2012
Mensajes
1.605
dentro del codigo aparece la url de tu blog, eso se puede cambiar?
 

Arriba