Tạo nút Share Facebook Coppy Url Thủ thuật Blogger
vào
22 thg 1, 2018
Demo gốc bên trái WEBSITE
Các bước thực hiện
Chèn đoạn code bến dưới vào dưới thẻ </body>Code HTML
<b:if cond='data:blog.pageType == "item"'>
<style>.st-socialbar{position:fixed;left:1%;top:25%;background:#fff;border-radius:50px;z-index: 2;width:47px;height:132px;box-shadow:1px 1px 5px rgba(128,128,128,0.5)}.st-socialbar ul{padding:5px}span.icon.share{color:#333;cursor:pointer;border:2px solid #333;border-radius:50px;height:37px;line-height:32px;width:37px;overflow:hidden;padding-left:10px;display:block;float:left;margin-bottom:5px;transition:all .2s ease-in-out}.icon.share:after{content:"Copy Link";display:none}span.icon.share:hover{width:105px;background:#333;color:#fff}span.icon.fb{color:#3a579a;border:2px solid #3a579a;border-radius:50px;height:37px;line-height:32px;width:37px;overflow:hidden;padding-left:12px;display:block;transition:all .2s ease-in-out;float:left;margin-bottom:5px}span.icon.fb:hover{width:100px;background:#3a579a;color:#fff} .icon.fb:after{content:"Facebook";display:none}span.icon.gp{color:#df4a32;border:2px solid #df4a32;border-radius:50px;height:37px;line-height:32px;width:37px;overflow:hidden;padding-left:8px;display:block;transition:all .2s ease-in-out;float:left;margin-bottom:5px}.icon.gp:after{content:"Google Plus";display:none}.icon.gp{color:#df4a32;border:2px solid #df4a32;border-radius:50px;height:37px;line-height:32px;width:37px;overflow:hidden;padding-left:8px;display:block;transition:all .2s ease-in-out;float:left;margin-bottom:5px}span.icon.gp:hover{width:120px;background:#df4a32;color:#fff}.icon.share:hover:after,.icon.fb:hover:after,.icon.gp:hover:after{display:initial} @media(max-width:1200px){.st-socialbar{top:75%}} @media(max-width:500px){.st-socialbar{width:132px;height:48px;top:90%}span.icon.fb,span.icon.gp{margin-right:5px}.st-socialbar span{width:37px!important}} </style>
<div class='post-footer'>
<div class='st-socialbar'>
<ul>
<li><a expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&title="+ data:post.title' onclick='window.open(this.href,'sharer', 'toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' title='Chia sẻ lên Facebook'><span class='icon fb'><i aria-hidden='true' class='fa fa-facebook'/> </span></a></li>
<li><a expr:href='"https://plus.google.com/share?url" + data:post.url + "&title="+ data:post.title' onclick='javascript:window.open(this.href," " ," menubar=no,toolbar=no,resizbutton_le=yes,scrollbars=yes,height=600,width=600" ); return false; ' rel='nofollow' title='Chia sẻ lên Google Plus'><span class='icon gp'><i aria-hidden='true' class='fa fa-google-plus'/> </span></a></li>
<li><a onclick='CopyLink()'><span class='icon share' title='Copy Url bài viết này'><i aria-hidden='true' class='fa fa-link'/> </span></a></li>
</ul>
</div> </div> </b:if>
javascript
<script type='text/javascript'> function copyTextToClipboard(e){var t=document.createElement("textarea");t.style.position="fixed",t.style.top=0,t.style.left=0,t.style.width="2em",t.style.height="2em",t.style.padding=0,t.style.border="none",t.style.outline="none",t.style.boxShadow="none",t.style.background="transparent",t.value=e,document.body.appendChild(t),t.select();try{document.execCommand("copy"),alert("Đã sao chép liên kết!")}catch(o){alert("Không thể sao chép liên kết!")}document.body.removeChild(t)}function CopyLink(){copyTextToClipboard(location.href)}; </script>
Lời kết
Với code đơn giản các bạn Có thể trang trí bài viết được đẹp hơn.
Nội dung chính
tt cái nào :v
Trả lờiXóa