Modificar logo dos títulos dos tópicos

Detalhes da questão

Endereço do fórum: http://atelier262.forumeiros.com/
Versão do fórum: PhpBB3

Descrição

Olá a todos novamente!

Adoraria mudar o designer de "troço" que mostra o nome do título do tópico (esta/m no singular)

Olha como está atualmente:

Como eu quero que esteja:

Spoiler:

Como vai ficar: http://image.prntscr.com/image/7a3d840c15da4a07a3b14f7b3599d0ce.png

Como está: http://image.prntscr.com/image/0253cb4c81494b749db1a109d1c050ab.png

---

Botão da engrenagem e suas funções!

Função dele é abrir em dropdawn uma opção para voltar lista de tópicos da sessão!

http://prnt.sc/dbnqqt

Imagens:

Da engrenagem: https://i.imgur.com/Yy122xt.png (é obvio que isto está com um tamanho menor (no css ou algo assim haha)
Da estrela: https://i.imgur.com/b9O0Pkh.png

Obrigado.

UP

UP

Função dele é abrir em dropdawn uma opção para voltar lista de tópicos da sessão!

http://prnt.sc/dbnqqt

Quero que a função ao invés de ser Voltar a lista de top...., quero que seja! Adicionar aos favoritos.

Thanks!

UP

Bom dia!

Adicione isto ao seu CSS:

Código:

h1.page-title {
    background-color: #243B4D !important;
    padding: 10px !important;
    border-radius: 5px !important;
}

h1.page-title a {
    margin-left: 25px;
}

div.OpenCrowleyUP {
    display: none;
    width: 20%;
    background: #000;
    padding: 10px;
    border-radius: 10px;
}

Crie uma nova página JAVASCRIPT e adicione este código nos tópicos:

Código:

$(document).ready(function(){
   jQuery('h1.page-title:eq(0)').before('<span class="ShekCog" style="cursor: pointer;"><i class="fa fa-cogs"></i> COF</span>').after('<div class="OpenCrowleyUP" style="display: none;width: 20%;background: #000;padding: 10px;border-radius: 10px;"><span class="linkGET"></span></div>');
});
$("span.ShekCog").click(function(){
   var getLinkShek = $('div.pathname-box a.nav:eq(1)').attr('href');
   $('span.linkGET').before('<a href="'+ getLinkShek +'"> <i class="fa fa-star" style="color: gold;"></i> Voltar ao fórum</a>');
    $('div.OpenCrowleyUP').css("display","block");
});

Até mais!

ficou legal!

porém está aparecendo COF em cima deles olha:
http://prntscr.com/dfmraw

- E não teria como deixar o designer um pouco mais bonito, tals como uma linha branca em cima, e uma preta em baixo, como por exemplo: http://prntscr.com/dfmtrr se possivel deixar o mais proximo disto.


Eu adoraria também se possivel deixar a legenda do fórum (trancado, fixo e tals) lá junto com ele (junto com o title) e tb retirar a opção de criar novos tópicos quando estiver vendo um fórum! A opção de criar um novo tópico quero q fique apenas na lista de tópicos.

---

Legenda: tópico fixo; eu quero que a cor dele fique diferente e o ícone dele este: olha como ficaria caso fosse fixo: http://prntscr.com/dfmvgd

E adoraria que tivesse a função de abrir um mine menu em dropdonw assim: http://prntscr.com/dfmvzg

caso o tópico fosse fixo e trancado: http://prntscr.com/dfmw82 ícone do cadeado: é óbviu q o tamanho dele vai ser menor.

se o tópico for apenas trancado: http://prntscr.com/dfmwsz

ressaltando que se for possivel colocar isto ai terá que tirar o que já tem no meu fórum (que aparece nos tópico) como: http://prntscr.com/dfmxj1

Um problema: ele infelizmente está aparecendo na visualização de tópicos, dentro de uma sessão, olhe: http://prntscr.com/dfmxye


Obrigado.

Você pode tirar o COF, pois, eu só coloquei mesmo para ter base. Você precisa instalar o FontAwesome: https://ajuda.forumeiros.com/t103208-tutorial-instalacao-do-font-awesome-no-forum só assim, a cog vai aparecer ali.

Vinicius Reis escreveu:ficou legal!

porém está aparecendo COF em cima deles olha:
http://prntscr.com/dfmraw

- E não teria como deixar o designer um pouco mais bonito, tals como uma linha branca em cima, e uma preta em baixo, como por exemplo: http://prntscr.com/dfmtrr se possivel deixar o mais proximo disto.


Eu adoraria também se possivel deixar a legenda do fórum (trancado, fixo e tals) lá junto com ele (junto com o title) e tb retirar a opção de criar novos tópicos quando estiver vendo um fórum! A opção de criar um novo tópico quero q fique apenas na lista de tópicos.

---

Legenda: tópico fixo; eu quero que a cor dele fique diferente e o ícone dele este: olha como ficaria caso fosse fixo: http://prntscr.com/dfmvgd

E adoraria que tivesse a função de abrir um mine menu em dropdonw assim: http://prntscr.com/dfmvzg

caso o tópico fosse fixo e trancado: http://prntscr.com/dfmw82 ícone do cadeado: é óbviu q o tamanho dele vai ser menor.

se o tópico for apenas trancado: http://prntscr.com/dfmwsz

ressaltando que se for possivel colocar isto ai terá que tirar o que já tem no meu fórum (que aparece nos tópico) como: http://prntscr.com/dfmxj1

Um problema: ele infelizmente está aparecendo na visualização de tópicos, dentro de uma sessão, olhe: http://prntscr.com/dfmxye


Obrigado.

^^

Olá!

Instale o Font Aewsome, e nos envie o código que você tem para os efeitos que mencionou. Deixe-nos saber também, que tipo de modificação você está encontrando como um problema.

eu n tenho nenhum código para esses efeitos!!! Estou instalando...

Troca aquele script que te passei por este:

Código:

$(document).ready(function () {
    jQuery('h1.page-title:eq(0)')
        .prepend('<span class="ShekCog" style="cursor: pointer;"><i class="fa fa-cogs"></i> COF</span>')
        .after('<div class="OpenCrowleyUP" style="display: none;width: 20%;background: #000;padding: 10px;border-radius: 10px;"><span class="linkGET"></span></div>');
 
    var getLinkShek = $('div.pathname-box a.nav:eq(1)').attr('href');
    $('span.linkGET').before('<a href="' + getLinkShek + '"> <i class="fa fa-star" style="color: gold;"></i> Voltar ao fórum</a>');
 
    $("span.ShekCog").click(function () {
        var ShekMenu = $('div.OpenCrowleyUP')
        ShekMenu.css("display", ShekMenu.is(':visible') ? "none" : "block");
    });
});

Este tem a mãozinha do Kyo Panda

Volto a repetir, você precisa instalar o Font Awesome, ou ao invés dos ícones, colocar a imagem que você quiser. Para isso, deverá no código script que passei, procurar por:

Código:

<i class="fa fa-star" style="color: gold;"></i>

E substituir por:

Código:

<img src='URL_DA_IMAGEM_DA_ESTRELA' />

E também localizar por:

Código:

<i class="fa fa-cogs"></i>

E substituir pela imagem da roda dentada:

Código:

<img src='URL_DA_IMAGEM_DA_RODA_DENTADA' />

Isso só retirou o COF que estava aparecendo! Coloquei as imagens e tals e mesmo assim não aparece-as e também o designer continua meio tosco.

É meus ups estão sendo apagados!!!! UP

como eu acho mais icones?

up

UP

Troque o Javascript por esse:

Código:

/* globals jQuery */

(function($) {
    'use strict';

    $(function() {
        var $getLinkShek = $('div.pathname-box a.nav:eq(1)');
        var linkShek;

        if ($getLinkShek.length) {
            linkShek = {
                href: $getLinkShek.attr('href'),
                label: 'Voltar à lista de tópicos da seção ' + $getLinkShek.text(),
            };
        } else {
            linkShek = {
                href: '/forum',
                label: 'Voltar à página inicial',
            };
        }

        $('h1.page-title:eq(0)')
            .prepend([
                '<span class="ShekCog">',
                '  <img src="http://i.imgur.com/Yy122xt.png " />',
                '</span>',
            ].join('\n'))
            .after([
                '<div class="OpenCrowleyUP">',
                '  <div class="OpenCrowleyUP-title">TÓPICO</div>',
                '  <a href="' + linkShek.href + '">',
                '    <img src="http://i.imgur.com/b9O0Pkh.png" /> ' + linkShek.label,
                '  </a>',
                '</div>',
            ].join('\n'));

        var ShekMenu = $('div.OpenCrowleyUP');

        $('span.ShekCog').on('click', function() {
            ShekMenu.css('display', ShekMenu.is(':visible') ? 'none' : 'block');
        });
    });
}(jQuery));


E adicione ao CSS:

Código:

/** BEGIN Shek Topic Title */

.ShekCog {
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  margin: 3px;
  width: 20px;
  background: #2b2b2b;
  padding: 3px;
  border-radius: 3px;
}

.ShekCog img {
  max-height: 100%;
  max-width: 100%;
}

div.OpenCrowleyUP {
  display: none;
  width: 20%;
  background: #2b2b2b;
  padding: 10px;
  border-radius: 10px;
  position: absolute;
}

div.OpenCrowleyUP a {
  color: #c2c2da;
  font-size: 12px;
}

div.OpenCrowleyUP img {
  vertical-align: middle;
}

h1.page-title a {
  color: #c2c2da;
  font-size: 18px;
  margin-left: 0;
}

/** END Shek Topic Title */

Créditos ao @Shek Crowley pelo script original. Eu só dei um tapa no mesmo.

Obrigado.

Não teria como deixar a legenda de trancado, ou fixo ali também? E obviamente retira-la do lugar onde fica! Exemplo: clique aqui
e caso o tópico fosse fixo, colocar está imagem:


Obrigado.

Troque:

Código:

/* globals jQuery */

(function($) {
    'use strict';

    $(function() {
        var $getLinkShek = $('div.pathname-box a.nav:eq(1)');
        var linkShek;

        if ($getLinkShek.length) {
            linkShek = {
                href: $getLinkShek.attr('href'),
                label: 'Voltar à lista de tópicos da seção ' + $getLinkShek.text(),
                type: 'topic',
            };
        } else {
            linkShek = {
                href: '/forum',
                label: 'Voltar à página inicial',
                type: 'other',
            };
        }

        $('h1.page-title:eq(0)')
            .prepend([
                '<span class="ShekCog">',
                '  <img src="http://i.imgur.com/Yy122xt.png " />',
                '</span>',
            ].join('\n'))
            .after([
                '<div class="OpenCrowleyUP">',
                '  <div class="OpenCrowleyUP-title">TÓPICO</div>',
                '  <a href="' + linkShek.href + '">',
                '    <img src="http://i.imgur.com/b9O0Pkh.png" /> ' + linkShek.label,
                '  </a>',
                '</div>',
            ].join('\n'));

        var $ShekMenu = $('div.OpenCrowleyUP');

        if (linkShek.type === 'topic') {
            $ShekMenu
                .find('+ .topic-actions > .buttons')
                .insertAfter('.ShekCog');
        }

        $('span.ShekCog').on('click', function() {
            $ShekMenu.css('display', $ShekMenu.is(':visible') ? 'none' : 'block');
        });
    });
}(jQuery));


Código:

/** BEGIN Shek Topic Title */

.ShekCog {
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  margin: 3px;
  width: 20px;
  background: #2b2b2b;
  padding: 3px;
  border-radius: 3px;
}

.ShekCog img {
  max-height: 100%;
  max-width: 100%;
}

div.OpenCrowleyUP {
  display: none;
  width: 20%;
  background: #2b2b2b;
  padding: 10px;
  border-radius: 10px;
  position: absolute;
}

div.OpenCrowleyUP a {
  color: #c2c2da;
  font-size: 12px;
}

div.OpenCrowleyUP img {
  vertical-align: middle;
}

h1.page-title a {
  color: #c2c2da;
  font-size: 18px;
  margin-left: 0 !important;
}

h1.page-title .buttons {
  float: none;
  display: inline-block;
  vertical-align: middle;
  font-size: 0;
}

/** END Shek Topic Title */

Ah muito obrigado, por me dar suporte!

É possível deixar o ícone de fixo também, pois o do fixo não deu resultado.

Obrigado novamente.

Poderia nos passar o link para um tópico com este ícone de fixo?

aqui tópico aberto e fixo
aqui tópico fechado e fixo.

Obrigado.

Faltou linkar um tópico no seu fórum com esses atributos, para fazermos os testes.

Ok,

Este é um tópico fixo: aqui

E este é um tópico de anúncio: aqui

Quero que ambos; anúncio e fixo, fique com aquele ícone.

Obrigado.

Agora entendi o que deseja. Não será possível. :/

O ícone exibido é o mesmo que o Forumeiros exibe nos tópicos e, por padrão, existe apenas um ícone por tópico. Como o de bloqueio sobrescreve os demais, não há como capturarmos essa informação.

Ah sim, obrigado.

Obrigado pelo suporte que tem dado neste e nos meus outros tópicos.

Que isso, champs. Estamos aê para isso. ^-^v

---

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para "Questões resolvidas".