Adicionar share no fórum

Item: Adicionar share no fórum
Rating: 1

por Dyana Dark 05.08.11 18:04

Qual é minha questão:
Como coloco esse widget desse site no meu fórum? quando se passa o mouse por cima a imagem levanta

https://2img.net/r/ihimizer/img546/152/semttuloqe.png

esse é o link do fórum: http://sitiomarado.forumeiros.com/

Medidas que eu tomei para corrigir o problema:
nenhuma

Imagens do meu problema:
nenhuma

Endereço do meu fórum:

Versão do meu fórum:
PHPBB3

por Consolado 05.08.11 18:12

Olá,

Leia o conteúdo do Spoiler querida:

Spoiler:

Adicionar share no fórum

Muitos administradores procuram meios de publicar os fóruns nas redes sociais, que se torna um trabalho muito difícil. Neste tutorial vamos instalar logo abaixo nos anúncios rolantes do fórum uma lista de compartilhamento de redes sociais.

--> Tutoriais, dicas e astúcias <--
Adicionar share no fórum

1º - Adicionar código CSS:
Painel de Controle -> Visualização -> Imagens e cores -> Cores -> Folha de estilo CSS

Na folha de estilo CSS, vamos adicionar o seguinte código:

.sharing-cl{
overflow:hidden;
margin:-20px 0 0 0;
padding:0;
list-style:none;
width:530px;
}
.sharing-cl a{
overflow:hidden;
width:75px;
height:20px;
float:left;
margin-right:5px;
text-indent:-200px;
background:url(https://sd-2.archive-host.com/membres/up/24071559914142709/tuto_partager/partager.png) no-repeat;
}
a.sh-su{background-position:-210px -40px;}
a.sh-feed{background-position:-70px -40px;}
a.sh-tweet{background-position:-140px -40px;}
a.sh-mail{background-position:0 -40px;}
a.sh-digg{background-position:-280px -40px;}
a.sh-face{
margin-right:0;
background-position:-350px -40px;
}
a.sh-mail:hover{background-position:0 1px;}
a.sh-feed:hover{background-position:-70px 1px;}
a.sh-tweet:hover{background-position:-140px 1px;}
a.sh-su:hover{background-position:-210px 1px;}
.sh-digg:hover{background-position:-280px 1px;}
a.sh-face:hover{
background-position:-350px 1px;
}
#text{
margin-top:5px;
font-weight:bold;
font-family:helvetica,arial,sans-serif;
}
#text a{
text-indent:0;
height:auto;
text-align:center;
font-size:11px;
padding-top:35px;
color:#999;
text-decoration:none;
}

2º - Código para cada versão:
Painel de controle -> Módulos -> HTML & JAVASCRIPT -> Gestão dos códigos Javascripts
Clique no botão "Criar uma nova página Javascript", Para que funcione corretamente, a opção "Investimento" deve estar marcada em "Todas as páginas".

No campo "Código JavaScript" vamos adicionar o código válido para cada versão:

Phpbb3

jQuery(document).ready(function(){var url=document.URL;jQuery("#page-header").append('<div class="h3">Partagez cette page :<hr></div><table cellspacing=0 cellpadding=0 width=100%><tr><td align=right valign=center style="margin-right:20px;"><ul class="sharing-cl" id="text"> <li><a target="_blank" class="sh-mail" href="mailto:?subject=Cette page devrait te plaire.&body='+url+'">Email</a></li> <li><a target="_blank" class="sh-feed" href=" /feed">RSS</a></li> <li><a target="_blank" class="sh-tweet" href="http://twitter.com/home?status=Mon ForumActif '+url+'" target="_blank" onclick="javascript:pageTracker._trackPageview (\'/outbound/twitter.com\');">Twitter</a></li> <li><a target="_blank" class="sh-face" href="https://www.facebook.com/share.php?u='+url+'">Facebook</a></li> <li><a target="_blank" class="sh-su" href="http://www.stumbleupon.com/submit?url='+url+'">Stumbleupon</a></li> <li><a target="_blank" class="sh-digg" href="http://digg.com/submit?phase=2&url='+url+'">Digg</a></li> </ul></td><td width="180" align="right" valign=center><fb:like href="'+url+'" layout="button_count" width="45"></fb:like></td></tr></table><br>')});

Phpbb2

jQuery(document).ready(function(){var url=document.URL;jQuery(".maintitle").append('<div class="h3">Partagez cette page :<hr></div><table cellspacing=0 cellpadding=0 width=100%><tr><td align=right valign=center style="margin-right:20px;"><ul class="sharing-cl" id="text"> <li><a target="_blank" class="sh-mail" href="mailto:?subject=Cette page devrait te plaire.&body='+url+'">Email</a></li> <li><a target="_blank" class="sh-feed" href=" /feed">RSS</a></li> <li><a target="_blank" class="sh-tweet" href="http://twitter.com/home?status=Mon ForumActif '+url+'" target="_blank" onclick="javascript:pageTracker._trackPageview (\'/outbound/twitter.com\');">Twitter</a></li> <li><a target="_blank" class="sh-face" href="https://www.facebook.com/share.php?u='+url+'">Facebook</a></li> <li><a target="_blank" class="sh-su" href="http://www.stumbleupon.com/submit?url='+url+'">Stumbleupon</a></li> <li><a target="_blank" class="sh-digg" href="http://digg.com/submit?phase=2&url='+url+'">Digg</a></li> </ul></td><td width="180" align="right" valign=center><fb:like href="'+url+'" layout="button_count" width="45"></fb:like></td></tr></table><br>')});

Punbb

jQuery(document).ready(function(){var url=document.URL;jQuery("#pun-head").append('<div class="h3">Partagez cette page :<hr></div><table cellspacing=0 cellpadding=0 width=100%><tr><td align=right valign=center style="margin-right:20px;"><ul class="sharing-cl" id="text"> <li><a target="_blank" class="sh-mail" href="mailto:?subject=Cette page devrait te plaire.&body='+url+'">Email</a></li> <li><a target="_blank" class="sh-feed" href=" /feed">RSS</a></li> <li><a target="_blank" class="sh-tweet" href="http://twitter.com/home?status=Mon ForumActif '+url+'" target="_blank" onclick="javascript:pageTracker._trackPageview (\'/outbound/twitter.com\');">Twitter</a></li> <li><a target="_blank" class="sh-face" href="https://www.facebook.com/share.php?u='+url+'">Facebook</a></li> <li><a target="_blank" class="sh-su" href="http://www.stumbleupon.com/submit?url='+url+'">Stumbleupon</a></li> <li><a target="_blank" class="sh-digg" href="http://digg.com/submit?phase=2&url='+url+'">Digg</a></li> </ul></td><td width="180" align="right" valign=center><fb:like href="'+url+'" layout="button_count" width="45"></fb:like></td></tr></table><br>')});

Invision

jQuery(document).ready(function(){var url=document.URL;jQuery("#navstrip").append('<div class="h3">Partagez cette page :<hr></div><table cellspacing=0 cellpadding=0 width=100%><tr><td align=right valign=center style="margin-right:20px;"><ul class="sharing-cl" id="text"> <li><a target="_blank" class="sh-mail" href="mailto:?subject=Cette page devrait te plaire.&body='+url+'">Email</a></li> <li><a target="_blank" class="sh-feed" href=" /feed">RSS</a></li> <li><a target="_blank" class="sh-tweet" href="http://twitter.com/home?status=Mon ForumActif '+url+'" target="_blank" onclick="javascript:pageTracker._trackPageview (\'/outbound/twitter.com\');">Twitter</a></li> <li><a target="_blank" class="sh-face" href="https://www.facebook.com/share.php?u='+url+'">Facebook</a></li> <li><a target="_blank" class="sh-su" href="http://www.stumbleupon.com/submit?url='+url+'">Stumbleupon</a></li> <li><a target="_blank" class="sh-digg" href="http://digg.com/submit?phase=2&url='+url+'">Digg</a></li> </ul></td><td width="180" align="right" valign=center><fb:like href="'+url+'" layout="button_count" width="45"></fb:like></td></tr></table><br>')});

Posso modificar as imagens?
Sim! Precione as teclas "CTRL + F" e cole o endereço da seguinte imagem:
https://sd-2.archive-host.com/membres/up/24071559914142709/tuto_partager/partager.png
Quando encontrar, poderá modificá-las coforme desejar.

Posso ativar essa função somente em todas as páginas?
Não. Nas folhas Javascript, na opção 'investimento', poderá escolher qualquer uma das opções desejadas, pode ser que funcione ou não conforme desejado.

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Adicionar share no fórum

Atenciosamente, Today Muito feliz

por Dyana Dark 05.08.11 18:25

Deu certo mais ficou em cima, como faço para deixar no fim da página?

por Mikáá 06.08.11 8:39

Olá!

Substitui-a o script que o Today lhe passou por este:

Código:: jQuery(document).ready(function() { var url=document.URL;jQuery("#main-content").append( '<div class="h3">Partagez cette page :<hr></div><table cellspacing=0 cellpadding=0 width=100%><tr><td align=right valign=center style="margin-right:20px;"><ul class="sharing-cl" id="text"> <li><a target="_blank" class="sh-mail" href="mailto:?subject=Cette page devrait te plaire.&body='+url+'">Email</a></li> <li><a target="_blank" class="sh-feed" href=" /feed">RSS</a></li> <li><a target="_blank" class="sh-tweet" href="http://twitter.com/home?status=Mon ForumActif '+url+'" target="_blank" onclick="javascript:pageTracker._trackPageview (\'/outbound/twitter.com\');">Twitter</a></li> <li><a target="_blank" class="sh-face" href="http://www.facebook.com/share.php?u='+url+'">Facebook</a></li> <li><a target="_blank" class="sh-su" href="http://www.stumbleupon.com/submit?url='+url+'">Stumbleupon</a></li> <li><a target="_blank" class="sh-digg" href="http://digg.com/submit?phase=2&url='+url+'">Digg</a></li> </ul></td><td width="180" align="right" valign=center><fb:like href="'+url+'" layout="button_count" width="45"></fb:like></td></tr></table><br>');});

Onde adicionar o código?

Painel