J'ai apporté quelques améliorations personnelles, je vous les partagent au cas où.
J'ai enlevé les images pour mettre à la place des icônes vectoriels ( https://fontawesome.com/ )
Mise aux normes du codes html
Code : Tout sélectionner
<!-- IF S_SO_STATUS -->
<!-- IF S_SO_TYPE == '0' || postrow.S_FIRST_ROW -->
<br />
<ul class="share-buttons">
<!-- IF S_SO_FACEBOOK -->
<li><a href="{postrow.U_FACEBOOK}" title="{L_SHARE_ON_FACEBOOK}" class="js-newWindow" data-popup="width=580,height=325"><i class="icon fa-facebook-square icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_TWITTER -->
<li><a href="{postrow.U_TWITTER}" title="{L_SHARE_ON_TWITTER}" class="js-newWindow" data-popup="width=550,height=300"><i class="icon fa-twitter-square icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_TUENTI -->
<!-- --> <li><a href="{postrow.U_TUENTI}" title="{L_SHARE_ON_TUENTI}" class="share-button share-icon-button tuenti-icon js-newWindow" data-popup="width=741,height=551"></a></li> <!-- manque le svg -->
<!-- ENDIF -->
<!-- IF S_SO_DIGG -->
<li><a href="{postrow.U_DIGG}" title="{L_SHARE_ON_DIGG}" onclick="window.open(this.href);return false;"><i class="icon fa-digg icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_REDDIT -->
<li><a href="{postrow.U_REDDIT}" title="{L_SHARE_ON_REDDIT}" onclick="window.open(this.href);return false;"><i class="icon fa-reddit icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_DELICIOUS -->
<li><a href="{postrow.U_DELICIOUS}" title="{L_SHARE_ON_DELICIOUS}" class="js-newWindow" data-popup="width=540,height=500"><i class="icon fa-delicious icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_VK -->
<li><a href="{postrow.U_VK}" title="{L_SHARE_ON_VK}" class="js-newWindow" data-popup="width=607,height=510"><i class="icon fa-vk icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_TUMBLR -->
<li><a href="{postrow.U_TUMBLR}" title="{L_SHARE_ON_TUMBLR}" class="js-newWindow" data-popup="width=542,height=460"><i class="icon fa-tumblr-square icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_GOOGLE -->
<li><a href="{postrow.U_GOOGLE}" title="{L_SHARE_ON_GOOGLE}" onclick="window.open(this.href);return false;"><i class="icon fa-google-plus-g icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_WHATSAPP -->
<li><a href="{postrow.U_WHATSAPP}" title="{L_SHARE_ON_WHATSAPP}" onclick="window.open(this.href);return false;"><i class="icon fa-whatsapp icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
<!-- IF S_SO_POCKET -->
<li><a href="{postrow.U_POCKET}" title="{L_SHARE_ON_POCKET}" onclick="window.open(this.href);return false;"><i class="icon fa-get-pocket icon-gray" aria-hidden="true"></i></a></li>
<!-- ENDIF -->
</ul>
<br />
<!-- ENDIF -->
<!-- ENDIF -->
Il me manque que l'icone Tuenti mais il me sert pas, si jamais quelqu'un sais où je peux l'avoir je mettrai le code à jour
De plus je les ais plaqués en bas à droite donc j'ai renommé le fichier
viewtopic_body_postrow_post_notices_after.html
en viewtopic_body_postrow_back2top_after.html
Il reste donc que cette partie dans le fichier
shareon.css
Code : Tout sélectionner
.share-buttons {
float: none;
position: absolute;
margin: 0;
bottom: 13px;
right: 15px;
list-style: none;
}
.share-buttons > li {
float: left;
margin-right: 3px;
}
.share-buttons i { font-size: 18px; }
.share-buttons i:hover { opacity: .6; }
Ce qui me donne ce rendu pour notre charte graphique