Simple Machines Community Forum

SMF Support => Español (Spanish) => Language Specific Support => Modificaciones (Mods) => Aiheen aloitti: Ascot - toukokuu 26, 2011, 03:39:15 IP

Otsikko: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: Ascot - toukokuu 26, 2011, 03:39:15 IP
Hola a todos. Me presento. Soy Lucas (Luk)
y soy nuevo en esto de los foros SMF. Voy a necesitar un poco de su ayuda para poder aprender a manejarme en estos sistemas.
Se un poco de html, un poco de php y de codigos en general. Pero no es suficiente como para poder programar las cosas que quiero para mi foro.

En esta oportunidad quisiera poder poner un cuadro colapsable antes del centro de información. En este caso para poner un CHAT de Xat! que es el que prefieren mis usuarios. A su vez deseo que este cuadro este presente en todas las páginas del foro Pero siempre recordando la desición del usuario. Si el usuario decidió ocultarlo porque le molesta, es necesario que se mantenga oculto hasta que el usuario vuelva a expandirlo.

Mi version de foro es SMF2 rc5.

EDIT--------------------------------------------------------------------
Los foros de foroactivo emplean un codigo (al parecer) basado en Ajax o Jquery que despliega una pestaña con el chat de forma muy atractiva. Esa seria una alternativa ideal para lo que estoy pidiendo, solo que no se como adaptarlo a mi foro. Este es el código que emplean.

    <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>


Espero puedan ayudarme.
Gracias por leer. :)
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: lean - toukokuu 26, 2011, 05:43:56 IP
Fijate en el index template del theme default que esta el codigo del upper_section. Podes ponerlo ahi aprovechando ese script.
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: Ascot - toukokuu 26, 2011, 08:25:34 IP
Hola!. Lo habia intentado pero obtengo el siguiente error.

Lainaa¡Error al analizar la Plantilla!
Hubo un problema cargando el tema o archivo de idioma /Themes/Mylee_SMF2_RC5/index.template.php. Por favor revisa la sintaxis e intenta nuevamente - recuerda, los apóstrofes (') por lo general deben tener una secuencia de escape con la diagonal invertida (\). Para ver información especifica del error del sitio de PHP intenta acceder al archivo directamente. Puedes intentar actualizar esta página o usar el tema por defecto.
syntax error, unexpected T_STRING, expecting ',' or ';'

Lo inserte precisamente luego del div de upper section.

De todas maneras no serviría porque hay que adaptarlo para los foros SMF. Ya que este codigo esta hecho para Foroactivo.
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: lean - toukokuu 26, 2011, 08:42:13 IP
Pero no es necesario utilizar ese codigo de foroactivo, directamente con el codigo del xat lo podes hacer.

Pd: Te dejo un mod que hice para los que utilizan xats, quizas te interese ya que lo podrias tener en una pagina extra de tu foro y muchas opciones mas como radio, etc...
http://www.smfsimple.com/index.php?action=downloads;sa=view;down=8
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: Ascot - toukokuu 26, 2011, 09:26:39 IP
Interesante mod. Gracias por la sugerencia.
Pero no es lo que deseo.
Deseo un bloque personalizable que aparezca al footer de todas las paginas que sea colapsable y que recuerde la desición del usuario.
Eso seria todo.

¿Alguien podria enseñarme como hacerlo?
gracias~
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: lean - toukokuu 26, 2011, 10:23:09 IP
Bueno, pero entonces ya eso no corresponde al soporte smf, eso es de programacion. Una vez que tengas el codigo te diremos donde ponerlo pero ese script lo debes buscar en una web de programacion.

Cierro porque repito, esto no es un foro de programacion.
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: All Colours Sam - toukokuu 27, 2011, 01:21:10 IP
pfff.... quejandose se llega a Roma....

usando Jquery se puede hacer lo que pides...   5 minutos en google me bastaron para encontrar esto:


Koodi (javascript) [Valitse]

$(document).ready(function() {
// LEFT COLUMN:
    // When the collapse button is clicked:
    $('.collapseLeft').click(function() {
        $('.collapseLeft').css("display","none");
        $('.expandLeft').css("display","block");
        $('#leftCol').css("height","20px");
        $.cookie('leftCol', 'collapsed');
    });
    // When the expand button is clicked:
    $('.expandLeft').click(function() {
        $('.expandLeft').css("display","none");
        $('.collapseLeft').css("display","block");
        $('#leftCol').css("height","500px");
        $.cookie('leftCol', 'expanded');
    });
// RIGHT COLUMN:
    // When the collapse button is clicked:
    $('.collapseRight').click(function() {
        $('.collapseRight').css("display","none");
        $('.expandRight').css("display","block");
        $('#rightCol').css("height","20px");
        $.cookie('rightCol', 'collapsed');
    });
    // When the expand button is clicked:
    $('.expandRight').click(function() {
        $('.expandRight').css("display","none");
        $('.collapseRight').css("display","block");
        $('#rightCol').css("height","500px");
        $.cookie('rightCol', 'expanded');
    });
// COOKIES
    // Left column state
    var leftCol = $.cookie('leftCol');
    // Right column state
    var rightCol = $.cookie('rightCol');
    // Set the user's selection for the left column
    if (leftCol == 'collapsed') {
        $('.collapseLeft').css("display","none");
        $('.expandLeft').css("display","block");
        $('#leftCol').css("height","20px");
    };
    // Set the user's selection for the right column
    if (rightCol == 'collapsed') {
        $('.collapseRight').css("display","none");
        $('.expandRight').css("display","block");
        $('#rightCol').css("height","20px");
    };

});



Koodi (html) [Valitse]

<div id="page">
<div id="leftCol">
<div class="collapseLeft"/>
<div class="expandLeft"/>
</div>
<div id="rightCol">
<div class="collapseRight"/>
<div class="expandRight"/>
</div>
<br clear="all"/>



al incluirr código javascript dentro de un echo de php hay que recordar cambiar todas las comillas simples del javascript  '   a esto  \'  para evitar errores de sintaxis.
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: All Colours Sam - toukokuu 27, 2011, 02:38:06 IP
depende de donde quieras ponerlo, en que parte en especifico de tu foro,  por ejemplo, si va a ser visible en todas tus páginas, entonces va a ser en el index.template.php de el theme que estes usando   y aun dentro de el index.template hay que aber en que parte en especifico, arriba del footer?  debajo?
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: Ascot - toukokuu 27, 2011, 02:41:36 IP
Gracias por reabrir el tema !  : )
Me gustaria ponerlo por arriba del footer.
Lo que no se bien es donde instalar los codigos Javascript :O
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: All Colours Sam - toukokuu 27, 2011, 02:52:07 IP
Hay dos formas de llamar a el javascript, una es llamando a un archivo externo:

<script type="text/javascript" src="', $settings['theme_url'], '/scripts/mi_archivo.js"></script>


o directamente poner el codigo en el archivo:


<script type="text/javascript">
$(document).ready(function() {
// LEFT COLUMN:
    // When the collapse button is clicked:
    $(\'.collapseLeft\').click(function() {
        $(\'.collapseLeft\').css("display","none");
        $(\'.expandLeft\').css("display","block");
        $(\'#leftCol\').css("height","20px");
        $.cookie(\'leftCol\', \'collapsed\');
    });
    // When the expand button is clicked:
    $(\'.expandLeft\').click(function() {
        $(\'.expandLeft\').css("display","none");
        $(\'.collapseLeft\').css("display","block");
        $(\'#leftCol\').css("height","500px");
        $.cookie(\'leftCol\', \'expanded\');
    });
// RIGHT COLUMN:
    // When the collapse button is clicked:
    $(\'.collapseRight\').click(function() {
        $(\'.collapseRight\').css("display","none");
        $(\'.expandRight\').css("display","block");
        $(\'#rightCol\').css("height","20px");
        $.cookie(\'rightCol\', \'collapsed\');
    });
    // When the expand button is clicked:
    $(\'.expandRight\').click(function() {
        $(\'.expandRight\').css("display","none");
        $(\'.collapseRight\').css("display","block");
        $(\'#rightCol\').css("height","500px");
        $.cookie(\'rightCol\', \'expanded\');
    });
// COOKIES
    // Left column state
    var leftCol = $.cookie(\'leftCol\');
    // Right column state
    var rightCol = $.cookie(\'rightCol\');
    // Set the user\'s selection for the left column
    if (leftCol == \'collapsed\') {
        $(\'.collapseLeft\').css("display","none");
        $(\'.expandLeft\').css("display","block");
        $(\'#leftCol\').css("height","20px");
    };
    // Set the user\'s selection for the right column
    if (rightCol == \'collapsed\') {
        $(\'.collapseRight\').css("display","none");
        $(\'.expandRight\').css("display","block");
        $(\'#rightCol\').css("height","20px");
    };

});

</script>



nota como he cambiado los ' por \'   

en ambos casos deberás de poner tu javascript dentro de las etiquetas <head> </head>  en tu index.template.php



para usar jquery tendrás que llamar a su libreria antes de llamar a tu javascript:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"/>



una vez hecho eso, ya podrás poner tu html en el index.template.php
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: Ascot - toukokuu 27, 2011, 03:02:28 IP
Muchas gracias por tu ayuda. Lo pondre a prueba.
Lamento la critica de hace un rato.

Generalmente intento buscar por mi cuenta y aprender por mi cuenta siempre, sólo cuando me he cansado de buscar y de no entender nada en concreto recurro al foro de asistencia, un poco frustrado y en busca de una solucion, y de que otros puedan asistirme con su experiencia, es por eso que actué de esa manera ,aunque se que eso no lo justifica realmente.
Incluso, en algun futuro incierto me gustaría poder ayudar a otros en medida en que aprenda más a manejarme en los foros SMF asi como pude ayudar en otros foros.

Saludos  : )

Edit ----------------------------------

No me anda T__T
Puse el script en un archiv .js guardado en la carpeta Scripts de mi tema actual, lo llame desde el <head> de mi Index template php (llamando la libreria de jquery en la linea anterior) . Puse el codigo html en el sector apropiado. Se ve el chat, pero no se ven los divs y tampoco son expansibles, colapsables.  .__.
este es mi foro animefall.eshost.es
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: All Colours Sam - toukokuu 27, 2011, 03:35:36 IP
intenta con la otra opcion, la de poner el codigo directamente en tu archivo.
Otsikko: Re: ¿cómo poner modulo expansible antes del footer?
Kirjoitti: All Colours Sam - toukokuu 27, 2011, 03:40:59 IP
cierro a petición, Lük· por favor abre un nuevo tema con la url de tu foro y el codigo exacto que estés usando para mostrar tu chat.