Cargando...
Notificaciones Password  Username

Regresar CPortada - Mas que un foro, tu Comunidad.  » Recursos para Forumotion - Foroactivo » PUNBB
Actualizar esta página Cómo crear un "Pop-Up Chat Box"
Nombre de Usuario:
Contraseña:
   

Responder al tema
 
Herramientas Modos de visualización

  
(#1)
Old  Supervisor
">
Supervisor
Miko
3379942805/02/2009Peru
 
icon1 Cómo crear un "Pop-Up Chat Box" el 8/5/2011, 10:21 am

Hola miembros de CPortada, Aquí les traigo como poner
Chat Box en modo Pop Up cuidado no lo hice yo, esto fue lanzado en Forumotion.

En este tutorial aprenderás cómo crear una ventana de chat con sólo hacer clic en una determinada imagen / botón. Puede ser cualquier foro versión, pero se ve mejor cuando se phpBB2 o punBB.


phpBB2 y punBB usuarios:

Paso 1:

Vaya a su Panel de Administración

Paso 2:

Vaya a Ver > Plantillas > General > overall_footer > Haga clic en el Botón Modificar

Paso 3:

Navegue hasta el fondo de todo el código y encontrar:

Código:
</body>
</html>

Ahora, justo antes del , pegar:

Código:
<div id="chatbox_ret_cont" onmouseout="stopINT()" onclick="stopINT()" onmousever="stopINT()" style="border-top: 7px solid rgb(148, 11, 11); border-left: 7px solid rgb(148, 11, 11); z-index: 10000; -moz-border-radius: 20px 0pt 0pt 0pt; background-color: COLOR HERE; position: fixed; bottom: 0pt; right: 0pt; border-color: COLOR HERE;"><div onclick="(document.getElementById('chatbox_ret').style.display=='block')?my_setcookie('chatbox_ret','0',0,0):my_setcookie('chatbox_ret','1',1,0); $('#chatbox_ret').toggle('normal');" style="font-size: 12px; font-family: 'trebuchet ms',serif; cursor: pointer; padding: 3px;"><span id="chatbox_ret_online" style="color: black);">Chat</span><span id="chatbox_ret_offline" style="color: black;">Box</span></div><iframe scrolling="no" frameborder="0" onload="if(cb_new) { cb_start(); cb_new=0; }" style="width: 740px; height: 400px; display: none;" marginheight="0" marginwidth="0" name="chatbox_ret" id="chatbox_ret" src="/chatbox/chatbox.forum"></iframe></div>

Puede cambiar el color mediante la edición del:

Código:
background-color: COLOR HERE;
en la secuencia de comandos.

Puede cambiar el color del borde de la edición del:
Código:
border-color: COLOR HERE;

También puede cambiar el texto ChatBox cambiando los textos "Chat" y "Box" en el código anterior.

Una vez que su terminado, haga clic en Guardar y, a continuación, volver a overall_footer y haga clic en el botón que indica además publicar.

phpBB3 y Invision usuarios:

Paso 1:
Vaya a su Panel de Administración

Paso 2:
Vaya a General> Mensajes y correos electrónicos> Anuncios

Paso 3:
Activar avisos: "Sí"
Anuncios de la exhibición: "Todas las páginas" o si sólo quieres que aparezca en la página del foro, "Página de inicio"
Desplazamiento: "Desactivar"

Paso 4:
Haga clic en el Crear un botón nuevo anuncio.

Paso 5:
Añadir:

Código:
<div id="chatbox_ret_cont" onmouseout="stopINT()" onclick="stopINT()" onmousever="stopINT()" style="border-top: 7px solid rgb(148, 11, 11); border-left: 7px solid rgb(148, 11, 11); z-index: 10000; -moz-border-radius: 20px 0pt 0pt 0pt; background-color: COLOR HERE; position: fixed; bottom: 0pt; right: 0pt; border-color: COLOR HERE;"><div onclick="(document.getElementById('chatbox_ret').style.display=='block')?my_setcookie('chatbox_ret','0',0,0):my_setcookie('chatbox_ret','1',1,0); $('#chatbox_ret').toggle('normal');" style="font-size: 12px; font-family: 'trebuchet ms',serif; cursor: pointer; padding: 3px;"><span id="chatbox_ret_online" style="color: black);">Chat</span><span id="chatbox_ret_offline" style="color: black;">Box</span></div><iframe scrolling="no" frameborder="0" onload="if(cb_new) { cb_start(); cb_new=0; }" style="width: 740px; height: 400px; display: none;" marginheight="0" marginwidth="0" name="chatbox_ret" id="chatbox_ret" src="/chatbox/chatbox.forum"></iframe></div>

Puede cambiar el color mediante la edición del:

Código:
background-color: COLOR HERE;
en la secuencia de comandos.

Puede cambiar el color del borde de la edición del:

Código:
border-color: COLOR HERE;

También puede cambiar el texto ChatBox cambiando los textos "Chat" y "Box" en el código anterior.

A continuación, haga clic en Guardar.

Una vez que el código ha sido introducido y todo lo que se ha guardado, vaya a su Panel de Administración> Módulos> Chatbox>> Configuración de pantalla> Chatbox No mostrar

A continuación, haga clic en Guardar.

Tutorial sobre cómo utilizar esta nueva ventana de chat:

En primer lugar, haga clic en esa imagen en la parte derecha inferior de la pantalla que dice "chatbox."

De la imagen:



En segundo lugar, una pantalla pop-up que debería decir Chat Box "Se ha desconectado".

Imagen:



En tercer lugar una sesión, haga clic en el texto que dice entrar o conectarse

Imagen:



Ahora debería estar conectado en la ventana de chat! Para ver los miembros registrados en la ventana del chat, simplemente ver la pantalla de la mano izquierda dentro de la ventana de chat.


Imagen:


Ahora se puede asociar con cualquier persona dentro de la ventana de chat que está conectado. Para cerrar la ventana del chat, simplemente haga clic en cualquier parte que es de oro que rodea la ventana de chat reales. Esto no va a cerrar la sesión!

Para salir, simplemente haga clic en el texto que dice "Cerrar sesión".

Imagen:



Para enviar mensajes simplemente escriba en el cuadro de texto y haga clic en "Enviar".
____________--

Fuente Web: Free forum support
Autor: MrMario
Traducido por: Omnia

No hay codigos ocultos ya que esta informacion fue sustraido del foro oficial de soporte en ingles.
Hago sita tanto del Autor como el URL de la Pagina



Quisiera borrarte de mi memoria...creer que no existe tu persona,
pero es imposible que yo lo crea...
por que eres imagen que a mi se revela...
no puedo seguir con esta angustia...e ir sin ti es mi castigo
yo se que es pecado amarte a ciegas...y desde hoy he jurado…

" Un corazon Solitario no es un corazon "

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