Como colocar um um sistema de pontos com curtidas de um certo post?
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Como colocar um um sistema de pontos com curtidas de um certo post?
Olá pessoas, estou aqui mais uma vez com outra dúvida. Eu queria saber se tem como colocar um sistema de pontos com curtidas de um post, exemplo: Qualquer post do fórum inteiro ( tópicos e respostas ) teria um botão no canto superior direito chamado "ponto" e ao lado o número de vezes que ele foi clicado, assim dando ao membro criador do post, os pontos de acordo com o número de vezes que o botão foi clicado. Tem como? Eu uso o PHPBB3
Última edição por Rayner em 04.05.15 23:12, editado 1 vez(es)
Re: Como colocar um um sistema de pontos com curtidas de um certo post?
Olá.
Substituindo o sistema de reputação certo? irei passar um código feito pela BestSkins editado por meu fórum.
Aceda: Painel de controle Visualização Cores Folha de estilo CSS.
No final de seu CSS, cole o seguinte código:
2º - Código JavaScript a ser utilizado:
Aceda: Painel de controle Módulos HTML & JAVASCRIPT Gestão dos códigos JavaScript Criar um novo JavaScript
Código JavaScript:
Tópico movido de 'Outras questões' para 'Questões sobre JavaScript & jQuery'
Substituindo o sistema de reputação certo? irei passar um código feito pela BestSkins editado por meu fórum.
Aceda: Painel de controle Visualização Cores Folha de estilo CSS.
No final de seu CSS, cole o seguinte código:
- Código:
/*******CURTIR NO POST********/
#rep_post .reput_vote {
background-color: #daedfb;
color: #666;
-khtml-user-select: none;
-moz-transition: all,0.15s;
-moz-user-select: none;
-ms-user-select: none;
-o-transition: all,0.15s;
-webkit-touch-callout: none;
-webkit-transition: all,0.15s;
-webkit-user-select: none;
background: #f0f0f0 url(https://cdn1.iconfinder.com/data/icons/social-media-13/24/Like-16.png) no-repeat 6px center;
background-size: 12px;
clear: both;
color: #666;
cursor: pointer;
display: table;
font-size: 11px;
font-weight: 400;
line-height: 18px;
margin: 5px;
padding: 3px 5px 3px 25px;
text-align: right;
transition: all,0.15s;
}
.reput_vote.zero {
background-color: #6a6a6a;
}
.BS_like:hover {
background-color: #daedfb;
color: #666;
}
.BS_like {
-khtml-user-select: none;
-moz-transition: all,0.15s;
-moz-user-select: none;
-ms-user-select: none;
-o-transition: all,0.15s;
-webkit-touch-callout: none;
-webkit-transition: all,0.15s;
-webkit-user-select: none;
background: #f0f0f0 url(https://cdn1.iconfinder.com/data/icons/social-media-13/24/Like-16.png) no-repeat 6px center;
background-size: 12px;
clear: both;
color: #666;
cursor: pointer;
display: table;
font-size: 11px;
font-weight: 400;
line-height: 18px;
margin: 5px;
padding: 3px 5px 3px 25px;
text-align: right;
transition: all,0.15s;
user-select: none;
}
.BS_like:before {
content: "Curtir";
}
#rep_post .bs_inline {
list-style: none;
}
.BS_like:hover {
background-color: #daedfb;
color: #666;
}
#rep_post {white-space: nowrap;margin: 6px 4px;float: right;}
#rep_post .bs_inline {list-style: none;}
#rep_post .bs_inline > li {display: inline-block;margin: 0 3px;}
#rep_post .bs_inline > li:first-child {margin-left: 0;}
#rep_post .bs_inline img {display: none;}
#rep_post span img {cursor: pointer;}
.reput_vote.positive {background-color: #8db13e;}
.reput_vote.zero {background-color: #6a6a6a;}
#rep_post .reput_vote:before {
content: "Curtidas ";
}
/***********FIM CURTIR************/
2º - Código JavaScript a ser utilizado:
Aceda: Painel de controle Módulos HTML & JAVASCRIPT Gestão dos códigos JavaScript Criar um novo JavaScript
Título Nesta opção, será o título a sua escolha. |
Investimento Nesta opção, iremos marcar: Nos tópicos. |
Código JavaScript Nesta opção, iremos usar o código JavaScript abaixo. |
- Código:
/*
* Código: IPB Like System.
* Data de criação: 18/07/2014.
* Atualização: 18/11/2014.
* Autor: Daemon.
* Versão: 1.1.
* Inspirado: IPB.
* Acesse: http://bestskins.net.
* Não distribuir, ou remover os créditos do autor.
*/
function bestskins_ls() {
for(var x = $('.vote'), i = 0, vote; (vote = x[i++]); ) {
var count = 0,
qtd = 0,
barra = $('.vote-bar', vote)[0],
botao = $('.vote-button', vote)[0];
if (barra) {
var numbarra = barra.title.match(/\d+/g);
qtd = Math.round(parseInt( numbarra[1] ) * parseInt( numbarra[0] )) / 100;
}
//Imagem de reputação
var reputation_UP = 'http://www.agrotube.com.br/images/seta_baixo.png';
botao = botao ? '<li><span onclick="bestskinsVoto(\'' + botao.firstChild.href + '\',this);" class="BS_like"><img src="' + reputation_UP + '" alt="+" class="rep_up"></span></li>' : '<li style="display: none;"><img src="' + reputation_UP + '" alt="+" class="rep_up"></li>';
var numrep = '<li>' + (qtd == 0 ? '<span class="reput_vote zero">' + qtd + '</span>' : '<span class="reput_vote positive">' + qtd + '</span>') + '</li>';
var htmlFinal =
'<div class="rep_bar clearfix" id="rep_post">' +
' <ul class="bs_inline">' + botao + numrep + '</ul>' +
'</div>';
$('.postfoot', vote.parentNode.parentNode.parentNode.parentNode).before( htmlFinal );
}
x.remove();
};
function bestskinsVoto(b,a) {
a.onclick = '#';
$.get(b, function() {
a.parentNode.style.display = 'none';
var verify = a.parentNode.nextSibling.firstChild.innerHTML;
if(verify == 0) {
a.parentNode.nextSibling.firstChild.classList.remove('zero'),
a.parentNode.nextSibling.firstChild.classList.add('positive');
}
var c = a.parentNode.nextSibling.firstChild, b = parseInt(/\d+/.exec(c.innerHTML)[0])+1;
c.innerHTML = c.innerHTML.replace(/\d+/,b);
});
};
if (document.readyState === 'complete') {
bestskins_ls();
} else {
document.addEventListener('DOMContentLoaded', function() {
bestskins_ls();
});
}
Tópico movido de 'Outras questões' para 'Questões sobre JavaScript & jQuery'
Resposta
Shaman escreveu:Olá.
Substituindo o sistema de reputação certo? irei passar um código feito pela BestSkins editado por meu fórum.
Aceda: Painel de controle Visualização Cores Folha de estilo CSS.
No final de seu CSS, cole o seguinte código:
- Código:
/*******CURTIR NO POST********/
#rep_post .reput_vote {
background-color: #daedfb;
color: #666;
-khtml-user-select: none;
-moz-transition: all,0.15s;
-moz-user-select: none;
-ms-user-select: none;
-o-transition: all,0.15s;
-webkit-touch-callout: none;
-webkit-transition: all,0.15s;
-webkit-user-select: none;
background: #f0f0f0 url(https://cdn1.iconfinder.com/data/icons/social-media-13/24/Like-16.png) no-repeat 6px center;
background-size: 12px;
clear: both;
color: #666;
cursor: pointer;
display: table;
font-size: 11px;
font-weight: 400;
line-height: 18px;
margin: 5px;
padding: 3px 5px 3px 25px;
text-align: right;
transition: all,0.15s;
}
.reput_vote.zero {
background-color: #6a6a6a;
}
.BS_like:hover {
background-color: #daedfb;
color: #666;
}
.BS_like {
-khtml-user-select: none;
-moz-transition: all,0.15s;
-moz-user-select: none;
-ms-user-select: none;
-o-transition: all,0.15s;
-webkit-touch-callout: none;
-webkit-transition: all,0.15s;
-webkit-user-select: none;
background: #f0f0f0 url(https://cdn1.iconfinder.com/data/icons/social-media-13/24/Like-16.png) no-repeat 6px center;
background-size: 12px;
clear: both;
color: #666;
cursor: pointer;
display: table;
font-size: 11px;
font-weight: 400;
line-height: 18px;
margin: 5px;
padding: 3px 5px 3px 25px;
text-align: right;
transition: all,0.15s;
user-select: none;
}
.BS_like:before {
content: "Curtir";
}
#rep_post .bs_inline {
list-style: none;
}
.BS_like:hover {
background-color: #daedfb;
color: #666;
}
#rep_post {white-space: nowrap;margin: 6px 4px;float: right;}
#rep_post .bs_inline {list-style: none;}
#rep_post .bs_inline > li {display: inline-block;margin: 0 3px;}
#rep_post .bs_inline > li:first-child {margin-left: 0;}
#rep_post .bs_inline img {display: none;}
#rep_post span img {cursor: pointer;}
.reput_vote.positive {background-color: #8db13e;}
.reput_vote.zero {background-color: #6a6a6a;}
#rep_post .reput_vote:before {
content: "Curtidas ";
}
/***********FIM CURTIR************/
2º - Código JavaScript a ser utilizado:
Aceda: Painel de controle Módulos HTML & JAVASCRIPT Gestão dos códigos JavaScript Criar um novo JavaScript
Título Nesta opção, será o título a sua escolha.
Investimento Nesta opção, iremos marcar: Nos tópicos. Código JavaScript:
Código JavaScript Nesta opção, iremos usar o código JavaScript abaixo.
- Código:
/*
* Código: IPB Like System.
* Data de criação: 18/07/2014.
* Atualização: 18/11/2014.
* Autor: Daemon.
* Versão: 1.1.
* Inspirado: IPB.
* Acesse: http://bestskins.net.
* Não distribuir, ou remover os créditos do autor.
*/
function bestskins_ls() {
for(var x = $('.vote'), i = 0, vote; (vote = x[i++]); ) {
var count = 0,
qtd = 0,
barra = $('.vote-bar', vote)[0],
botao = $('.vote-button', vote)[0];
if (barra) {
var numbarra = barra.title.match(/\d+/g);
qtd = Math.round(parseInt( numbarra[1] ) * parseInt( numbarra[0] )) / 100;
}
//Imagem de reputação
var reputation_UP = 'http://www.agrotube.com.br/images/seta_baixo.png';
botao = botao ? '<li><span onclick="bestskinsVoto(\'' + botao.firstChild.href + '\',this);" class="BS_like"><img src="' + reputation_UP + '" alt="+" class="rep_up"></span></li>' : '<li style="display: none;"><img src="' + reputation_UP + '" alt="+" class="rep_up"></li>';
var numrep = '<li>' + (qtd == 0 ? '<span class="reput_vote zero">' + qtd + '</span>' : '<span class="reput_vote positive">' + qtd + '</span>') + '</li>';
var htmlFinal =
'<div class="rep_bar clearfix" id="rep_post">' +
' <ul class="bs_inline">' + botao + numrep + '</ul>' +
'</div>';
$('.postfoot', vote.parentNode.parentNode.parentNode.parentNode).before( htmlFinal );
}
x.remove();
};
function bestskinsVoto(b,a) {
a.onclick = '#';
$.get(b, function() {
a.parentNode.style.display = 'none';
var verify = a.parentNode.nextSibling.firstChild.innerHTML;
if(verify == 0) {
a.parentNode.nextSibling.firstChild.classList.remove('zero'),
a.parentNode.nextSibling.firstChild.classList.add('positive');
}
var c = a.parentNode.nextSibling.firstChild, b = parseInt(/\d+/.exec(c.innerHTML)[0])+1;
c.innerHTML = c.innerHTML.replace(/\d+/,b);
});
};
if (document.readyState === 'complete') {
bestskins_ls();
} else {
document.addEventListener('DOMContentLoaded', function() {
bestskins_ls();
});
}
Tópico movido de 'Outras questões' para 'Questões sobre JavaScript & jQuery'
Não funcionou
Re: Como colocar um um sistema de pontos com curtidas de um certo post?
Já está ativado, é pra ficar aparecendo o botão "Agradecer" mesmo? Com isso eu posso clicar e dar pontos ao dono do post?
Re: Como colocar um um sistema de pontos com curtidas de um certo post?
Saudações,
Sim amigo.
Mas leia também este tópico:
https://ajuda.forumeiros.com/t13951-
Até mais.
Sennior
Sim amigo.
Mas leia também este tópico:
https://ajuda.forumeiros.com/t13951-
Até mais.
Sennior
Re: Como colocar um um sistema de pontos com curtidas de um certo post?
Eu fiz tudo o que o tutorial mandou mas ta a mesma coisa '-' Os sinais de (+) e (-) não aparecem também.
Re: Como colocar um um sistema de pontos com curtidas de um certo post?
Troque o JS por este:
Até mais!
- Código:
/*
* Código: IPB Like System.
* Data de criação: 18/07/2014.
* Atualização: 18/11/2014.
* Autor: Daemon.
* Versão: 1.1.
* Inspirado: IPB.
* Acesse: http://bestskins.net.
* Não distribuir, ou remover os créditos do autor.
*/
function bestskins_ls() {
for(var x = $('.vote'), i = 0, vote; (vote = x[i++]); ) {
var count = 0,
qtd = 0,
barra = $('.vote-bar', vote)[0],
botao = $('.vote-button', vote)[0];
if (barra) {
var numbarra = barra.title.match(/\d+/g);
qtd = Math.round(parseInt( numbarra[1] ) * parseInt( numbarra[0] )) / 100;
}
//Imagem de reputação
var reputation_UP = 'http://www.agrotube.com.br/images/seta_baixo.png';
botao = botao ? '<li><span onclick="bestskinsVoto(\'' + botao.firstChild.href + '\',this);" class="BS_like"><img src="' + reputation_UP + '" alt="+" class="rep_up"></span></li>' : '<li style="display: none;"><img src="' + reputation_UP + '" alt="+" class="rep_up"></li>';
var numrep = '<li>' + (qtd == 0 ? '<span class="reput_vote zero">' + qtd + '</span>' : '<span class="reput_vote positive">' + qtd + '</span>') + '</li>';
var htmlFinal =
'<div class="rep_bar clearfix" id="rep_post">' +
' <ul class="bs_inline">' + botao + numrep + '</ul>' +
'</div>';
$('.postbody', vote.parentNode.parentNode.parentNode).append( htmlFinal );
}
x.remove();
};
function bestskinsVoto(b,a) {
a.onclick = '#';
$.get(b, function() {
a.parentNode.style.display = 'none';
var verify = a.parentNode.nextSibling.firstChild.innerHTML;
if(verify == 0) {
a.parentNode.nextSibling.firstChild.classList.remove('zero'),
a.parentNode.nextSibling.firstChild.classList.add('positive');
}
var c = a.parentNode.nextSibling.firstChild, b = parseInt(/\d+/.exec(c.innerHTML)[0])+1;
c.innerHTML = c.innerHTML.replace(/\d+/,b);
});
};
if (document.readyState === 'complete') {
bestskins_ls();
} else {
document.addEventListener('DOMContentLoaded', function() {
bestskins_ls();
});
}
Até mais!
Re: Como colocar um um sistema de pontos com curtidas de um certo post?
Aeeeehhhh, agora funcionou! Se tivesse como descurtir também seria melhor ainda Obrigado!
Re: Como colocar um um sistema de pontos com curtidas de um certo post?
Olá amigo, 1 dúvida por tópico ok? Até mais!
Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para Questões resolvidas. |
Tópicos semelhantes
» Como colocar certo
» Como colocar ultimos post !
» Colocar o menu no lugar certo
» Colocar imagem em certo sítio
» Colocar em certo sítio botão de reputação
» Como colocar ultimos post !
» Colocar o menu no lugar certo
» Colocar imagem em certo sítio
» Colocar em certo sítio botão de reputação
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos