Modificar logo dos títulos dos tópicos

4 participantes

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 25.11.16 14:31

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: Modificar logo dos títulos dos tópicos 51e609c44a894785a839adc9d8e2a668

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.


Última edição por Vinicius Reis em 29.12.16 1:30, editado 1 vez(es)
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 27.11.16 22:57

UP
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 29.11.16 20:22

UP
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 30.11.16 2:25

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!
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 05.12.16 11:53

UP
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Principal Contribuidor
  • 0

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Shek 05.12.16 14:21

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

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 05.12.16 14:59

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: Modificar logo dos títulos dos tópicos Postit 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: Modificar logo dos títulos dos tópicos Cadenas é ó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.


Última edição por Vinicius Reis em 05.12.16 15:12, editado 1 vez(es)
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Shek 05.12.16 15:07

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

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 05.12.16 15:13

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: Modificar logo dos títulos dos tópicos Postit 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: Modificar logo dos títulos dos tópicos Cadenas é ó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.

^^
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Shek 05.12.16 15:36

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

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 05.12.16 15:46

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

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Shek 06.12.16 13:31

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

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' />
Shek

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 06.12.16 21:38

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.
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 14.12.16 17:07

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

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por minegomes 21.12.16 5:22

como eu acho mais icones?
minegomes

minegomes
Novo Membro

Membro desde : 21/12/2016
Mensagens : 3
Pontos : 5

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 21.12.16 19:30

up
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 23.12.16 17:08

UP
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

  • 0

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Kyo Panda 23.12.16 22:51

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.
Kyo Panda

Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 24.12.16 1:52

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:Modificar logo dos títulos dos tópicos Postit


Obrigado.

Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Kyo Panda 24.12.16 9:12

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 */
Kyo Panda

Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 24.12.16 17:47

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.
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

  • 0

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Kyo Panda 24.12.16 22:20

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

Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 24.12.16 23:25

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

Obrigado.
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Kyo Panda 28.12.16 10:25

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

Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 28.12.16 17:44

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.
Vinicius Reis

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Kyo Panda 29.12.16 0:44

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.
Kyo Panda

Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Vinicius Reis 29.12.16 1:29

Ah sim, obrigado.

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

Vinicius Reis
****

Membro desde : 22/04/2016
Mensagens : 200
Pontos : 274

http://atelier262.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Modificar logo dos títulos dos tópicos

Mensagem por Kyo Panda 29.12.16 11:26

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

---

Modificar logo dos títulos dos tópicos Symbol10 Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para "Questões resolvidas".
Kyo Panda

Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos