Agregar un POPUP con formulario de suscripción y fanbox en Blogger

  • Autor Autor mativelez
  • Fecha de inicio Fecha de inicio
mativelez

mativelez

Delta
Verificación en dos pasos activada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola amigos! A ver si alguien me puede ayudar. Necesito el codigo para poder poner un POPUP en blogger.
La idea es meter en el popup un formulario de suscripcion ( el codigo lo saco de mailrelay) y ademas si se puede abajo del formulario, mandar una mini fanbox de facebook y un boton seguir de twitter.

Espero alguien me pueda dar una mano. Muchas gracias de antemano!
 
Última edición:
Qué buscas, que al hacer click en un boton se abra un popup o que se abra al ingresar al sitio?
 
Que se abra al ingresar al sitio y que solo se muestre una vez por ip hasta dentro de X cantidad de dias. Me puedes ayudar ?

- - - Actualizado - - -

maximusk10 dijo:
Qué buscas, que al hacer click en un boton se abra un popup o que se abra al ingresar al sitio???
Hacer clic para expandir...


Que se abra al ingresar al sitio y que solo se muestre una vez por ip hasta dentro de X cantidad de dias. Me puedes ayudar ?
 
Insertar CODE, HTML o PHP: 
#popup {
   visibility: hidden;
display:none;
   opacity: 0;
   margin-top: -300px;
}
#popup:target {
   visibility:visible;
display:block;
   opacity: 1;
   background-color: rgba(0,0,0,0.8);
   position: fixed;
   top:0;
   left:0;
   right:0;
   bottom:0;
   margin:0;
   z-index: 999;
   -webkit-transition:all 1s;
   -moz-transition:all 1s;
   transition:all 1s;
}
.popup-contenedor {
   position: relative;
   margin:7% auto;
   padding:30px 50px;
   background-color: #fafafa;
   color:#333;
   border-radius: 3px;
   width:50%;
}
a.popup-cerrar {
   position: absolute;
   top:3px;
   right:3px;
   background-color: #333;
   padding:7px 10px;
   font-size: 20px;
   text-decoration: none;
   line-height: 1;
   color:#fff;
}
#popup { overflow-y:scroll 
}
Insertar CODE, HTML o PHP: 
var cok = "Cook";
if (/(^|;)\s*pop_u_p=/.test(document.cookie)) {
  
}else{
   window.location='#popup';
}
document.cookie = "pop_u_p=" + encodeURIComponent( cok ) +"; max-age=3000;";
Insertar CODE, HTML o PHP: 
<div id="popup">
    <div class="popup-contenedor">
       <h3>BLA BLA BLA BLA</h3>
       <p>bla bla bla bla bla bla</p>
       <a class="popup-cerrar" href="">X</a>
    </div>
</div>
 
Última edición:
- - - Actualizado - - -

sevilla666 dijo:
Insertar CODE, HTML o PHP: 
#popup {
   visibility: hidden;
display:none;
   opacity: 0;
   margin-top: -300px;
}
#popup:target {
   visibility:visible;
display:block;
   opacity: 1;
   background-color: rgba(0,0,0,0.8);
   position: fixed;
   top:0;
   left:0;
   right:0;
   bottom:0;
   margin:0;
   z-index: 999;
   -webkit-transition:all 1s;
   -moz-transition:all 1s;
   transition:all 1s;
}
.popup-contenedor {
   position: relative;
   margin:7% auto;
   padding:30px 50px;
   background-color: #fafafa;
   color:#333;
   border-radius: 3px;
   width:50%;
}
a.popup-cerrar {
   position: absolute;
   top:3px;
   right:3px;
   background-color: #333;
   padding:7px 10px;
   font-size: 20px;
   text-decoration: none;
   line-height: 1;
   color:#fff;
}
#popup { overflow-y:scroll 
}
Insertar CODE, HTML o PHP: 
var cok = "Cook";
if (/(^|;)\s*pop_u_p=/.test(document.cookie)) {
  
}else{
   window.location='#popup';
}
document.cookie = "pop_u_p=" + encodeURIComponent( cok ) +"; max-age=3000;";
Insertar CODE, HTML o PHP: 
<div id="popup">
    <div class="popup-contenedor">
       <h3>BLA BLA BLA BLA</h3>
       <p>bla bla bla bla bla bla</p>
       <a class="popup-cerrar" href="">X</a>
    </div>
</div>
Hacer clic para expandir...

Gracias sevilla666!!! los tres codigos los tengo que pegar arriba del </head> ???
 
mativelez dijo:
- - - Actualizado - - -
Gracias sevilla666!!! los tres codigos los tengo que pegar arriba del </head> ???
Hacer clic para expandir...
El primer código le tienes que añadir la etiqueta <style> al principio y </style> al final , y pegar todo arriba del </head>,

El segundo código le tienes que añadir la etiqueta <script> al principio y </script> al final , y pegar todo arriba del </head>,

El tercer código lo tienes que poner en la siguiente linea de <body>

la línea : document.cookie = "pop_u_p=" + encodeURIComponent( cok ) +"; max-age=3000;";
3000 son los segundos que tienen que pasar para que se vuelva a abrir el popup.
 
sevilla666 dijo:
El primer código le tienes que añadir la etiqueta <style> al principio y </style> al final , y pegar todo arriba del </head>,

El segundo código le tienes que añadir la etiqueta <script> al principio y </script> al final , y pegar todo arriba del </head>,

El tercer código lo tienes que poner en la siguiente linea de <body>

la línea : document.cookie = "pop_u_p=" + encodeURIComponent( cok ) +"; max-age=3000;";
3000 son los segundos que tienen que pasar para que se vuelva a abrir el popup.
Hacer clic para expandir...
Genio!! Lo probaré. El pop sale una vez por ip no ???

Enviado desde mi SM-G355M mediante Tapatalk
 
sevilla666 dijo:
NO el pop sale una vez por usuario (no es lo mismo) hasta que pasan 3000 segundos que le volveria a salir.

Miratelo en este enlace que he colgado, está configurado a 30 segundos. También te he añadido un enlace al popup por si lo quieres.
Hacer clic para expandir...
Perfecto! Hay alguna manera de poner una imagen además de las palabras( bla bla bla) ???

Después tenía pensando poner un botón "suscribite" al href (donde pondré el link al formulario )

Enviado desde mi SM-G355M mediante Tapatalk
 
mativelez dijo:
Perfecto! Hay alguna manera de poner una imagen además de las palabras( bla bla bla) ???
Hacer clic para expandir...

Usa la etiqueta <img> de html, es muy sencillo. busca en google "img html" hay mucha información.
 
sevilla666 dijo:
Usa la etiqueta <img> de html, es muy sencillo. busca en google "img html" hay mucha información.
Hacer clic para expandir...
Ahí ya le encontré la vuelta! Te agradezco mucho tu tiempo en compartirme el código, en verdad me solucionaste el tema. [emoji1]

Enviado desde mi SM-G355M mediante Tapatalk
 
Hay que estar conectado o registrado para responder aquí.

Temas similares

mativelez
Necesito un Codigo POPUP para blogger!
Respuestas
2
Visitas
456
mativelez
mativelez
Atrás
Arriba