CODE HTML LÀM ẢNH HOẶC TEXT CHẠY TRÊN WEB, BLOG

( Khởi nghiệp với Internet)

Hiện nay, trên các trang website, hay blog điều có những dòng chữ hay những hình ảnh chay qua lại, lên xuống rất đẹp mắt. Để trang trí thêm cho trang cũng như là tiết kiệm được diện tích site của ta, hôm nay mình sẽ tổng hợp 1 số code cơ bản để các bạn có thể làm điều đó.

Dưới đây là tổng hợp các đoạn mã dùng để tạo các kiểu chữ chạy khác nhau trên web/blog. Hướng dẫn này cũng có khá nhiều bài viết chia sẽ trên mạng rồi, nhưng mình cũng cố gắng tổng hợp lại và hướng dẫn chi tiết để các bạn thực hiện 1 cách dễ dàng nhất.

Xin lưu ý các bạn, các đoạn mã này chỉ hoạt động trên các trình soạn thảo văn bản có hỗ trợ ngôn ngữ HTML thôi nhé (Mình thấy đa phần trình soạn thảo trên các hệ thống Blog miễn phí đều hỗ trợ HTML, riêng diễn đàn hầu như là không).

A- ÁP DỤNG CHO CHỮ

CÁCH 1:

1. Chữ chạy ngang từ phải qua trái
Đây là đoạn mã cơ bản nhất, bạn chỉ việc để dòng chữ cần cho chạy vào giữa 2 thẻ MARQUEE là được.
Đoạn mã:

<marquee>khoinghiepinternet.blogspot.com</marquee>

Kết quả:
khoinghiepinternet.blogspot.com

Lưu ý quan trọng: Thẻ marquee phía sau lúc nào cũng phải có dấu "/" ngay trước nhé, nếu không sẽ bị lỗi chạy cả bài viết luôn đó. Chú ý điều này là được!
Từ đoạn mã cơ bản ở trên, chúng ta đặt các thuộc tính khác nhau vào trong thẻ marquee để tạo dòng chữ chạy với nhiều kiểu khác nhau.

2. Chữ chạy ngang từ trái qua phải:

<marquee direction="right">www.thietkemenu.net</marquee>

khoinghiepinternet.blogspot.com

3. Chữ chạy từ trên xuống dưới:

<marquee direction="down">khoinghiepinternet.blogspot.com</marquee>

khoinghiepinternet.blogspot.com

4. Chữ chạy từ dưới lên trên:

<marquee direction="up">khoinghiepinternet.blogspot.com</marquee>

khoinghiepinternet.blogspot.com

5. Chữ chạy qua lại:

<marquee behavior="alternate">khoinghiepinternet.blogspot.com</marquee>

khoinghiepinternet.blogspot.com

6. Chữ đứng, mũi tên 2 bên chạy ra vào:

<marquee behavior="alternate" width="10%">>></marquee>khoinghiepinternet.blogspot.com<marquee behavior="alternate" width="10%"><< </marquee>

>>khoinghiepinternet.blogspot.com<<

7. Chữ chạy có màu nền:

<font ><marquee direction="left" style="background:orange">khoinghiepinternet.blogspot.com</marquee></font>

khoinghiepinternet.blogspot.com

8. Chữ chạy có khung xung quanh:

<marquee style="border:blue 2px SOLID">khoinghiepinternet.blogspot.com</marquee>

khoinghiepinternet.blogspot.com

9. Chữ chạy và biến mất:

<marquee behavior="alternate"><marquee width="150">khoinghiepinternet.blogspot.com</marquee></marquee>

khoinghiepinternet.blogspot.com

10. Chữ chạy ngang, rê chuột vào thì đứng, đưa chuột ra chạy tiếp:

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2">khoinghiepinternet.blogspot.com</marquee>

khoinghiepinternet.blogspot.com

CÁCH 2:

Đầu tiên là đoạn code sẽ có cấu trúc chung như thế này:

<marquee id="marq" scrollamount="3" direction="up" loop="50" scrolldelay="0" behavior="scroll" onmouseover="this.stop()" onmouseout="this.start()"> *** </marquee> 

*** Các thông số:

scrollamount và scrolldelay: là điều chỉnh thông số về tốc độ và thời gian.
direction: là hướng chạy của đối tượng mà ta cho chạy. có 4 hướng là: left - right - down - up
loop: là số lần lặp của đối tượng.
behavior: là hiệu ứng chạy của đối tượng, có 3 giá trị: slide - alternate - scroll

• Slide: chạy tới khi chạm lề thì dừng lại.
• alternate: chạy tới khi chạm lề thì chạy ngược lại.
• scroll: là kiểu mặt định, kiểu này tự động áp dụng vào tất cả các hình thức còn lại.

** chú ý: những phần bôi xanh là những phần dùng để thay đổi thuộc tính theo ý ta mong muốn

Áp dụng cho text.
Việc áp dụng vào text thì cũng khá đơn giản, trên phần code chung có 3 dấu sao bị bôi xanh ( *** ) là phần mà ta sẽ đưa đoạn text mà ta muốn cho chạy vào vị trí đó.

khoinghiepinternet.blogspot.com

Đối với text thì ta cũng có thể thêm vào các thuốc tính như font color, style, font-color,...
Các bạn tiếp tục thay đổi các thuộc tính tùy theo sở thích của mình nhé, ví dụ ở trên là mình cho chạy từ phải sang trái (direction="left") và vòng lặp forever.

Tiếp theo là text chạy chạm lề rồi chạy ngược lại:

khoinghiepinternet.blogspot.com

Text chạy lên

khoinghiepinternet.blogspot.com

Text chạy xuống    khoinghiepinternet.blogspot.com

B- ÁP DỤNG CHO HÌNH ẢNH

Cũng tương tự như phần áp dụng cho text, ta chỉ việc thêm nội dung vào 3 dấu sao đó, nhưng ở đây ta thay bằng thẻ <img>.
Ví dụ để làm cho hình ảnh chạy từ dưới lên và khi ta rê chuột vào thì hình sẽ đứng lại và có link liên kết cho hình, thì ta sửa code lại thành:

<marquee id="marq" scrollamount="3" direction="up" loop="50" scrolldelay="0" onmouseover="this.stop()" onmouseout="this.start()"> <a href="Link"><img src="Link hình ảnh" title="Ghi chú cho ảnh" width="200" height="300"/> </a> <a href="Link"><img src="Link hình ảnh" title="Ghi chú cho ảnh" width="200" height="300"/> </a> .................................( Thêm link vào đây) <a href="Link"><img src="Link hình ảnh" title="Ghi chú cho ảnh" width="200" height="300"/> </a> </marquee>

*** Các thông số.
Cũng như các thông số ở  trên, chỉ thay đổi 1 số cái như thẻ <a>, thẻ< img>

<a href="Link"> là thẻ chứa link mà khi ta click vào hình sẽ dẫn ta tới link đó, các bạn nên thêm thuộc tính target="_blank" và để mở link ở cửa sổ mới.
<img src="Link hình ảnh">  đây chính là phần chèn link ảnh mà ta cần đưa vào để chạy. title ghi chú cho từng bức ảnh, nó sẽ hiện lên khi ta trỏ chuột vào ảnh. Các bạn cũng có thể thêm vào nó vào 1 cái table, hoặc thêm vào các thuộc tính như width, height để định dạng cố định size ảnh.

  

khoinghiepinternet.blogspot.com

Blog tổng hợp những kinh nghiệm được học, áp dụng và chia sẻ

Cách chuyển đổi từ Exel sang CSV không bị lỗi font Tiếng Việt

( Khởi nghiệp với Internet)

– Trong quá trình thao tác với Exel chúng ta thường phải chuyển đổi nội dung từ file Exel sang file CSV để thuận tiện cho việc xuất/nhập dữ liệu trên database.

– Khi chuyển đổi dữ liệu từ file Exel sang file CSV chúng ta thường mắc phải lỗi không hiển thị font Tiếng Việt. Trong bài viết này tôi sẽ hướng dẫn các bạn cách khắc phục lỗi không hiển thị font Tiếng Việt trong file CSV.

=====> Cách này đã thành công.

– Bước 1: Đổi mã vùng dữ liệu từ từ file Exel (nhấn CTRL + A để chọn tất cả dẽ liệu trong file Exel hoặc có thể chọn từng cột) từ Unicode sang TCVN3 (Chọn vùng dữ liệu rồi chọn lệnh copy (Ctrl+C) -> Nháy chuột phải vào biểu tượng Unikey ở khay hệ thống > Công cụ … [CS+F6] > Chọn bảng mã nguồn là Unicode và mã đích là TCVN3 rồi nháy Chuyển mã > OK). Sau đó Paste dữ liệu trong Clipboard sang một Sheet mới (nhớ đổi font để hiển thị chữ Việt, chẳng hạn .VnTime).

– Bước 2: Save as toàn bộ dữ liệu thành file TXT.

– Bước 3: Dùng Notepad mở file .TXT rồi đổi từ mã TCVN3 sang Unicode (xem cách làm ở Bước 1), rồi chọn Save as… và ghi lại với Encoding là UTF-8.

– Bước 4: Khi này chúng ta sẽ thu được file TXT không bị lỗi font Tiếng Việt nữa, và bắt đầu tiến hành xuất sang file CSV, để xuất ra file CSV chúng ta chọn Save AS và đặt tên file là “output.csv”(nhớ để unicode và dấu “” khi đặt tên file). Lúc này chúng ta thu được file CSV, tuy nhiên việc sắp xếp các cột lại có vấn đề. Chúng ta nên hiểu rằng mặc định trong CSV thì dấu “,” là sự phân cách giữa các cột với nhau. Khi tạo ra file txt thì chúng ta có phần dấu TAB chính là khoảng trắng cách khá xa nhau, vậy chúng ta nên sửa đổi toàn bộ dấu TAB đó thành “,” (sử dụng tính nằng Find & Repalce trong Notepad). Như vậy là đã hoàn thành việc phân cách các cột trong file CSV.

– Bước 5: Nếu dữ liệu của chúng ta có nhiều dấu “,” thì mặc định của file CSV sẽ chia nó ra thành các cột, do vậy mà chúng ta nên khoanh vùng dữ liệu đó nằm trong dấu “” thì file CSV mới đúng chuẩn như trong file Exel. Lưu ý: việc sửa đổi này phải làm trên Notepad.

Như vậy, chỉ cần 5 bước đơn giản là chúng ta đã có thể chuyển đổi toàn bộ dữ liệu trong file Exel sang file CSV mà không bị lỗi font Tiếng Việt.

Ngoài ra chúng ta có thể tham khảo ở một số cách dưới đây:

Để tạo file .CSV từ Excel không bị lỗi font Unicode chữ Việt, Bạn có thể làm theo một trong hai cách sau:

* Cách 1:

Bước 1: Đổi mã vùng dữ liệu từ Unicode sang TCVN3 (Chọn vùng dữ liệu rồi chọn lệnh copy (Ctrl+C) > Nháy chuột phải vào biểu tượng Unikey ở khay hệ thống > Công cụ ... [CS+F6] > Chọn bảng mã nguồn, đích rồi nháy Chuyển mã > OK).
Paste dữ liệu trong Clipboard sang một Sheet mới (nhớ đổi font để hiển thị chữ Việt, chẳng hạn .VnTime).

Bước 2: Ghi phần dữ liệu với mã TCVN3 ra file CSV (Chọn Save As... > Chọn Save as type là CSV (Comma delimited) (*.csv) > Đặt tên file rồi Save).

Bước 3: Dùng Notepad mở file .CSV rồi đổi từ mã TCVN3 sang Unicode (xem cách làm ở Bước 1), rồi chọn Save as... và ghi lại với Encoding là UTF-8.

* Cách 2:

Bước 1: Ghi vùng dữ liệu với Unicode ra file .TXT với lựa chọn Unicode Text (.txt) như Bạn đã làm (khi đó các cột được phân cách bởi dấu tab).

Bước 2: Mở file .TXT bằng Ms Word rồi tìm và thay thế mọi dấu tab (^t) bởi dấu phảy (,). Ghi lại với lựa chọn Plain Text (.txt) và encoding là Unicode.

Chúc Bạn thành công.

Hoặc

Có 1 giải pháp khá đơn giản là: 

B1: bạn "save as" file excel dạng *.txt
B2: bạn mở file txt bằng notepad và và lại chọn "save as" tiếp.
B3: trong mục file name bạn nhập vào tên file csv theo đúng mẫu sau: "file_name.csv". 
Chú ý là phải đi kèm nháy kép trong file_name nhé bạn. 
Ví dụ tôi sẽ đánh vào mục file name: "output.csv" (có kèm dấu nháy kép) 
Đây là file csv lấy tab làm dấu phân cách, bạn có thể dùng tính năng Find&Replace để chuyển tab thành dấu ",". Bây giờ bạn đã có file csv như ý muốn rồi đấy!
Đã checked!

Ngoài ra các bạn có thể dùng Macro để convert

Blog tổng hợp những kinh nghiệm được học, áp dụng và chia sẻ

Hướng dẫn xóa bản quyền Blogspot và link của bản quyền template

( Khởi nghiệp với Internet)

Trước hết, mình không khuyến khích các bạn xóa bỏ bản quyền này vì nó nhưng một dạng ủng hộ người đã tạo ra template để chúng ta sử dụng, nó như một lời cảm ơn. Còn nếu điều đó là cần thiết thì đây sẽ là hướng dẫ xóa bỏ link bản quền template trong blogspot.

Cách xóa bỏ link bản quyền của template

Đầu tiên chúng ta cần xem blog của chúng ta có link bản quyền ẩn hay là không ẩn. Nếu không ẩn thì quá dễ rồi. Nếu ẩn các bạn vui lòng làm theo các bước sau

Blogsport

Các bước xóa bỏ link bản quyền template

B1: Đăng nhập > Mẫu > Chỉnh Sửa

Các bạn tìm đến đoạn mã hóa của template bằng cách nhấn ctrl + F và tìm đến đoạn //<![CDATA[

Đoạn mã hóa trong template blogspot

Đây là đoạn mã mà người tạo ra template đã mã hóa nó. 

B2: Copy đoạn code ẩn trong template blogspot để phân tích

Bạn copy nguyên đoạn có màu đỏ này và paste vào đây: http://ddecode.com/hexdecoder

Xong nhấn vào Decode bạn sẽ thấy những bản phân tích hiện ra, nhìn kỹ chút sẽ thấy link ẩn của mà blogspot của bạn đang có.

Đoạn mẫ hóa được phân tích

B3: Tìm mã hóa link ẩn trong blogspot

Các bạn copy link ẩn mà các bạn đang dính vào đây: http://www.convertstring.com/vi/EncodeDecode/HexEncode

Lúc đó phần mềm sẽ gửi cho bạn một đoạn mã số, bạn thêm "\x" vào giữa 2 số và sẽ được như sau:

\x68\x74\x74\x70\x3A\x2F\x2F\x62\x6C\x6F\x67\x63\x75\x61\x73\x65\x6F\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x2F

B4: Tìm đoạn mã hóa link trong template blogspot

Sau khi có đoạn mã, bạn vào template và tìm trong blog bằng cách nhần Ctrl + F và paste vào để tìm sẽ hiện ra đoạn mã hóa.

B5: Thay đoạn link mã hóa bằng link mã hóa của chúng ta

Quay lại phần mềm mã hóa link, ta nhập link mà chúng ta cần thay vào và làm theo các bước 3 và bước 4. Ta chỉ việc thay đoạn mã hóa link của họ bằng link của chúng ta là được.

Xong, chúc các bạn thành công!

Cách Xóa Credit Link Trong Template Blogger

Nhiều trang web Templateism, Templateify, Waythemes, Sora,... là những nơi cung cấp Template cho Blogger với chi phí thấp, thậm chí là miễn phí. Nếu bạn mua bản quyền các Template này của họ thì vấn đề gỡ Credit Link chỉ là chuyện nhỏ. Những website này cung cấp các Template hầu như là đều báo trước cho bạn không xoá Credit Link đi, Nếu bạn cố làm điều đó thì trang web của bạn sẽ tự động chuyển hướng sang website của họ. Bởi vì họ đã gắn JavaScript vào các Template miễn phí này.

Do đó chỉ cần chúng ta đừng thay đổi và giữ đường link bản quyền của họ thì mọi việc diễn ra bình thường, Template hoạt động tốt. Tuy nhiên mình thấy rằng việc để đường link như vậy thường gây khó chịu cho các bạn làm web. Bởi vì những newbie khi mới làm Blog thường không muốn đầu tư tiền vào việc mua các Premium Template mà chỉ sử dụng các Template miễn phí, chuyên nghiệp. Do đó, trong bài viết này mình sẽ chia sẽ cách bỏ liên kết ở Footer trong Blogger và không bị redirect đến website nào.

CÁCH BỎ LINK BẢN QUYỀN TRONG TEMPLATE BLOGGER

Thực sự thì các link này được gắn thêm 1 số Script hoặc CSS. Do đó bạn chỉ cần tìm kiếm chúng trong  HTML và sau đó xóa chúng đi hoặc thêm vào. Trong trường hợp này bạn chỉ có thể ẩn chúng đi bằng CSS. Phương pháp này thực sự đơn giản, chỉ mất của bạn 2 phút.

Bước 1: Xác định Link Created by...trong HTML

Trong trường hợp của mình là Created By Sora Templates nhé, Nhấp chuột phải ngay chỗ cần xóa > Kiểm tra phần tử  hoặc chỉ cần nhấn F12 là thấy như trong hình dưới đây.

Bước 2: Đăng nhập vào tài khoản Blogger > Mẫu > Chỉnh sửa HTML

Bạn cần tìm đoạn id="mycontent" với tổ hợp phí Ctrt + F trong phần HTML. Và vị trí của nó như hình bên dưới, tùy Template thì cách trình bày khác nhau nhưng đây là cách cơ bản giúp bạn tìm thấy đúng vị trí nhanh nhất.

Bước 3: Thêm style="visibility: hidden"

Chỉ cần Copy đoạn CSS ở trên và thêm vào sau id='mycontent' như hình dưới đây.

Bước 4: Lưu Mẫu và Xem Blog để xem sự thay đổi

Lưu ý

• Một số Template không cho bạn đụng chạm vào liên kết bản quyền cuả họ, chỉ cần thêm bất cứ Css vào là chuyển hưởng về trang họ ngay, do đó bạn cần test trước khi làm nội dung.
• Ẩn chứ không hoàn toàn mất đi, về mặt giá trị SEO thì mình vẫn đang làm Backlink cho họ, không xóa hoàn toàn được đâu, miễn phí thì có cái giá của nó nhé, chúc các bạn thành công.

Blog tổng hợp những kinh nghiệm được học, áp dụng và chia sẻ

Hướng dẫn import bài viết vào Blogspot

( Khởi nghiệp với Internet)

Về cơ bản chúng ta cần quan tâm tới những vấn đề sau

1. Category trong blogspot

– Cấu trúc Category trong Blogspot có dạng :

<ns0:category scheme='http://www.blogger.com/atom/ns#' term='demo 1'/>

– Nếu bài viết nằm ở nhiều mục thì chúng ta có thể khai báo như dưới đây :

<ns0:category scheme='http://www.blogger.com/atom/ns#' term='demo 1'/>

<ns0:category scheme='http://www.blogger.com/atom/ns#' term='demo 2'/>

<ns0:category scheme='http://www.blogger.com/atom/ns#' term='demo 3'/>

2. Nội dung bài viết trong Blogspot

– Nội dung bài viết của Blogspot thường được nằm trong thẻ:

<ns0:content type="html">Đây là nội dung</ns0:content>

3. Định dạng về thời gian trong Blogspot

– Định dạng cơ bản của bài viết trong Blogspot là Năm-Tháng-NgàyTGiờ-Phút-Giây.001-07:00, với các thông số sau là về múi giờ.
– Ví dụ về định dạng ngày tháng của Blogspot: 2013-10-29T04:22:00.001-07:00

nếu file XML có hàng nghìn bài viết thì làm sao để chỉnh tất cả post theo thơi gian lần lượt 3h//post

public function generateDate($days = 0){$dayTime = 24 * 60 * 60;$timeRange = floor($dayTime / $this->postPerDay);$randomTimeArr = array();for($i = 0; $i < $this->postPerDay; $i++){// Day$randomTime = ceil(time() / 3600) * 3600 + ($days * $dayTime);// Random time in $timeRange$randomTime += $timeRange;$randomTime += $timeRange * $i + floor($timeRange * (rand(0, 1000) / 1000));$randomTime += $this->adjustDateTime;// Format Date$randomTime = date($this->timeFormat, $randomTime);// Add random time$randomTimeArr[$i] = $randomTime;}
return $randomTimeArr;

1 triệu bài viết cũng OK nhé, chỉ việc điền vào số post/1 ngày là 8, như vậy sau khoảng thời gian ngẫu nhiên 3h thì blogspot sẽ post 1 bài.

1 1. Cấu trúc file XML đơn giản nhất của bài viết trên Blogspot:
2 2. Cấu trúc bài viết trên file XML có kèm Category:
3 3. Cấu trúc bài viết trên file XML có kèm Category, Time:
4 4. Cấu trúc bài viết trên file XML với nhiều Category, Entry:
– Có rất nhiều cách để import nội dung vào Blogspot của Google. Tuy nhiên, cách phổ biến nhất vẫn là import trực tiếp file XML vào Blogspot.
– Để import được chúng ta phải hiểu cấu trúc của một bài viết trên Blogspot.

1. Cấu trúc file XML đơn giản nhất của bài viết trên Blogspot:

<?xml version='1.0' encoding='UTF-8'?> 
<ns0:feed xmlns:ns0="http://www.w3.org/2005/Atom"> 
<ns0:generator>Blogger</ns0:generator>
<ns0:entry> 
<ns0:category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/blogger/2008/kind#post" /> 
<ns0:id>BLOGGER TEST</ns0:id> 
<ns0:content type="html">Blogger CONTENT</ns0:content> 
<ns0:published>2013-10-29T03:22:00.001-07:00</ns0:published> 
<ns0:title type="html">BLOGGER TITLE</ns0:title> 
</ns0:entry> 
</ns0:feed>

2. Cấu trúc bài viết trên file XML có kèm Category:

<?xml version='1.0' encoding='UTF-8'?> 
<ns0:feed xmlns:ns0="http://www.w3.org/2005/Atom"> 
<ns0:generator>Blogger</ns0:generator>
<ns0:entry> 
<ns0:category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/blogger/2008/kind#post" /> 
<ns0:category scheme="http://www.blogger.com/atom/ns#" term="CATEGORY A" />
<ns0:id>BLOGGER TEST</ns0:id> 
<ns0:content type="html">Blogger CONTENT</ns0:content> 
<ns0:title type="html">BLOGGER TITLE</ns0:title> 
</ns0:entry> 
</ns0:feed>

3. Cấu trúc bài viết trên file XML có kèm Category, Time:

<?xml version='1.0' encoding='UTF-8'?> 
<ns0:feed xmlns:ns0="http://www.w3.org/2005/Atom"> 
<ns0:generator>Blogger</ns0:generator>
<ns0:entry> 
<ns0:category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/blogger/2008/kind#post" /> 
<ns0:category scheme="http://www.blogger.com/atom/ns#" term="CATEGORY A" />
<ns0:id>BLOGGER TEST</ns0:id> 
<ns0:content type="html">Blogger CONTENT</ns0:content> 
<ns0:published>2013-10-29T03:22:00.001-07:00</ns0:published> 
<ns0:title type="html">BLOGGER TITLE</ns0:title> 
</ns0:entry> 
</ns0:feed>

4. Cấu trúc bài viết trên file XML với nhiều Category, Entry:

<?xml version='1.0' encoding='UTF-8'?> 
<ns0:feed xmlns:ns0="http://www.w3.org/2005/Atom"> 
<ns0:generator>Blogger</ns0:generator>

<ns0:entry> 
<ns0:category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/blogger/2008/kind#post" /> 
<ns0:category scheme='http://www.blogger.com/atom/ns#' term='demo 1'/>
<ns0:category scheme='http://www.blogger.com/atom/ns#' term='demo'/>
<ns0:id>BLOGGER TEST 1</ns0:id> 
<ns0:content type="html">Blogger CONTENT 1</ns0:content> 
<ns0:published>2013-10-29T04:22:00.001-07:00</ns0:published> 
<ns0:title type="html">BLOGGER TITLE 1</ns0:title> 
</ns0:entry> 

<ns0:entry> 
<ns0:category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/blogger/2008/kind#post" /> 
<ns0:category scheme='http://www.blogger.com/atom/ns#' term='demo 2'/>
<ns0:category scheme='http://www.blogger.com/atom/ns#' term='demo'/>
<ns0:id>BLOGGER TEST 2</ns0:id> 
<ns0:content type="html">Blogger CONTENT 2</ns0:content> 
<ns0:published>2013-11-29T03:22:00.001-07:00</ns0:published> 
<ns0:title type="html">BLOGGER TITLE 2</ns0:title> 
</ns0:entry> 

</ns0:feed>

– Như vậy, nếu hiểu rõ được cấu trúc trên, chúng ta có thể hoàn toàn import được một số lượng bài viết khổng lồ với thời gian được lập lịch sẵn và ngẫu nhiên post vài từng giờ, từng ngày…Với tính năng như vậy sẽ đảm bảo cho việc post bài đều đặn, điều độ trên Blogspot –>> rất tốt cho SEO.
Blog tổng hợp những kinh nghiệm được học, áp dụng và chia sẻ

Hiển thị Widget ở những trang nhất định trong Blogspot

( Khởi nghiệp với Internet)

Đối với các blog có nhiều chủ đề thì việc sử dụng nhiều Widget (Tiện ích) là điều không tránh khỏi. Do vậy làm thế nào để các Wiget tiện ích đó hiển thị đúng nơi, đúng chỗ là điều mà các Blogger phải tínht oán và cân nhắc rất kỹ.

Việc bố trí các Widget trên Template một cách hợp lý sẽ làm nổi bật nội dung cần truyền tải, logic và hài hòa với bố cục Blog.

Chính vì lý do đó, hôm nay Namkna xin được giới thiệu đến bạn đọc những thủ thuật nhỏ để “hiển thị Widget ở những trang nhất định trong Blogspot”, tiến hành như sau :

» Bước 1: Xác định ID của Wdget tiện ích cần tùy biến theo thủ thuật này.

1.1- Vào Bố cục (Layout) -> Nhấp vào Chỉnh sửa (Edit) trên Widget cần xử lý

1.2 - Một cửa sổ Popup bật lên, bạn nhìn vào phía trên góc phải (gần thanh tiêu đề) sẽ thấy dòng có dạng tương tự sau: …null&widgetId=HTML10(trong trường hợp này là widget HTML10, đối với widget khác sẽ có ID khác)

- Sau khi xác định được Id của tiện ích bạn đóng cửa sổ popup đó lại và tiến hành bước tiếp theo nha.

Bước 2: Ẩn hiện  Widget ở những trang nhất định trong Blogspot

2.1- Bạn vào Mẫu (Template) => vào Chỉnh sửa HTML (Edit HTML) để tìm Id widget đó trong Template (trường hợp này là HTML10) Hãy sử dụng chức năng Tìm kiếm nội tuyến để tìm nó.
- Ngoài ra bạn có thể tìm kiếm trực tiếp nó trên thanh menu của phần chỉnh sửa blogger bằng cách bấm vào Chuyển đến tiện ích như hình dưới.

- Bạn sẽ được chuyến đến tiện ích đó (nhưng nó sẽ bị thu nhỏ) do vậy hãy bấm vào mũi tên màu đen nằm ở trước đoạn code của tiệ ích để mở rộng nó ra:

- Sau khi mở rộng nó ra bạn sẽ được đoạn code tương tự như sau:

<b:widget id='HTML10' locked='false' title='' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>

- Như vậy, ta đã xác định được ID cũng như vị trí và nội dung của Widget, Bây giờ Mình sẽ thêm lệnh ẩn hoặc hiện  Widget ở 2 vị trí là:

• Vị trí 1: Sau thẻ mở <b:includable id='main'> Phần này bạn thay dổi theo các mã mình cung cấp bên dưới.
• Vị trí 2: Thêm lệnh </b:if> vào trước thẻ đóng  như sau </b:includable> phần này dung chung cho tất cả các thủ thật bên dưới.

- Khi đó bạn có đoạn code mới dạng như sau.

<b:widget id='HTML10' locked='false' title='' type='HTML'>
<b:includable id='main'>
<-- Vị trí 1 -->
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
 </b:if>
</b:includable>
</b:widget>

2.2-  Đến đây bạn thay chữ <-- Vị trí 1 --> thành một trong các đoạn code tương ứng bên dưới:

2.2.1. Chỉ hiển thị Widget ngoài trang chủ

- Thay chữ <-- Vị trí 1 --> thành đoạn code sau:

<b:if cond='data:blog.url == data:blog.homepageUrl'>

2.2.2. Chỉ hiển thị Widget ở trang Archive

- Thay chữ <-- Vị trí 1 --> thành đoạn code sau:

<b:if cond='data:blog.pageType == &quot;archive&quot;'>

3. Chỉ hiển thị Widget ở trang bài viết

- Thay chữ Vị trí 1 thành đoạn code sau:

<b:if cond='data:blog.pageType == &quot;item&quot;'>

4. Chỉ hiển thị Widget ở trang Static Page

- Thay chữ Vị trí 1 thành đoạn code sau:

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>

5. Chỉ hiển thị Widget ở những trang với liên kết cụ thể

- Thay chữ Vị trí 1 thành đoạn code sau:

<b:if cond='data:blog.url == "URL của trang chỉ định"'>

- Trong đó URL của trang chỉ định là địa chỉ của trang nhãn hay bài viết. Ví dụ mình muốn HTML10 bên trên chỉ hiển thị trong bài viết nyaf thì mình thay chữ Vị trí 1 bằng đoạn code sau:

<b:if cond='data:blog.url == "http://namkna.blogspot.com/2011/07/hien-thi-widget-o-nhung-trang-nhat-inh.html"'>

6. Chỉ hiển thị Widget ở Trang chủ, trang Label và trang Archive

- Thay chữ Vị trí 1 thành đoạn code sau:

<b:if cond='data:blog.pageType == &quot;index&quot;'>

* Ở trên bạn có thể thấy mình cố ý đánh dấu “==” bằng màu đỏ, có nghĩa là, bạn hoàn toàn có thể thay dấu “==” bằng dấu “!=” sẽ mang ý nghĩa khác.

Qui ước :

== : “bằng” hoặc tương đương - Tức là chỉ hiện thị khi thỏa mãn điều kiện mà ta đưa ra.

!= : “khác” hoặc không tương đương - Tức là không hiển thị khi thỏa mãn điều kiện ta đưa ra.

Ví dụ, nếu bạn muốn Widget HTML10 hiển thị ở tất cả các trang khác ngoại trừ trang chủ, thì ta thay chữ Vị trí 1 bằng đoạn code sau:

<b:if cond='data:blog.url != data:blog.homepageUrl'>

Tùy biến nâng cao sử dụng kết hợp các điều kiện

Vì một lý do nào đó, bạn chỉ muốn hiển thị widget ở trang A và trang B hoặc hiển thị khi thỏa mãn là trang A hoặc trang B, ta sẽ kết hợp các điều kiện với nhau như sau :
- Khi đó ta phải thêm 2 thẻ đóng  </b:if> vào trước thẻ đóng </b:includable> của Widget như sau: 

<b:widget id='HTML10' locked='false' title='' type='HTML'>
<b:includable id='main'>
 Vị trí 1
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
 </b:if></b:if>
</b:includable>
</b:widget>

- Trong đó phần màu vàng là nội dung của Widget. 
- Tiếp theo thay lệnh điều kiện cho các Wiget như sau: 

A. Trường hợp 1 : chỉ hiển thị widget khi thỏa mãn 2 hay nhiều điều kiện

- Thay chữ Vị trí 1 thành đoạn code sau:

<b:if cond='data:blog.url != "Điều kiện 1"'>
<b:if cond='data:blog.url != "Điều kiện 2"'>

- Ví dụ, hiển thị widget ở tất cả các trang ngoại trừ chuyên mục IDM - Download và Blogspot - tips :

<b:if cond='data:blog.url != "http://namkna.blogspot.com/search/label/IDM-Downloand"'>
<b:if cond='data:blog.url != "http://namkna.blogspot.com/search/label/Blogspot-tips "'>
nội dung widget
</b:if></b:if>

B. Trường hợp 2 : chỉ hiển thị widget khi thỏa mãn một trong các điều kiện

- Thay chữ Vị trí 1 và đoạn màu vàng thành đoạn code sau:

<b:if cond='data:blog.url == "Điều Kiện 1"'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
<b:else/>
<b:if cond='data:blog.url == "Điều Kiện 2"'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
<b:else/>

Ví dụ, chỉ hiển thị widget ở chuyên mục IDM - Download hoặc  Blogspot - tips

<b:if cond='data:blog.url == "http://namkna.blogspot.com/search/label/IDM-Downloand"'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
<b:else/>
<b:if cond='data:blog.url == "http://namkna.blogspot.com/search/label/Blogspot-tips"'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
<b:else/>
</b:if></b:if>

Bạn Save Template Lưu Mẫu  Xem kết quả nha.

Chúc các bạn thành công !

Blog tổng hợp những kinh nghiệm được học, áp dụng và chia sẻ- theo Blogger namkna