Staff en línea

Página 1 de 3. 1, 2, 3  Siguiente

[html] Avatar en los últimos temas (widget)
Tema iniciado por y Añadir a favoritos

[html] Avatar en los últimos temas (widget) 
el Sáb Feb 07, 2015 8:50 am
staff


Última edición por Chalo el Jue Ago 20, 2015 11:18 pm, editado 1 vez
[codebox]Ejemplo:

  • Primero vamos a la pestaña visualización
    Luego a templetes.
    Buscamos la casilla Portal.
    Seleccionamos mod_recent_topics.
    Sustituimos todo el contenido por:
[/codebox]

[hidecode]
Código:
<style>
.recent_space {
border-bottom: 1px solid #F3F3F3;
margin: -5px;
}
.avt-r {
float: left;
}
.avt-r img {
width: 30px;
height: 30px;
margin: 3px;
padding: 1px;
border: 1px solid #D5D5D5;
background: white;
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}
.avt-r img:hover {
border-color: #a1a1a1;
-webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
}
</style>
<!-- BEGIN scrolling_row -->
<div class="module main">
  <div class="main-head"><div class="h3">{L_RECENT_TOPICS}</div></div>
  <div class="main-content" id="comments_scroll_div">
      <!-- BEGIN recent_topic_row -->
          <div class="avt_recent">
              <div class="recent_space">
      <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TOPIC_TITLE}</a><br />
          <img src="{ICON_TIME}" alt="" />{scrolling_row.recent_topic_row.S_POSTTIME} {BY}

    <!-- BEGIN switch_poster -->
      <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a><br /><br />
      <!-- END switch_poster -->

      <!-- BEGIN switch_poster_guest -->
      {scrolling_row.recent_topic_row.switch_poster_guest.S_POSTER}<br /><br />
      <!-- END switch_poster_guest -->

      <!--
      <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.U_POSTER}">{scrolling_row.recent_topic_row.S_POSTER}</a><br /><br />
      -->
            </div>
          </div>
      <!-- END recent_topic_row -->
  </div>
</div>

<script type="text/javascript">
//<![CDATA[
$(function(){
  div_marquee('comments_scroll_div', 'comments_scroll_container', '{SCROLL_WAY}', '{SCROLL_STEP}', '{SCROLL_DELAY}', '{SCROLL_HEIGHT}');
});
//]]>
</script>
<!-- END scrolling_row -->

<!-- BEGIN classical_row -->
<div class="module main">
  <div class="main-head"><h3>{L_RECENT_TOPICS}</h3></div>
  <div class="main-content">
      <!-- BEGIN recent_topic_row -->
          <div class="avt_recent">
              <div class="recent_space">
                <a href="{classical_row.recent_topic_row.U_TITLE}" class="bottooom"><font style="font-size: 11px;">{classical_row.recent_topic_row.L_TITLE}</font></a><br />
      <!-- BEGIN switch_poster -->
                <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}"><font style="font-size: 11px;">{classical_row.recent_topic_row.switch_poster.S_POSTER}</font></a>
      <!-- END switch_poster -->
      <!-- BEGIN switch_poster_guest -->
      {classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
      <!-- END switch_poster_guest -->

                {ON} <font style="font-size: 11px;" class="bottooom">- {classical_row.recent_topic_row.S_POSTTIME}</font><br /><br />
      <!--
      <a href="{classical_row.recent_topic_row.U_POSTER}">{classical_row.recent_topic_row.S_POSTER}</a> {ON} {classical_row.recent_topic_row.S_POSTTIME}<br /><br />
        -->
            </div>
          </div><br/>
    <!-- END recent_topic_row -->
  </div>
</div>
<!-- END classical_row -->
[/hidecode]

El último paso es crear un javascript y ponerlo en "Todas las paginas":

Código:

$(document).on('ready', function() {
$('.avt_recent').prepend('<div class="avt-r"><div>');
$('.avt_recent .avt-r').each(function () {
var profileUserURL = jQuery(this).parent().children('.recent_space').children('a:last').attr('href');
$(this).html('<a href="' + profileUserURL + '" class="avt-r-enlace"><img src="http://r14.imgfast.net/users/1417/27/86/76/avatars/1-19.png" alt="No Avatar" /></a>');
$(this).children('a').load(profileUserURL + ' .module:eq(0) img:eq(0)')
});
});

Nota: Si colocan el JS dentro de la plantilla es probable que el efecto no sea el deseado.
Chalo
avatar

¿Que estoy pensando? :

Soy leyenda 3.0 [table class=fecha_up][td]Se modifico:20/11/18 - 12:05 hrs. [/td][/table]


Banner en temas :

https://coverfiles.alphacoders.com/322/32281.jpg


Color de titulos :

#fff


Sombra titulo :

0 0 1px #000


Mensajes :

6863


Puntos :

8959


Me gusta :

1031


ingreso :

17/04/2014


Sexo :

Masculino

Plataforma :

phpbb3


Navegador :

chrome


Ver perfil de usuario https://www.opensourcephpbb3.com

Volver arriba Ir abajo

staff


Última edición por Dosh el Sáb Feb 07, 2015 4:57 pm, editado 1 vez
ese es muy bueno gracias por compartirlo...
Dosh
avatar

¿Que estoy pensando? :

Vuelve el hijo prodigo... [table class=fecha_up][td]Se modifico:1/010/18 - 15:59 hrs. [/td][/table]


Banner en temas :

https://i.imgur.com/JdnysKr.png


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

1585


Puntos :

2328


Me gusta :

453


ingreso :

07/12/2014


Sexo :

Masculino

Plataforma :

punbb


Navegador :

Chrome


Ver perfil de usuario http://www.telefoneros.com/

Volver arriba Ir abajo

staff
@Dosh escribió:[quotelink="/t246-tutorial-avatar-en-los-ultimos-temas-widget#1042"]
ese es muy bueno gracias por compartirlo...

debería funcionar en todas las versiones
Chalo
avatar

¿Que estoy pensando? :

Soy leyenda 3.0 [table class=fecha_up][td]Se modifico:20/11/18 - 12:05 hrs. [/td][/table]


Banner en temas :

https://coverfiles.alphacoders.com/322/32281.jpg


Color de titulos :

#fff


Sombra titulo :

0 0 1px #000


Mensajes :

6863


Puntos :

8959


Me gusta :

1031


ingreso :

17/04/2014


Sexo :

Masculino

Plataforma :

phpbb3


Navegador :

chrome


Ver perfil de usuario https://www.opensourcephpbb3.com

Volver arriba Ir abajo

staff
Es bueno saberlo pero yo uso los últimos mensajes de otra manera jejejeee..
Dosh
avatar

¿Que estoy pensando? :

Vuelve el hijo prodigo... [table class=fecha_up][td]Se modifico:1/010/18 - 15:59 hrs. [/td][/table]


Banner en temas :

https://i.imgur.com/JdnysKr.png


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

1585


Puntos :

2328


Me gusta :

453


ingreso :

07/12/2014


Sexo :

Masculino

Plataforma :

punbb


Navegador :

Chrome


Ver perfil de usuario http://www.telefoneros.com/

Volver arriba Ir abajo

Lo quiero!!!
jazminmorales
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://fbcoversking.com/wp-content/uploads/2012/01/waves-of-colour-facebook-cover.jpg


Color de titulos :

#333


Sombra titulo :

1px 1px 1px #fff


Mensajes :

9


Puntos :

12


Me gusta :

3


ingreso :

13/03/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

@jazminmorales escribió:[quotelink="/t246-tutorial-avatar-en-los-ultimos-temas-widget#1851"]
Lo quiero!!!

Veo
jazminmorales
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://fbcoversking.com/wp-content/uploads/2012/01/waves-of-colour-facebook-cover.jpg


Color de titulos :

#333


Sombra titulo :

1px 1px 1px #fff


Mensajes :

9


Puntos :

12


Me gusta :

3


ingreso :

13/03/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

Lo usare...
Shiru Takeshi
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://fbcoversking.com/wp-content/uploads/2012/01/waves-of-colour-facebook-cover.jpg


Color de titulos :

#333


Sombra titulo :

1px 1px 1px #fff


Mensajes :

8


Puntos :

16


Me gusta :

6


ingreso :

22/03/2015


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

veamos pues..
arsenico
avatar

¿Que estoy pensando? :

Baneado del foro [table class=fecha_up][td]Se modifico:12/12/15 - 18:20 hrs.[/td][/table]


Banner en temas :

http://www.pagecovers.com/covers/electronic_music/music_drum_bass_beats.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

361


Puntos :

495


Me gusta :

52


ingreso :

10/03/2015


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

firefox


Ver perfil de usuario http://losslesscity.foroactivo.com/

Volver arriba Ir abajo

pues no me funciona
arsenico
avatar

¿Que estoy pensando? :

Baneado del foro [table class=fecha_up][td]Se modifico:12/12/15 - 18:20 hrs.[/td][/table]


Banner en temas :

http://www.pagecovers.com/covers/electronic_music/music_drum_bass_beats.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

361


Puntos :

495


Me gusta :

52


ingreso :

10/03/2015


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

firefox


Ver perfil de usuario http://losslesscity.foroactivo.com/

Volver arriba Ir abajo

nice
arber
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://fbcoversking.com/wp-content/uploads/2012/01/waves-of-colour-facebook-cover.jpg


Color de titulos :

#333


Sombra titulo :

1px 1px 1px #fff


Mensajes :

12


Puntos :

13


Me gusta :

1


ingreso :

07/04/2015


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

 En la misma categoria


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