Tự động loại bỏ liên kết đến hình ảnh trong bài viết blogspot

Mỗi khi chúng ta thêm một hình ảnh vào bài viết của blogspot thì hệ thống tự động chèn link của hình ảnh đó vào, điều này gây không ít khó chịu cho độc giả khi họ kích nhầm vào ảnh bị nhảy sang trang khác dẫn đến tình trạng "mất khách". Bạn cũng có thể hủy bỏ liên kết này một cách thủ công tuy nhiên đối với những bài viết mà sử dụng rất nhiều hình ảnh thì quả là một cực hình. Vì thế bài viết này mình sẽ hướng dẫn các bạn đang phát triển web trên nền tảng blogspot cách để tự động loại bỏ link trong hình ảnh một cách đơn giản nhất đó là sử dụng CSS

Cách thức hoạt động

Trước hết chúng ta phải biết rằng khi thêm hình ảnh vào hệ thống sẽ cho ta đoạn mã dạng như sau

<div class="separator" style="clear: both; text-align: center;">
<a href="link hình ảnh" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="link hình ảnh" height="320" width="291" /></a></div>

Và ta sẽ sử dụng thuộc tính pointer-events: none để vô hiệu hóa tất cả link trong class separator này

Làm cách nào để loại bỏ link trong hình ảnh bài viết

1. Vào blogger → Template
2. Tìm </b:skin>
3. Dán đoạn CSS sau vào trước thẻ vừa tìm được

.separator a {
   pointer-events: none;
   cursor: default;
}

4. Lưu lại template và xem kết quả

Hi vọng thủ thuật nhỏ này sẽ giúp bạn ít nhiều trong quá trình phát triển blog