Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais


Pesquisa de Satisfação
Queremos saber a sua opinião sobre os nossos serviços. Clique nesta vinheta e preencha este inquérito.

Login

Esqueci minha senha

Perdi minha senha!
Obter senha

Nota: use se tiver perdido acesso ao seu painel de controle.

Magazine 2016
Participe da pesquisa de satisfação 2016 e dê sua opinião sobre os diversos serviços de Forumeiros.
Parceiros Forumeiros
Quem está conectado
159 usuários online :: 3 usuários cadastrados, Nenhum Invisível e 156 Visitantes :: 2 Motores de busca

Allenkar_, João Jpr, jpgalettoneh

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

Personalização do perfil

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

Resolvido Personalização do perfil

Mensagem por Karadruz DL em Qua 2 Nov 2016 - 17:44

Detalhes da questão


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

Descrição


Estou procurando uma forma de reproduzir isso em perfis dos usuários, mas não encontro em nem um lugar ( http://orig04.deviantart.net/5bff/f/2016/305/0/1/modelo_perfil_by_diginitrix001-damy8p5.png ). O perfil do usuário é carregado completamente na primeira parte da imagem antes de se comprimir na segunda parte da imagem, quando a compressão é feita, é possível ver os botões abas do perfil em cima, e cada aba ali mostra o que o perfil do usuário tem a mostrar, isso polpa tempo em ter que abrir o link do perfil do usuário para ver as informações.

Obs, link do fórum estrangeiro de onde tem esse sistema: http://digimonadventure-rol.superforo.net/

Karadruz DL
Nível 4

Masculino
Inscrito dia : 28/10/2016
Mensagens : 31
Pontos Ativos : 132

http://digimonviverpg.forumeiros.com

Resolvido Re: Personalização do perfil

Mensagem por Kyo Panda em Qua 2 Nov 2016 - 20:03

Olá,

  • Vá em Painel de controleMódulosHTML & JavaScriptGestão dos códigos JavaScriptsCriar um novo JavaScript e adicione esse código com Investimento em Nos tópicos:
    Código:
    ; (function ($) {
        'use strict';

        var items, list, link;

        items = [{
            class: 'postprofile-tab-avatar',
            text: 'Avatar',
            index: 0
        }, {
            class: 'postprofile-tab-ranking',
            text: 'Ranking',
            index: 1
        },  {
            class: 'postprofile-tab-info',
            text: 'Info',
            index: 3
        },  {
            class: 'postprofile-tab-contact',
            text: 'Contato',
            index: 5
        }];

        list = '';

        $.each(items, function (key, item) {
            link = $('<a>', {
                'href': 'javascript:void(0)',
                'text': item.text
            });

            list += $('<li>', {
                'data-index': item.index,
                'class': item.class,
                'html': link.prop('outerHTML')
            }).prop('outerHTML');
        });

        $(function () {
            $('<ul>', {
                class: 'postprofile-tabs',
                html: list
            }).prependTo('.postprofile');

            $(document, '.postprofile-tabs a').on('click', function (event) {
                var self, index, tabs, visible;

                self = $(event.target);
                index = self.parent().data('index');
                tabs = self.closest('ul').nextAll('dl').eq(0);
                visible = tabs.children(':visible');

                if (visible.index() === index) {
                    return;
                }

                visible.animate({
                    'margin-left': '-200px',
                    'opacity': '0'
                }, 'fast', function () {
                    visible.css('display', 'none');
                    tabs
                        .children()
                        .eq(index)
                        .css('display', 'block')
                        .animate({
                            'margin-left': '0px',
                            'opacity': '1'
                        });
                });
            });
        });
    }) (jQuery);
  • Vá em Painel de controleVisualizaçãoImagens e CoresCoresFolha de estilo CSS e adicione o seguinte código ao final da caixa de texto:
    Código:
    .postprofile {
        overflow: hidden;
        min-height: 220px;
    }

    .postprofile > dl > dt {
        display: block;
        opacity: 1;
        margin-left: 0;
    }

    .postprofile > dl > dd {
        display: none;
        opacity: 0;
        margin-left: -200px;
    }

    .postprofile-tabs {
        list-style: none;
        margin: 0 0 10px;
        padding: 0;
    }

    .postprofile-tabs li {
        display: inline-block;
    }

    .postprofile-tabs a {
        padding: 5px;
        background-color: #E68A00;
        display: block;
        margin: 1px;
    }

    .postprofile-tabs a:hover,
    .postprofile-tabs a:active {
        background-color: #926521;
        color: #fff;
        text-decoration: none;
    }


Eu o criei baseado nas informações existentes nos perfis do seu fórum. Isso quer dizer que se for adicionar algum campo de perfil futuramente, alguns ajustes terão que ser feitos.

Contente

Kyo Panda
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 1927
Pontos Ativos : 4610

http://ajuda.forumeiros.com

Resolvido Re: Personalização do perfil

Mensagem por Karadruz DL em Qua 2 Nov 2016 - 20:44

Cara ficou incrível! Muito obrigado, serio!

Quando eu adicionar algum campo novo de perfil eu posto aqui de volta, claro pedindo para algum Admin liberar esse tópico para poder escrever de novo antes
xD

Karadruz DL
Nível 4

Masculino
Inscrito dia : 28/10/2016
Mensagens : 31
Pontos Ativos : 132

http://digimonviverpg.forumeiros.com

Resolvido Re: Personalização do perfil

Mensagem por Cream em Qua 2 Nov 2016 - 22:43

Autor, não hesite em criar um novo tópico quando for fazer novas alterações, por enquanto daremos este como resolvido!
Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

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


Seta Respeite as Regras do fórum e conheça a nossa equipe staff e diretrizes do FdF!
Seta Conheça a nossa Lista de tutoriais e nossa Lista de FAQs.
Seta Perdeu a senha de administração? Veja o que fazer.
Seta Ferramentas do Administrador.

Cream
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 15/12/2010
Mensagens : 8482
Pontos Ativos : 13768

http://ajuda.forumeiros.com

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum