<script>
jQuery(document) .ready(function() {    
$('#openshare').on('click', function(){
        $('#sharemenu').fadeIn('100');
        return false;
    });
    $('body').on('click',function(){
        $('#sharemenu').fadeOut('100');
    });
    $("#sharemenu").click(function(e){
        e.stopPropagation();
    });
});
</script>
<script type="text/javascript">
function copiarAlPortapapeles(id_elemento) {
  var aux = document.createElement("input");
  aux.setAttribute("value", document.getElementById(id_elemento).value);
  document.body.appendChild(aux);
  aux.select();
  document.execCommand("copy");
  document.body.removeChild(aux);

  $('#copyurl').on('click', function() {
        $(".sharalert").fadeIn(1500);  
    setTimeout(function() {
      $(".sharalert").fadeOut(1500);
return false;  },3000);
  });}
</script>

<a href="#" id="openshare"><i style="padding-top: 2px;"class="fas fa-share-alt"></i></a>

<div id="sharemenu">
 <div class="sharalert">El enlace ha sido copiado correctamente</div>
<div class="shareform">
<div><span class="smalltext">Compartir esta publicación:</span></div>
<input type="text" id="urlshare" value="{$mybb->settings['bburl']}/showthread.php?tid={$thread['tid']}" readonly="readonly" />
<button id="copyurl" onclick="copiarAlPortapapeles('urlshare')">Copiar enlace</button>
</div>
<div>
<ul>
<li><a class="fbshare" target="_blank" href="http://www.facebook.com/share.php?u={$mybb->settings['bburl']}/showthread.php?tid={$thread['tid']}" title="Compartir en Facebook"><i class="fab fa-facebook-square"></i></a></li>
<li><a  class="washare" target="_blank"  href="https://api.whatsapp.com/send?text={$thread['subject']} - {$mybb->settings['bburl']}/showthread.php?tid={$thread['tid']}" title="Compartir por Whatsapp"><i class="fab fa-whatsapp-square"></i></i></a></li>
<li><a  class="twshare" target="_blank"  href="http://twitter.com/home?status={$thread['subject']} - {$mybb->settings['bburl']}/showthread.php?tid={$thread['tid']}" title="Compartir en Twitter"><i class="fab fa-twitter-square"></i></a></li>
<li><a  class="lkshare" target="_blank"  href="http://www.linkedin.com/shareArticle?url={$mybb->settings['bburl']}/showthread.php?tid={$thread['tid']}" title="Compartir en Linkedin"><i class="fab fa-linkedin-square"></i></a></li>
<li><a  class="emshare" target="_blank"  href="sendthread.php?tid={$tid}" title="Compartir por correo"><i class="fas fa-envelope-square"></i></a></li>
</ul>
</div>
</div>

#sharemenu{
position: fixed;
    display: none;
    right: 35%;
    top: 35%;
    background: #fff;
    padding: 10px;
    box-shadow: 0 0 3px ccc;
    color: 333;
}
.sharalert{
 color:#fff;
position: fixed;
bottom: 15px;
right: 15px;
padding: 10px;
border-radius: 3px;
display: none;
background: 333;
z-index: 999;
}
#sharemenu ul {
 list-style: none;
}
#sharemenu li{
display: inline-block;
}
#sharemenu li a{
color: 333;
padding: 5px;
font-size: 30px;
}

#sharemenu li a.emshare:hover{
color: c1ab3d;
}

#sharemenu li a.washare:hover{
color: 25D366;
}
#sharemenu li a.fbshare:hover{
color: 3b5998;
}
#sharemenu li a.twshare:hover{
color: 00ACEE;
}
#sharemenu li a.lkshare:hover{
color:  0E76A8;
}
#urlshare{
background: #ffffff;
    color: #a7a7a7;
    border: 1px solid f2f3f4;
    padding: 5px;
    outline: 0;
    font-size: 13px;
}