[TUTORIAL] Categoria para fóruns favoritos (PunBB)

Agora os usuários de vossos fóruns poderão salvar as categorias favoritas do fórum. Dando em si uma personalidade, e desempenho as categorias, de um modo eficaz e rápido.

--> Tutoriais, dicas e astúcias <--
Categoria favoritas em PunBB

1º - Editando template:
Aceda os templates:
CPainel -> Visualização -> Templates -> Geral/index_box
Pesquisar por:

Código:

<div class="main">

Substituir por:

Código:

<div id="indexBox" class="main">

Procurar por:

Código:

<!-- BEGIN switch_on_index -->

Inserir antes:

Código:

<!-- by baivong -->
 <script type="text/javascript">
 //<![CDATA[
 var zzfavourite = {
 wrapAll: "#indexBox",
 title: "#indexBox .forumtitle",
 item: "tr",
 wrapItem: ".statused",
 boxContent: ".main-content",
 favouriteCal: '<div class="main-head favouriteBox"><div class="page-title"><h2>Fóruns favoritos</h2></div></div><div class="main-content favouriteBox"><table cellspacing="0" class="table"><thead><tr><th class="tcl">Forum</th><th class="tc2">Tópicos</th><th class="tc3">Mensagens</th><th class="tcr">Última mensagem</th></tr></thead><tbody id="favourites" class="statused"></tbody></table></div>',
 pageIndex: "",
 favouriteBox: function () {
 $("#favourites").length || $(zzfavourite.wrapAll).prepend(zzfavourite.favouriteCal)
 },
 start: function () {
 if ("/" == location.pathname || "/forum" == location.pathname) zzfavourite.pageIndex = !0;
 $(zzfavourite.title).after('<div class="zzheart"></div>');
 $(zzfavourite.wrapAll).on("click", ".zzheart", function () {
 if ($(this).hasClass("zzlove")) {
 var c = $(this).prev().attr("href"),
 a = RegExp("\\b" + c.match(/\/f(\d+)-.*/)[1] + "\\b\\s?");
 my_setcookie("favouriteBox", my_getcookie("favouriteBox").replace(a,
 ""), !0);
 $(this).removeClass("zzlove");
 if (zzfavourite.pageIndex) {
 var d = $(this).closest("tr"),
 b = $(zzfavourite.title + "[href='" + c + "']:last").closest(zzfavourite.item);
 d.fadeOut(300, function () {
 b.parent().is(":hidden") && b.closest(zzfavourite.boxContent).fadeIn().prev().fadeIn();
 b.find(".zzheart").removeClass("zzlove").end().fadeIn(300);
 d.remove();
 $("#favourites " + zzfavourite.item).length || $(".favouriteBox").remove()
 })
 }
 } else if (c = $(this).prev().attr("href").match(/\/f(\d+)-.*/)[1], $(this).addClass("zzlove"),
 a = my_getcookie("favouriteBox"), null == a || "" == a ? my_setcookie("favouriteBox", c, !0) : RegExp("\\b" + c + "\\b\\s?").test(a) || my_setcookie("favouriteBox", a + " " + c, !0), zzfavourite.pageIndex) {
 zzfavourite.favouriteBox();
 var e = $(this).closest(zzfavourite.item);
 e.fadeOut(300, function () {
 e.clone().appendTo("#favourites").fadeIn(300);
 0 == $(this).parent().height() && $(this).closest(zzfavourite.boxContent).hide().prev().hide()
 })
 }
 });
 var b = my_getcookie("favouriteBox");
 null != b && "" != b && ($.each($.trim(b).split(" "), function (c,
 a) {
 var d = $(zzfavourite.title + "[href^='/f" + a + "-']");
 console.log($.trim(b).split(" "));
 d.next().addClass("zzlove");
 zzfavourite.pageIndex && (zzfavourite.favouriteBox(), d.closest(zzfavourite.item).hide().clone().appendTo("#favourites").show(), 0 == d.closest(zzfavourite.wrapItem).height() && d.closest(zzfavourite.boxContent).hide().prev().hide())
 }), $("#favourites").is(":empty") && $(".favouriteBox").remove())
 }
 };
 zzfavourite.start();
 //]]>
 </script>

Feito isso, Salve e Publique!


2º - Aplicando código CSS
Painel de Controle ->> Visualização ->> Imagens e Cores ->> Cores ->> Folha de estilo CSS

Código:

#indexBox .zzheart{display:inline-block;background:url(//i56.servimg.com/u/f56/18/59/49/93/heart10.png) no-repeat;background-position:0 0;width:16px;height:16px;cursor:pointer;margin-left:5px;opacity:.5;-webkit-transition:opacity .5s ease;-moz-transition:opacity .5s ease;-o-transition:opacity .5s ease;transition:opacity .5s ease}
#indexBox .zzlove{background-position:0 -16px}
#indexBox .zzheart:hover{opacity:1}

• Resultado:
  

  Antes:

  
  

  Depois:

---

© Fórum dos Fóruns & Zzbaivong

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: [Dúvida] Categoria favoritas em PunBB