Nymphea's Cage
  • Pedido #1 Savage Themes
  • Pedido #9 Savage Themes
  • Pedido The Warrior Road
  • Cupo disponible
  • Cupo disponible
  • Cupo disponible
  • Haz tu propio pedido aqui
    Lo ultimo
    Ultimo aporteUltimo tutorialUltimo proyectoUltimo grafico
    Compañeros y Recomendados
    adminsitro miembro solo recomiendo

    Últimos temas
    » Petición de tutorial sobre el acomodo y manejo de widgets
    Dom Ago 06, 2017 1:54 am por Shiki

    » Lady Dragon
    Lun Jul 24, 2017 5:01 am por Nymphea

    » Keep it Simple
    Lun Mayo 08, 2017 3:19 am por Nymphea

    » ¿Qué ocurre con el copyright de las imágenes?
    Dom Mayo 07, 2017 5:23 pm por Nymphea

    » Cloudy Spring
    Lun Abr 24, 2017 2:38 am por Nymphea

    » Tablilla para blogspot
    Dom Abr 23, 2017 4:45 pm por Nymphea

    » StarDust
    Sáb Mar 18, 2017 2:37 am por Nymphea

    » ¿Podrías desarrollar más tutoriales?
    Mar Mar 14, 2017 6:10 pm por Shiki

    » Hidden in the Moon
    Jue Feb 23, 2017 5:36 am por Nymphea


    StarDust

    Ver el tema anterior Ver el tema siguiente Ir abajo

    StarDust

    Mensaje por Nymphea el Sáb Mar 18, 2017 2:37 am

    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

    Intentare hacer mas versiones de este codigo, con diferentes cosas que les sean utiles a los foristas <3 Sugenrencias son bienvenidas
    Nymphea
    avatar
    Admin

    Mensajes :
    334

    Fecha de inscripción :
    10/09/2012

    Localización :
    somehere


    http://mikeiry.forochile.org

    Volver arriba Ir abajo

    Ver el tema anterior Ver el tema siguiente Volver arriba

    - Temas similares

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