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

Tuesday, 19 August 2014

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

thủ thuật blogspot, blogger, blogspot

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
Code:
<div class="[/COLOR][COLOR=#ff0000]separator[/COLOR][COLOR=#333333]" style="clear: both; text-align: center;">[/COLOR]
[COLOR=rgb(51, 51, 51)]<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
    Code:
    </b:skin>
  3. Dán đoạn CSS sau vào trước thẻ vừa tìm được
    Code:
    .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

Nguồn VNBlogspot.Com


Read more: http://forum.vietdesigner.net/threads/tu-dong-loai-bo-lien-ket-den-hinh-anh-trong-bai-viet-blogspot.62321/#ixzz3AqFQwie0

No comments:

Post a Comment