Conectarse

Recuperar mi contraseña

Últimos temas
» Deku -Expediente
Jue Ago 16, 2018 12:55 am por Kuroki

» Keep it simple -Expediente-
Jue Ago 16, 2018 12:54 am por Kuroki

» 09/08/18 SF
Jue Ago 09, 2018 3:58 pm por Kuroki

» Keep it simple -Widgets-
Jue Ago 09, 2018 3:50 pm por Kuroki

» Dream catcher -Usos multiples-
Jue Ago 09, 2018 3:39 pm por Kuroki

» Bite -Otros-
Jue Ago 09, 2018 3:38 pm por Kuroki

» Garage -Relaciones2-
Jue Ago 09, 2018 3:34 pm por Kuroki

» Garage -Relaciones-
Jue Ago 09, 2018 3:34 pm por Kuroki

» Garage -Expediente-
Jue Ago 09, 2018 3:33 pm por Kuroki

Nombre
Rango
MensajePerfil
CRÉDITOS
Skin “Shine!” creado por Runa XIII e inspirado en la colección de tablillas de NympheaKeep it simple”. Un agradecimiento especial para Nymphea por su consentimiento. Paleta de color “198 Celebration!” por alfarroba en ColorLovers. Un agradecimiento especial a la Asistencia de Foroactivo y los tutoriales de Savage Themes y The Captain Knows Best.


Stardust -Tablon anuncios a un costado-

Ir abajo

Stardust -Tablon anuncios a un costado-

Mensaje por Kuroki el Jue Ago 09, 2018 1:18 pm

Hoy les traigo el pequeño complemento que pueden ver en la esquina inferior derecha de este mismo foro <3



Para instalarlos tendrán que seguir los siguientes pasos

1. Activar el modulo Ultimos Temas (en  caso de que no lo tengan)
Iremos a PA > Modulos > Portal & Widgets > Gestion de los Widgets del Foro. Ahora pondremos las siguientes opciones: Mostrar los widgets del foro: Si
Adición de Widgets predefinidos > Ultimos Temas
Denle a registrar al final

2. Añadir un codigo Javascript
Iremos a PA > Modulos >  HTML & Javacript > Gestion de los codigos Javascript. Ahora las opciones seran
Activar la gestión de los códigos Javascript: Si (en caso de que no lo tengan)
Luego, iremos a la seccion de "Crear un nuevo Javascript", Una vez dentro, escojan el titulo que quieran. En Posición pueden escoger la que gusten, yo recomiendo "En todas las paginas". Agreguen el siguiente codigo en la zona de escritura Javascript

Código:
$(document).ready(function(){

$('.bot1').click(function(){
$('#caja1').slideToggle(550);
});


});

jQuery(document).ready(function(){
    jQuery("#micontenedor").replaceWith(jQuery("#comments_scroll_div"));
    });

Y finalmente, registrar.

3. Añadir un Estilo (CSS)
Iremos al CSS a agregar la apariencia de nuestro nuevo boton. Para ello
PA > Visualizacion > Imagenes y Colores> Colores > CSS Stylesheet. Pegamos el siguiente codigo:

Código:
/**/
#left { display:inline; margin-left:-2200px;    
   }/*Ocultar el modulo original*/

#comments_scroll_div a {
  color: #90ccec;} /*Color de los links a los temas*/

/*Caja del Clickeame*/
.bot1 {
  width: 216px;
  height: 20px;
  cursor: pointer;
  text-align: center;
  position: fixed;
  z-index: 998;
  background: #816498;/*Color de fondo del clickeame*/
  border-radius: 8px;
  bottom: 30px;
  right: 10px; /*Si lo quieres pegado en la esquina izquierda cambia a: left:10px;*/
  padding: 2px;
}

/*Caja en la que van los ultimos temas desfilando*/
#caja1 {
  position: fixed;
  bottom: 60px;
  right: 10px;/*Si lo quieres pegado en la esquina izquierda cambia a: left:10px;*/
  width: 200px;
  height: 200px;
  padding: 10px;
  display: none;
  background: rgba(1, 1, 70, 0.7);/*Para cambiar el fondo a negro pon: background: rgba(0,0,0,0.8)*/
  color: #fff; /*Color del texto de la zona, por ejemplo la hora de cada post*/
  z-index: 999;
}

/*Configuracion del texto "clickeame"*/
.bot-text {
  color: #fff;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 10px;
  text-align: center;
  letter-spacing: 2px;
  text-transform: uppercase;
}
/**/

Notas sobre este paso: Si tu tienes en tu foro lo siguiente "#left {display: none}" no es necesario que lo cambies por "#left { display:inline; margin-left:-2200px;}", esto lo he hecho debido a que a muchos foros se les "corta y reinicia" el widget ultimos temas. Es una precaución.

4. Añadir el anuncio
PA > General > Mensajes y Emails > Anuncios
En "Opciones generales de los anuncios" ponemos: Activar los anuncios: Si
Mostrar los anuncios : En todas las paginas
Scroll: Desactivar
Registren, Ahora iremos al signo mas (+) que esta en la zona que dice Anuncios, para crear uno nuevo, en este anuncio simplemente debemos poner este codigo:
Nombre: A su antojo
Contenido:

Código:
<div class="bot1">
              
 <div class="bot-text">
        Clickeame                
 </div>
</div>
 
<div id="caja1">
                                
 <div id="micontenedor">
                              
 </div>
                                  
</div>

REgistramos los cambios y listo! Ya acabamos
avatar
Kuroki
Admin

Mensajes : 159
Fecha de inscripción : 03/10/2014

Ver perfil de usuario http://kuroki-is-love.foroactivo.mx

Volver arriba Ir abajo

Volver arriba

- Temas similares

 
Permisos de este foro:
No puedes responder a temas en este foro.