Staffer Group BR™

Fórum interativo totalmente gratuito!


 VisualizaçõesPermissão deste fórum:
Não podes responder a tópicos


CurtirDiretório deste fórum:
Fóruns » Principal »  » Tutoriais » Tutoriais sobre programação

#1
 D'Leandro™

D'Leandro™
Fundador

Widget "Like/Tweet/+1" para tópicos


PunBB PhpBB2 PhpBB3 Invision

PhpBB3 & Invision
- -> Código JS <- -
Adicionar novo Códig
Em todas as paginas
Código:
jQuery(document).ready(function(){jQuery('.buttons').after('<p><iframe src="http://www.facebook.com/plugins/like.php?locale=pt_BR&href=http://www.shift.forumactif.com;send=false&layout=box_count&width=60&show_faces=false&action=like&colorscheme=light&font&height=60" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:60px; height:60px;" allowtransparency="true"></iframe><iframe src="http://platform0.twitter.com/widgets/tweet_button.html?_=1311006182541&count=vertical&id=twitter_tweet_button_0&lang=en&original_referer=http://www.shift.forumactif.com;text=Shiftactif;url=http://www.shift.forumactif.com" allowtransparency="true" frameborder="0" scrolling="no" class="twitter-share-button twitter-count-vertical" style="width: 55px; height: 62px; " title="Twitter For Websites: Tweet Button"></iframe><g:plusone size="tall"></g:plusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script></p>')});
- -> Modificações no código java script <- -
[Tutorial] Widget "Like/Tweet/+1" para tópicos 71622725

Verde: Classe ao qual o botão vai aparecer. Ou seja, determinando a classe, o botão share do Twitter vai aparecer onde tem uma classe .buttons.

Como observamos no termo em verde, você estará atribuíndo o botão diretamente a classe "Buttons", se desejar colocar nos tópicos, você precisa colocar p.author e na página JS, marque em Investimento a opção Nos tópicos (Nos temas) e confirme a mudança.

Vermelho: Deverá colocar o link de seu fórum, incluindo http:// e www.
O Código acima ja está preenchido, altere as onformações de acordo com seu forum!

PunBB
- -> Template <- -
Painel de controle Seta Azul Visualização Seta Azul Templates Seta Azul Geral Seta Azul viewtopic_body
Encontre este código
Código:
<div class="post-options">
                    {postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}

Altere por este
Código:
<div class="post-options">
{postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}
<br /><iframe src="http://www.facebook.com/plugins/like.php?locale=pt_BR&href=ENDEREÇO_DO_FORUM;send=false&layout=box_count&width=60&show_faces=false&action=like&colorscheme=light&font&height=60" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:60px; height:60px;" allowtransparency="true"></iframe><iframe src="http://platform0.twitter.com/widgets/tweet_button.html?_=1311006182541&count=vertical&id=twitter_tweet_button_0&lang=en&original_referer=ENDEREÇO_DO_FORUM;text=NOME_DO_FORUM;url=ENDEREÇO_DO_FORUM" allowtransparency="true" frameborder="0" scrolling="no" class="twitter-share-button twitter-count-vertical" style="width: 55px; height: 62px; " title="Twitter For Websites: Tweet Button"></iframe><g:plusone size="tall"></g:plusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script></br>

- -> Modigicando <- -
https://2img.net/r/ihimizer/img201/3937/86219223.png
Vermelho: Deverá colocar o link de seu fórum, incluindo http:// e www.
Verde: Deverá colocar o nome de seu fórum.

PhpBB2
- -> Template <- -
Painel de controle Seta Azul Visualização Seta Azul Templates Seta Azul Geral Seta Azul viewtopic_body
Encontre este código
Código:
<table border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td valign="middle">
                  {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field --> {postrow.displayed.ONLINE_IMG}
              </td>
            </tr>
        </table>

Altere por este
Código:
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="middle">
{postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field --> {postrow.displayed.ONLINE_IMG}<br /><iframe src="http://www.facebook.com/plugins/like.php?locale=pt_BR&href=ENDEREÇO_DO_FORUM;send=false&layout=box_count&width=60&show_faces=false&action=like&colorscheme=light&font&height=60" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:60px; height:60px;" allowtransparency="true"></iframe><iframe src="http://platform0.twitter.com/widgets/tweet_button.html?_=1311006182541&count=vertical&id=twitter_tweet_button_0&lang=en&original_referer=ENDEREÇO_DO_FORUM;text=NOME_DO_FORUM;url=ENDEREÇO_DO_FORUM" allowtransparency="true" frameborder="0" scrolling="no" class="twitter-share-button twitter-count-vertical" style="width: 55px; height: 62px; " title="Twitter For Websites: Tweet Button"></iframe><g:plusone size="tall"></g:plusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script></br>
</td>
</tr>
</table>
Substitua NOME_DO_FORUM Seta Azul Pelo Nome do seu forum!
Substitua ENDEREÇO_DO_FORUM Seta Azul Pelo URL do seu forum, Incluindo http:// e www.


- -> Resultado Final <- -
[Tutorial] Widget "Like/Tweet/+1" para tópicos 71506852


Desenvolvido por Sasuky! | © Fórum dos Fóruns
Editado e Postado por 2012 © Staffer Group BR™

#2
 'Fusion

'Fusion
Membro
Salve D'Leandro mt bom

#3
 gui8920

gui8920
Membro
Muito bom mesmo!

#4
 Conteúdo patrocinado