4
J'ai créé un bouton tumblr personnalisé et j'ai mis le iframe dessus pour le rendre cliquable mais je dois avoir fait quelque chose de mal parce que ça ne marche pas .. Je n'ai pas très bien compris comment fonctionne désolé si c'est une question stupide! Je sais que vous devez créer votre bouton personnalisé et vient de mettre au-dessus de iframe, mais ... tumblrBouton tumblr personnalisé
window.onload = function() {
document.body.insertAdjacentHTML('beforeEnd', '<iframe id="my-like-frame" style="display:none;"></iframe>');
document.addEventListener('click', function(event) {
var myLike = event.target;
if (myLike.className.indexOf('like') > -1) {
var frame = document.getElementById('my-like-frame'),
liked = (myLike.className == 'liked'),
command = liked ? 'unlike' : 'like',
reblog = myLike.getAttribute('data-reblog'),
id = myLike.getAttribute('data-id'),
oauth = reblog.slice(-8);
frame.src = 'http://www.tumblr.com/' + command + '/' + oauth + '?id=' + id;
liked ? myLike.className = 'like' : myLike.className = 'liked';
};
}, false);
};.controls i {
height: 10px;
width: 10px;
background: #ce9c87;
border-radius: 100%;
padding: 5px;
display: block;
overflow: visible;
text-align: center;
color: #fff;
-webkit-transition: .2s ease;
-moz-transition: .2s ease;
-o-transition: .2s ease;
transition: .2s ease;
}
.controls {
float: right;
margin-right: 10px;
}
.controls a {
position: relative;
display: inline-block;
overflow: hidden;
padding: 1px 2px;
width: auto;
height: auto;
margin-left: 1em;
float: right;
}
.like {
position: relative;
display: inline-block;
overflow: hidden;
padding: 1px 2px;
width: auto;
height: auto;
margin-left: 1em;
float: right;
cursor: pointer;
}
.controls .like .liked+i,
.controls i:hover {
color: #ce9c87;
background-color: #fff;
}<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<div class="controls">
<a href="{Permalink}" class="permalink">
<i class="fa fa-bookmark-o" aria-hidden="true"></i>
</a>
<a href="{ReblogURL}" target="_blank" class="reblog">
<i class="fa fa-retweet" aria-hidden="true"></i>
</a>
<div class="like" data-reblog="{ReblogURL}" data-id="{PostID}">{LikeButton}
<i class="fa fa-heart-o" aria-hidden="true"></i>
</div>
</div>Si on ne sait pas here est le lien vers la page ..
Merci!
Si Tumblr vous vouliez d'être en mesure de personnaliser leurs comme des boutons, ils vous fournir des options pour le faire. Je recommande fortement de ne pas faire ce que vous essayez de faire ici, car cela risque de déclencher une sorte de détection de «cliquetis» à un moment donné. Et si cela se produit via un outil/algorithme automatisé, cela pourrait conduire à ce que tous les goûts ainsi recueillis soient simplement supprimés. – CBroe
Je pense que c'est de l'aide pour vous. https://stackoverflow.com/questions/21708662/customise-tumblrs-new-like-button-iframe-likebutton –
@CBroe Merci pour la réponse documentée, je n'ai pas tout à fait compris ce que j'ai risqué en changeant le bouton like ? Parce qu'ils ont fourni cette chose {LikeButton} et beaucoup de comptes changent donc je ne suis pas sûr que ce serait faux? .. –