Như các bạn đã biết, muốn độc giả khi click vào link khác trên blog và mở ra một cửa sổ mới thì ta phải thêm thuộc tính target="_blank" vào. Tuy nhiên cứ mỗi khi click vào bất kỳ một chỗ nào đó lại bật ra  một tab mới như ở trên thanh Menu Bar chẳng hạn, điều này có thể khiến người dùng khó chịu vì ra quá nhiều tab.

Nhưng nếu bạn chỉ muốn các link ko thuộc website/blog của bạn được mở sang tab mới để độc giả ko quên đến blog của bạn thì phải làm sao? Mình sẽ giới thiệu cách làm công việc trên bằng target="_blank"  được tùy biến bằng jquery sẽ giúp bạn thực hiện chuyện này

Thêm code vào template
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function() {
 $("a[href^='http://']").each(
 function(){
 if(this.href.indexOf(location.hostname) == -1) {
 $(this).attr('target', '_blank');
 }
 }
 );
$("a[href^='https://']").each(
function(){
if(this.href.indexOf(location.hostname) == -1) {
$(this).attr('target', '_blank');
}
}
);
});
</script>


Bạn chèn đoạn js sau vào trước thẻ đóng </head>
  • Đoạn mã được thêm 2 lần cho các liên kết được bắt đầu bằng cả http và https
  • Hai đoạn mã == -1 có tác dụng chỉ thêm thuộc tính target="_blank" vào các liên kết bên ngoài. Nhưng nếu bạn muốn áp dụng cho tất cả các đường link trên blog thì thay thế bằng ==1
  • Xóa đoạn code <script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script> nếu trong template của bạn đã có jQuery rồi

Post a Comment

 
Top