URL Redirection for Demo and Download Links in Blogger
Redirect dựa trên URL gốc được rất nhiều người quan tâm. Tiện ích hoạt động giống như một dạng Iframes để chuyển hướng các bản demo và liên kết tải về mà không phải rời khỏi blogger các liên kết trong blogger. Namkna sẽ sử dụng cùng một phương pháp tiếp cận chính xác để kiểm soát liên kết chuyển hướng trong blogger mà không cần bất kỳ tài khoản lưu trữ hoặc các kịch bản web phức tạp. Plugin này dành cho Bloggerđược phát triển bởi mybloggertricks. Namkna hy vọng nỗ lực nhỏ này của tác giả sẽ hữu ích cho tất cả người dùng Blogger đặc biệt là những người chia sẻ phần mềm download với độc giả của họ.

Xem Demo để thấy rõ hơn!

VIEW DEMO

☼ Tiện ích này hoạt động như thế nào?


- Hướng dẫn này sẽ giúp bạn kết nối tất cả các liên kết bên ngoài bên cạnh địa chỉ tên miền của bạn bằng cách sử dụng kỹ thuật nối chuỗi. Người truy cập sẽ cảm thấy anh ta như đang truy cập một trang web mới, nhưng URL tên miền của của bạn sẽ vẫn dính vào thanh địa chỉ.
http://namkna.blogspot.com/p/download.html?url=http://domain2.com/

- Plugin này sẽ thay đổi bố cục phần body blog của bạn với một kiểu tuỳ chỉnh theo quy định của ID "MBT-REDIRECTION". Namkna sẽ tạo ra hai trang tĩnh. Một cho trang dành cho Demo và một dành cho download. Cả hai trang này sẽ chứa một khung nội tuyến với vị trí nguồn bỏ trống. Bằng cách sử dụng JavaScript, namkna sẽ tuỳ chỉnh mà để bao gồm toàn bộ không gian giữa các thẻ body. JavaScript này cũng sẽ đảm bảo chắc chắn rằng không có thanh cuộn sẽ xuất hiện trong cửa sổ.

- Để liên kết làm việc trang bạn bạn phải tạo bao gồm một thuộc tính data [content]. Bằng cách sử dụng Jquery tôi sẽ chọn vị trí href là chuỗi đó nối nó bên cạnh liên kết của trang demo hoặc trang download của bạn .

- TIện ích này sử dụng thư viện Jquery do vậy hãy chắc chắn là blog của bạn đã có file JQuery rồi. Nếu chưa có thì thêm file bên dưới vào sau thẻ <head>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>

- Và vui lòng thực hiện theo các bước đơn giản dưới đây:

☼ Bước 1: Tạo trang Demo và Download!

1.1- Đăng nhập vào Blog
1.2- Vào Trang (Page)
1.3- Chọn Trang mới (New page) => Trang trống (page blank)
1.4- Đánh tên trang là Demo hoặc bất kỳ tên nào khác mà bạn muốn. Bấm chọn mục HTML của trang và dán code sau vào:
<div height="100%" id="iframe-container" width="100%">

<style>
body { padding: 0!important; background: none!important; }
#iframe-container { overflow: hidden; background: none!important; }
#frame { border: 0; }
</style>

<iframe frameborder="0" id="frame" src="" width="100%"> </iframe>

</div>

<script>
document.documentElement.style.overflow = 'hidden';  // firefox, chrome
document.body.scroll = "no"; // ie only
var query = window.location.search.substring(1);
query = query.replace("url=", "");
$('#frame').attr('src', query);
var str = $('#iframe-container').html();
$('#MBT-REDIRECTION').html(str);
$('iframe').height($(window).height());
</script>
1.5- Bấm vào phần tùy chọn (Opyions) của trang đó => Tại mục dấu ngắt dòng (Line Breaks) => Đánh dấu chọn vào ô sử dụng thẻ <br> [Use <br> tag]:
Nếu bạn viết blog tiếng anh thì xem ảnh này.
1.6- Bấm lưu (save) trang sau đó bấm xuất bản trang Demo đó của bạn.
- Như vậy là bạn đã tạo được một trang Demo. Trong ví dụ này là:
http://namkna.blogspot.com/p/demo.html
1.7- Tiếp theo là tạo một trang download. Tạo một trang trống mới đặt tên là Download và thực hiện từ bước 1.3 đến bước 1.6 nha. Sau đó bạn sẽ được trang download. Trong ví dụ này là:
 http://namkna.blogspot.com/p/download.html

☼ Bước 2: Liên kết chuỗi URL với nhau!

2.1- Đăng nhập vào blogger.
2.2- Vào mẫu (template)
2.3- Chọn chỉnh sửa HTML (Edit html)
2.4- Thêm đoạn mã bên dưới vào sau thẻ mở  <body> :
<div id='MBT-REDIRECTION'>
- Lưu ý: Với các bạn dùng mẫu Simple của blogger nếu không tìm thấy thẻ <body> thì hãy tìm thẻ có dạng như sau:
<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
2.5- Thêm đoạn mã bên dưới vào trước thẻ đóng  </body> :
</div>
2.6- Dán code bên dưới vào sau thẻ: ]]></b:skin> .
<script>

$(document).ready(function() {
$(&#39;[data-MBTdemo]&#39;).click(function(e) {
e.preventDefault();
if($(e.srcElement).attr(&#39;target&#39;) == &quot;_blank&quot;) {
window.open(&quot;http://namkna.blogspot.com/p/demo.html?url=&quot; + $(e.srcElement).attr(&#39;href&#39;), &#39;_blank&#39;);
} else {
window.location = &quot;http://namkna.blogspot.com/p/demo.html?url=&quot; + $(e.srcElement).attr(&#39;href&#39;);
}

});


$(&#39;[data-MBTdownload]&#39;).click(function(e) {
e.preventDefault();
if($(e.srcElement).attr(&#39;target&#39;) == &quot;_blank&quot;) {
window.open(&quot;http://namkna.blogspot.com/p/download.html?url=&quot; + $(e.srcElement).attr(&#39;href&#39;), &#39;_blank&#39;);
} else {
window.location = &quot;http://namkna.blogspot.com/p/download.html?url=&quot; + $(e.srcElement).attr(&#39;href&#39;);
}

});

});

</script>
Tùy chỉnh:
  • Thay thế phần màu cam thành URL trang demo của bạn.
  • Thay thế phần màu xanh thành URL trang download của bạn.
- Bây giờ nếu bạn thử truy cập theo URL trang demo và trang download của bạn, bạn sẽ nhìn thấy một trang trống không có nội dung bên trong nó. Bạn đùng cảm thấy ngạc nhiên hay lo lắng vì đó là những gì namkna muốn. Nội dung chỉ hiển thị khi bạn gắn link ở bước sau!

☼ Bước 2: Làm thế nào để sủ dụng link.

Bây giờ khi bạn đã thực hiện tất cả các phần của hướng dẫn ở bước 1, Namkna sẽ hướng dẫn các bạn bước tiếp theo, Namkna sẽ hướng dẫn các bạn các sử dụng các chức năng.

Bạn sẽ tạo liên kết như thông thường và chỉ thêm phần thông tin mà bạn cần để chèn link vào là các thuộc tính dữ liệu - nội dung (Data-Content). Đây là các cách bạn cần phải làm.
2.1- Tạo một bài viết (hoặc trang) mới.
2.2- Check vào ô HTML của bài viết (hoặc trang).=> Vào dán code bạn muốn ở bên dưới vào.
2.2.1- Dành cho link demo hoặc nút demo!
<a href="#" rel="nofollow" data-MBTdemo="true">DEMO</a>
- Để liên kết mở ra trong của sổ mới bạn dùng code sau:
<a href="#" target="_blank" rel="nofollow" data-MBTdemo="true">DEMO</a>
2.2.2- Dành cho link download hoặc nút download!
<a href="#" rel="nofollow" data-MBTdownload="true">DOWNLOAD</a>
- Để liên kết mở ra trong của sổ mới bạn dùng code sau:
<a href="#" target="_blank" rel="nofollow" data-MBTdownload="true">DOWNLOAD</a>

- Thay dấu thăng màu đỏ (#) thành URL của trang demo hoặc trang download.

- Bạn có thể sử dụng nhiều liên kết chuyển hướng trên mỗi trang hoặc bài viết như bạn muốn. Mã này là hiệu quả, đủ để chọn một loạt các thuộc tính dữ liệu-nội dung. Đơn giản!

Bây giờ bạn có thể chuyển hướng của bất cứ liên kết nào bên trong blog của bạn trở lại địa chỉ tên miền của bạn.

Nếu cần giúp đỡ?

Nếu bạn phải đối mặt với bất kỳ rắc rối trong khi cài đặt plugin này, vui lòng cho tôi biết. Tôi hy vọng rằng phương pháp chuyển hướng các liên kết bên ngoài trong blogger trở lại với tên miền gốc sẽ giúp tất cả những người quản trị web những người chia sẻ các tài nguyên như, ebooks, hình nền, Template,icon,...vv