Tạo Khung Chứa Code Trên Bài Đăng Blog

Đăng nhập vào Blogger --> Mẫu( Template), vào Chỉnh sửa HTML. nhấn tổ hợp phím Ctrl+F và tìm đến đoạn mã  ]]></b:skin>.

 Dán đoạn code CSS bên dưới vào phía trên thẻ ]]></b:skin>.
Code :

/*  pre */
pre {padding:35px 10px 10px 10px;margin:.5em 0;white-space:pre;word-wrap:break-word;overflow:auto;background-color:#fff;position:relative;max-height:500px;box-shadow:0 0 0 1px #ddd;border-radius:3px;}
pre::before {font-size:13px;content:attr(title);position:absolute;top:0;background-color:transparent;padding:6px 10px 7px 10px;left:0;right:0;color:#444;display:block;margin:0 0 15px 0;font-weight:700;}
pre::after {content:"Double click to selection";padding:2px 10px;width:auto;height:auto;position:absolute;right:8px;top:4px;font-size:12px;color:#0077B5;line-height:20px;transition:all 0.3s ease-in-out;}
pre:hover::after {opacity:0;top:-8px;visibility:visible;}

Các bạn chỉnh sửa ( width : chiều rộng px) ( height: chiều cao px ) cho phù hợp với Blog
Cách sử dụng trong khi viết bài
khi viết bài bạn chọn chế độ HTML và dán code này vào

<pre> Code dán ở đây </pre> 

Sau đó chuyển qua chế độ viết và thay thế chữ " Code dán ở đây " bằng Code của bạn và lưu lại.

ok
Code Click chọn tất cả: chèn code này phía trên thẻ:    </body>

<script type='text/javascript'>
//<![CDATA[
for(var pres=document.getElementsByTagName("pre"),i=0;i<pres.length;i++)pres[i].addEventListener("dblclick",function(){var a=getSelection(),b=document.createRange();b.selectNodeContents(this);a.removeAllRanges();a.addRange(b)},!1);
//]]>
</script>