Cargando...
Notificaciones Password  Username

Regresar CPortada - Mas que un foro, tu Comunidad.  » Recursos para Forumotion - Foroactivo » PHPBB3 » CSS Stylesheet
Actualizar esta página Chatbox similar a cBox, tagboard en Widget
Nombre de Usuario:
Contraseña:
   

Responder al tema
 
Herramientas Modos de visualización

(#1)
Old  Administrador
">
avatar
Administrador
Amnel
40015396116/02/2009OtherCat Lover :3http://i.imgur.com/oNn7E5l.jpg
 

Chatbox similar a cBox en Widget


Muchas veces se usa la cbox.ws o tagboard por que es muy sencillo de insertar en foros de ForoActivo / Forumotion sin embargo este ya cuenta con uno. Como se sabe ForoActivo / Forumotion es bastante sencillo de usar y modificar su apariencia dependiendo de la versión del foro que use.

Por ello que hoy vamos a modificar la parte de la ChatBox de ForoActivo / Forumotion y vamos a asemejarlo mucho a cbox.ws o tagboard que quizá muchos de ustedes usan. Comencemos.

  1. Para nuestro primer paso, vamos a copiar este código CSS y lo vamos a pegar en la base de nuestro foro:

    Código:
    /*Apariencia cbox.ws o tagboard por Saatiya y Sea*/

    .chatbox-title {
    display: none;
    }
    #chatbox {
    height: 350px;
    bottom: 0;
    left: 0;
    padding-bottom: 30px;
    top: auto;
    width: 160px;
    }
    #chatbox_footer {
    height: 28px;
    width: 161px;
    }
    #message {
    font-size: 12px;
    visibility: visible;
    width: 160px;
    height: 28px;
    position: relative;
    top: -10px;
    padding: 0 5px;
    }
    #saatiya_cbox{border: 2px solid #0076b1;
    border-radius: 6px;}
    #chatbox, #chatbox p, #chatbox p strong
    {font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
    font-size: 11px;
    font-weight: normal!important;}

    #chatbox_option_autorefresh, .date-and-time {
    display: none;
    }
    #chatbox_footer label, #chatbox_members .member-title {
    visibility: hidden;
    }

    #chatbox p. span.msg{
    width: 170px; 
    }

    /*Apariencia cbox.ws o tagboard por Saatiya y Sea*/



  2. Una vez que hayamos hecho eso, crearemos un nuevo Widget desde nuestro Panel de Administrador y dentro ello pegaremos este iframe para insertar nuestra ChatBox modificada:

    Código:
    <iframe id="saatiya_cbox" src="/chatbox" height="400" width="160" frameborder="no" scrolling="no"></iframe>


    Guardamos los cambios y listo ya tenemos nuestra nueva chatbox. El resultado que vas a visualizar es este.




Este pequeño tutorial fue redactado y editado por Saatiya, si lo vas a compartir en otros lugares, te ruego por favor colocar la fuente CPortada y el autor que soy yo Saatiya y Sea. Gracias
Copyright© CPORTADA.FORUM.ST



Última edición por Saatiya el 21/5/2013, 11:47 am, editado 1 vez



"...La vida es corta pero,
El talento y el alma inmortal..."



(#2)
Old  Principiante
">
avatar
Principiante
R0CK
22017/10/2012Mexico
 

Anda, si esta muy bien esto. Gracias.

(#3)
Old  Principiante
">
avatar
Principiante
loveparadise
12107/06/2013Ecuador
 

gracias por el tuto, muy bien explicado

(#4)
Old  Principiante
">
avatar
Principiante
Alessandra
811125/09/2011Mexico
 

Muchas gracias por compartirlo! es super interesante

(#5)
Old  Principiante
">
avatar
Principiante
Nubesita003
11015/08/2013Mexico
 

Genial, muchas gracias por el tuto

(#6)
Old  Principiante
">
avatar
Principiante
Broak
4059318/03/2014Colombia
 

like

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

 Los Códigos BB están Activado
 Los Emoticonos están Activado
 Código [IMG] está Activado
 Código HTML está Activado