Tạo tiện ích copy link bài viết cho blogspot

Chào các bạn hôm nay mình sẽ hướng dẫn các bạn tạo tiện ích copy link bài viết cho blogspot

HƯỚNG DẪN CÁCH LÀM

Để tạo tiện ích này, làm những yêu cầu sau:
Bước 1: Vào chỉnh sửa HTML và chèn toàn bộ đoạn Code bên dưới lên trên thẻ đóng </body>

<!-- Copy link -->
<style>
.at-button{z-index:10000000;position:fixed;right:24px;bottom:24px;background:#FFF;width:48px;height:48px;padding:12px;border-radius:100%;box-sizing:border-box;color:#666;-webkit-animation:at-ripple .6s linear infinite;animation:at-ripple .6s linear infinite}
.at-button:hover i{-webkit-transform:rotate(135deg);transform:rotate(135deg)}
.at-button i{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);transition:.3s ease}
@-webkit-keyframes at-ripple {
0%{box-shadow:0 4px 10px rgba(102,102,102,0.1),0 0 0 0 rgba(102,102,102,0.1),0 0 0 5px rgba(102,102,102,0.1),0 0 0 10px rgba(102,102,102,0.1)}
100%{box-shadow:0 4px 10px rgba(102,102,102,0.1),0 0 0 5px rgba(102,102,102,0.1),0 0 0 10px rgba(102,102,102,0.1),0 0 0 20px rgba(102,102,102,0)}
}
@keyframes at-ripple {
0%{box-shadow:0 4px 10px rgba(102,102,102,0.1),0 0 0 0 rgba(102,102,102,0.1),0 0 0 5px rgba(102,102,102,0.1),0 0 0 10px rgba(102,102,102,0.1)}
100%{box-shadow:0 4px 10px rgba(102,102,102,0.1),0 0 0 5px rgba(102,102,102,0.1),0 0 0 10px rgba(102,102,102,0.1),0 0 0 20px rgba(102,102,102,0)}
}
</style>
<a class='at-button' href='javascript:;' onclick='CopyLink()'><i class='material-icons'>link</i></a>
<!-- End -->

Bước 2: Thêm đoạn js bên dưới lên trên thẻ </head>

<script>
function copyTextToClipboard(e){var t=document.createElement(&quot;textarea&quot;);t.style.position=&quot;fixed&quot;,t.style.top=0,t.style.left=0,t.style.width=&quot;2em&quot;,t.style.height=&quot;2em&quot;,t.style.padding=0,t.style.border=&quot;none&quot;,t.style.outline=&quot;none&quot;,t.style.boxShadow=&quot;none&quot;,t.style.background=&quot;&quot;,t.value=e,document.body.appendChild(t),t.select();try{document.execCommand(&quot;copy&quot;),alert(&quot;Đã sao chép liên kết!&quot;)}catch(o){alert(&quot;Không thể sao chép liên kết!&quot;)}document.body.removeChild(t)}function CopyLink(){copyTextToClipboard(location.href)}
</script>

Demo tiện ích

Chúc bạn thành công!

Admin: Lê Quốc Dũng

Chào mừng bạn đã đến với Blog của tôi. Website chia sẻ Thủ Thuật - Phần Mềm - Ảnh Đẹp - PSD tổng hợp, ... được cập nhật liên tục. Mong được mọi người quan tâm.