07 September, 2022

[BLOGGER] SAO CHÉP TOÀN BỘ CODE TRONG KHUNG PRE VÀO BỘ NHỚ TẠM

Hi mọi người, hôm nay có thời gian tìm hiểu thủ thuật blogspot mình thấy có thủ thuật này cũng khá hay và tiện cho anh em chia sẽ code và thủ thuật internet.
Đó là sao chép nhanh toàn bộ code trong khung chứa code của mọi người chỉ cần một click đúp chuột chứ không phải mất công bôi đen rồi copy nữa nhé mọi người
Chúng ta bắt đầu nhé.

Làm cách nào thêm nhấp đúp khung code sao chép vào khay nhớ tạm?

Thêm Double Click để sao chép nội dung trước vào khay nhớ tạm sẽ không yêu cầu nhiều kiến thức về HTML, CSS hoặc JS vì ở đây đã thiết kế sẵn cho bạn. Những gì bạn cần làm là triển khai các mã ở đúng vị trí trong XML chủ đề Blogger/blogspot của bạn.
 
Bước 1: Trước hết Đăng nhập vào trang tổng quan Blogger.
Bước 2: Trên Bảng điều khiển Blogger, nhấp vào Chủ đề .
Bước 3: Nhấp vào biểu tượng mũi tên xuống bên cạnh nút 'tùy chỉnh' .
Bước 4: Nhấp vào Chỉnh sửa HTML , bạn sẽ được chuyển đến trang chỉnh sửa.
Bước 5: Bây giờ hãy tìm kiếm mã ]]></b:skin> và dán các Mã CSS sau vào ngay bên trên nó.
.preCl span{position:fixed;left:24px;bottom:-70px;display:inline-flex;align-items:center;text-align:center;justify-content:center;margin-bottom:20px;z-index:99981;background:#323232;color:rgba(255,255,255,.8);font-size:14px;font-family:inherit;border-radius:3px;padding:13px 24px;box-shadow:0 5px 35px rgba(149,157,165,.3);opacity:0;transition:all .1s ease;animation:slideinwards 2s ease forwards;-webkit-animation:slideinwards 2s ease forwards}
@media screen and (max-width:500px){.preCl span{margin-bottom:20px;left:20px;right:20px;font-size:13px}
}
@keyframes slideinwards{0%{opacity:0}
20%{opacity:1;bottom:0}
50%{opacity:1;bottom:0}
80%{opacity:1;bottom:0}
100%{opacity:0;bottom:-70px;visibility:hidden}
}
@-webkit-keyframes slideinwards{0%{opacity:0}
20%{opacity:1;bottom:0}
50%{opacity:1;bottom:0}
80%{opacity:1;bottom:0}
100%{opacity:0;bottom:-70px;visibility:hidden}
}
.darkMode .preCl span{box-shadow:0 10px 40px rgba(0,0,0,.2)}
pre{position:relative;display:block;background-image:linear-gradient(#f5fffa 50%,#edf5ed 50%);background-size:100% 3rem;background-position:0 1.5rem;background-origin:content-box;font-family:"Consolas","Courier New",Courier,Monospace;font-size:14px;color:var(--post-text-color);white-space:pre-wrap;line-height:1.7em;padding:28px 16px 16px;border:1px solid #ddd;border-radius:2px;overflow:auto}
.darkMode pre{background-image:linear-gradient(#191919 50%,#323232 50%);background-size:100% 3rem;background-position:0 1.5rem;background-origin:content-box;color:#eee}
.post pre:before{content:'</>';position:absolute;right:0;top:0;color:#656e77;font-size:11px;padding:0 10px;z-index:2;line-height:35px}
.post pre:hover::before{content:'Nhấp đúp để sao chép | Double click to copy | </>';position:absolute;right:0;top:0;color:#535a62;font-size:11px;padding:0 10px;z-index:2;line-height:35px}
.darkMode .post pre:before{color:#ccc}

Bước 6: Dán đoạn mã HTML sau vào ngay bên dưới thẻ <body>. Nếu bạn không tìm thấy nó, nó có thể đã được phân tích cú pháp &lt;body&gt;.
<div class='preCl' id='toastNotif'></div>
Bước 7: Bây giờ hãy thêm các Mã Javascript sau đây ngay bên trên thẻ </body>. Nếu bạn không tìm thấy nó, nó có thể đã được phân tích cú pháp &lt;/body&gt;.
<b:if cond='data:view.isSingleItem'>
  <script>/*<![CDATA[*/ for(var preClick=document.getElementsByTagName("pre"),i=0;i<preClick.length;i++)preClick[i].addEventListener("dblclick",function(){var e=getSelection(),o=document.createRange();o.selectNodeContents(this),e.removeAllRanges(),e.addRange(o),document.execCommand("copy"),e.removeAllRanges(),document.querySelector("#toastNotif").innerHTML="<span>Copied to clipboard!</span>"},!1); /*]]>*/</script>
</b:if>
Lưu ý: Class: darkMode đối với mỗi mẫu blogger có thể sẽ khác nhau nên bạn cần tùy chỉnh cho phù hợp.
Bước 8: Cuối cùng, Lưu các thay đổi.

Cách sử dụng

Viết theo cú pháp:
<pre>  Code của bạn ở đây </pre>

Chúc các bạn thành công với thủ thuật này.
All Right Reserved © 2015 By Hung Pro VN
Hung.Pro.VN Sharing Your Own Knowledge and Creative Thinking Every Day and Many Other Things.