Staff en línea
Últimos temas
[widget]  Widget de noticias de múltiples foros Origin10[widget] Crear mp
por citrato Mar Jul 21, 2020 5:05 am

[widget]  Widget de noticias de múltiples foros Origin10[widget] Aviso flotante
por citrato Lun Jul 20, 2020 8:14 am

[widget]  Widget de noticias de múltiples foros Origin10[recursos] Pack Rangos
por PeruxD Miér Jul 15, 2020 4:37 am

[widget] Widget de noticias de múltiples foros
Tema iniciado por y Añadir a favoritos

staff
[codebox]Con este código podrás colocar un widget en tu foro con las noticias de los foros que quieras.[/codebox]
Crea una nueva hoja de Javascript y activalo en todas las páginas.
[hidecode]
Código:
$(function() {
  newsWidget('left', 15, 1, 1);
 
function newsWidget(column, forum, topics, special_id) {
  if (localStorage.getItem('newsMod-'+special_id) && localStorage.getItem('newsExp-'+special_id) > +new Date - 4*60*1000) {
    $('#'+column).append('<div id="news-'+special_id+'"><span class="hiddenItems" style="display:none"></span></div>');
    $('#news-'+special_id).html(localStorage.getItem('newsMod-'+special_id));
 return;
  }
  $('#'+column).append('<div id="news-'+special_id+'"><span class="hiddenItems" style="display:none"></span></div>');
  $('#news-'+special_id+' .hiddenItems').load('/feed/?f='+forum+' item:lt('+topics+')', function() {
    var it = 0;
    while (it < topics) {
      $('#news-'+special_id).append('<div class="module mod_news newsBox'+it+'"><div class="inner"><span class="corners-top"><span></span></span><div class="h3"></div><p class="dateAuthor"></p><span class="content"></span><p class="row3"></p><span class="corners-bottom"><span></span></span></div></div>');
      it += 1
    }
    $('#news-'+special_id+' .hiddenItems item').each(function(){
      var box = '.newsBox'+$(this).index();
      $('#news-'+special_id + ' ' + box + ' .h3').html($(this).find('title').text()).wrap('<a href="'+$(this).find('guid').text()+'">');
      $('#news-'+special_id + ' ' + box + ' .content').html($(this).find('description').text());
      $('#news-'+special_id + ' ' + box + ' .row3').html('<a href="'+$(this).find('comments').text()+'">View comments</a>');
      $('#news-'+special_id + ' ' + box + ' .dateAuthor').html($(this).find('pubdate').text() + ' by <strong>' + $(this).find('dc\\:creator').text() + '</strong>');
    });
    if (window.localStorage) {
      localStorage.setItem('newsMod-'+special_id, $('#news-'+special_id).html());
      localStorage.setItem('newsExp-'+special_id, +new Date)
    }
  });
}
});
[/hidecode]

CSS básico.

Código:
.module.mod_news.newsBox0 img {
    height: 30px;
    width: 30px;
}
.module.mod_news.newsBox0 .h3 {
    font-size: 8px;
}
.module.mod_news.newsBox0 {
    max-height: 87px;
    background: #000;
    overflow: scroll;
    font-size: 8px;
    color: #A9987E;
    text-align: center;
}

Explicación del código.
Al inicio verás esto:
Código:
$(function() {
  newsWidget('left', 15, 1, 1);

Lo primero es la columna: dependiente de dónde quieras el widget, si a izquierda o derecha del foro, debes poner 'left' o 'right'.

El segundo número es el foro: coloca el número del foro de dónde quieres que procedan las noticias. El número lo puedes ver en el enlace, así: http://www.opensourcephpbb3.com/f8-el-cafe < f8 sería el foro. Pero en el código solo debes poner el número: 8

El siguiente número es el número de temas que quieras que salgan: 1, 2, o tres temas... Te aconsejo no poner muchos para que no se te haga demasiado extenso.

El último número es el ID de tu widget: en este código puedes agregar varias lineas como la primera: newsWidget('left', 15, 1, 1); para agregar más de un widget por lo que si quieres poner más de uno, debes poner a cada widget un ID diferente. El último número debe ser SIEMPRE diferente.

Si quieres más de un widget, debes agregarlo al código así:

RinC
RinC

¿Que estoy pensando? :

Maldita cuarentena... :/ [table class=fecha_up][td]Se modifico:8/04/20 - 17:29 hrs. [/td][/table]


Banner en temas :

♥♥Open♥♥


Color de titulos :

#DF7401


Sombra titulo :

1px 1px 1px #fff


Mensajes :

792


Puntos :

1156


Me gusta :

202


ingreso :

28/01/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Volver arriba Ir abajo

staff
Mensaje automático



[ok]Se movio el tema del subforo Javascript a Widgets[/ok]
Chalo
Chalo

¿Que estoy pensando? :

jugando con un ping de 999 [table class=fecha_up][td]Se modifico:25/05/20 - 10:57 hrs. [/td][/table]


Banner en temas :

https://i.imgur.com/ikntDYIh.jpeg


Color de titulos :

#fff


Sombra titulo :

0 0 1px #000


Mensajes :

7136


Puntos :

9268


Me gusta :

1063


ingreso :

17/04/2014


Sexo :

Masculino

Plataforma :

phpbb3


Navegador :

chrome


https://www.opensourcephpbb3.com

Volver arriba Ir abajo

staff
Interesante gracias por el aporte...
Dosh
Dosh

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

1700


Puntos :

2460


Me gusta :

468


ingreso :

07/12/2014


Sexo :

Masculino

Plataforma :

punbb


Navegador :

Chrome


http://www.telefoneros.com/

Volver arriba Ir abajo

gracias pau, me llama [widget]  Widget de noticias de múltiples foros 569027737
kensha
kensha

¿Que estoy pensando? :

regresando [table class=fecha_up][td]Se modifico:27/03/17 - 9:42 hrs.[/td][/table]


Banner en temas :

http://facecoverz.com/static/img/uploads/o_facecoverz.com-1365693265366.jpg


Color de titulos :

#0FAEAC


Sombra titulo :

1px 1px 1px #fff


Mensajes :

289


Puntos :

424


Me gusta :

83


ingreso :

12/05/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


http://bookland.activosforos.com

Volver arriba Ir abajo

 En la misma categoria


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