Breaking News

Game Offlile Hay

Thủ thuật máy tính

Thủ thuật Blogspot

Showing posts with label Thủ thuật Blogspot. Show all posts
Showing posts with label Thủ thuật Blogspot. Show all posts

Sửa lỗi thẻ H1 tại trang chủ và trang bài viết trong Blogspot

Sửa lỗi thẻ H1 tại trang chủ và trang bài viết trong Blogspot

Trường hợp 1:Không sử dụng logo

Trong trường hợp này blogger sẽ lấy tiêu đề blogspot là chữ làm thẻ H1
Tại trang chủ mọi chuyện rất ổn vì tiêu đề blog là H1 và tiêu đề bài viết là h3 hoặc h2 tùy thuộc vào người chỉnh template.
Nhưng ở trang bài viết lại xẩy ra vấn đề là có 2 thẻ H1 vì 1 của tiêu đề blog và 1 của tiêu đề bài viết sau khi đã tối ưu thẻ h3 thành h1

Trường hợp 2: Sử dụng logo(hình ảnh) thay cho tiêu đề blog

Trong trường hợp này blogger tự động xóa bỏ thẻ h1 và thay thế là hình ảnh do vậy trang chủ không có thẻ H1

Nếu các bạn kiểm tra trên một số công cụ seo online thì thấy rõ vấn đề này.

Vậy làm thế nào để khắc phục việc thiếu và trùng lặp thẻ H1 tại trang chủ và trang bài viết.

Công việc cần làm là:

Đối với trường hợp 1:Không sử dụng logo(hình ảnh)

Các bạn vào chỉnh sửa mẫu tìm tới đoạn:

<div id='header-wrapper'>

Thay nó thành:

<div id='header-wrapper' itemscope='itemscope' itemtype='http://schema.org/Organization'>

Công đoạn này cần tiến hành cho cả 2 trường hợp.

Sau đó sửa đoạn:

<!--No header image -->
<div id='header-inner'>
<div class='titlewrapper'>
<h1 class='title'>
<b:include name='title'/>
</h1>
</div>

Tôi lấy cả <!--No header image --> để các bạn dễ nhận thấy nó trong mẫu.
Thành:

<!--No header image -->
<div id='header-inner'>
<div class='titlewrapper'>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<h2 class='title'>
<b:include name='title'/></h2>
</b:if>
</div>

Đối với trường hợp 2: Sử dụng logo thay cho tiêu đề blog(trường hợp này là phổ biến)

Với trường hợp này bạn tìm tới đoạn code:

<!--Show the image only-->
<div id='header-inner'>
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block' title=''/>
</a>
<!--Show the description-->

Nhưng ta chỉ cần thay từ

<a expr:href='data:blog.homepageUrl' style='display: block'>
......Tới........
</a>

Và thay nó thành:

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<h1 itemprop='name'>
<a expr:href='data:blog.homepageUrl' itemprop='url' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span>Tiêu đề blog</span></a>
</h1>
<b:else/>
<h2 itemprop='name'>
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span>Tiêu đề blog</span></a></h2>
</b:if>

Thay Tiêu đề blog thành Tiêu đề blog của bạn.
Tại phần CSS trong mẫu sửa:

.header h1 a {

Thành

.header h1 a,.header h2 a {

Sau đó thêm vào trước thẻ ]]></b:skin>

Đoạn code sau:

.header h1 a,.header h2 a, .header h1 a:visited, .header h2 a:visited{color:#fff; font-size:10px;text-decoration:none;margin:0;padding:0}
.header h1 span, .header h2 span{text-indent:-999em; display:block;}
Read more ...

Cách giảm link out trên blogspot (giảm External links)


Để giảm số link out trên blogspot bạn chỉ cần làm 1 bước hết sức đơn giản đó là tìm đến đoạn mã <b:include name='quickedit'/> và xóa nó đi.

Mỗi một tiện ích có 1 đoạn mã này bạn xóa nó đi là xong. Tiện ích đó vẫn chạy như bình thường và hoàn toàn không có link out.


Và đặc biệt với các Template blogger có giao diện chuyên nghiệp thì số tiện ích trên blog lại càng nhiều. Như thường lệ thì mỗi một tiện ích sẽ out ra 1 link. Việc xóa đi đoạn mã trên không chỉ giảm lượng link out cho blogspot mà còn khiến cho blog của bạn tuân theo chuẩn HTML 5 một chuẩn rất quan trọng cho SEO hiện nay.

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

Read more ...

Cách thêm một hay nhiều widget (tiện ích bất kỳ) vào vị trí bất kỳ trong blogspot

Cách thêm một hay nhiều widget (tiện ích bất kỳ) vào vị trí bất kỳ trong blogspot. Thêm tiện ích HTML/Javascripts vào blogger.

Các bạn thường download những template blogspot với một form định sẵn, nên đôi khi các bạn muốn thêm một hay nhiều tiện ích ở một vị trí bất kỳ khác với những vị trí đã có sẵn thì làm thế nào?

Cách thêm một hay nhiều widget vào vị trí bất kỳ trong blogspot

Mình xin chia sẻ một thủ thuật blog đơn giản cho những bạn mới biết về blogspot.

Thường thì trong bố cục blogspot sẽ phân ra một số vị trí như header,footer,sidebar, main,...và các bạn có thể thêm widget vào vị trí bất kỳ bằng cách copy đoạn code bên dưới và đặt cho phù hợp

Để thêm một hay nhiều widget vào vị trí bất kỳ trong blogspot thì bạn làm theo các bước sau :

Đăng nhập blog => Mẫu (cái thứ 2 từ dưới lên) => Chỉnh sửa HTML

Tới đây bạn có thể thêm phần code bên dưới vào phần bạn muốn hiển thị
(Ngoài ra bạn có thể down trực tiếp code về rồi dùng notepad ++ để chỉnh sửa cho dễ)

Cách thêm một widget thông thường vào Blogspot

Code này thì widget này sẽ hiển thị trên tất cả các trang trong blog như: trang chủ,trang bài viết,trang label....

<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML99' locked='false' title='Vn1Download' type='HTML'>
<b:includable id='main'>

<b:if cond='data:title != &quot;&quot;'>
<div class='title-left'><data:title/></div>
</b:if>
<div class='box-left'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>

Chú ý phần chữ màu đỏ là phần bạn cần thay đổi:

- sidebar1 , HTML99: phần này bạn cần thay đổi nếu bạn thêm > 2 widget vào blogspot (Nếu bạn thêm > 2 cái thì 2 cái bạn thêm phải có phần này đặt tên khác nhau)

Ví dụ: Cái 1 bạn đặt là : id='sidebar1'id='HTML99' thì cái sau bạn phải đặt khác đi đổi thành id='sidebar2'id='HTML100' chẳng hạn

Các bạn chú ý thay  id='sidebar1'id='HTML99'  cho đỡ trùng với 1 Widget đã có sẵn trên blog. Nếu bạn nào thấy trùng thì thay bằng số khác nhé.

- title='Vn1Download' : Tên Widget của bạn cái này bạn có thể bỏ trống được (bạn có thể để là title='' )


Một số cách hiển thị tùy biến bạn có thể áp dụng với Widget

1. Chỉ cho phép widget hiển thị ở trang chủ

<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- 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>
</b:section>

2. Chỉ cho phép widget hiển thị ở từng bài viết:

<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<!-- 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>
</b:section>

3. Chỉ cho phép widget hiển thị ở những trang nhất định:

<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == "Link của bạn"'>
<!-- 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>
</b:section>

Bạn hãy thay phần Link của bạn đường link mà bạn muốn widget đó hiển thị

Ví dụ: http://bittuot.blogspot.com/2013/07/crack-win-7-cho-moi-phien-ban.html

hoặc: http://bittuot.blogspot.com/search/label/Download .. tùy ý thích của bạn

Khi bạn chọn đường link như vậy thì khi bạn click đến link đó widget mới hiển thị, còn những đường dẫn khác widget đó sẽ không hiển thị

4. Widget chỉ hiển thị trên các trang Label

Trang label là trang có định dạng kiểu: http://vn1download.blogspot.com/search/label/Game PC

<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML4' locked='false' title='test 1' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.searchLabel'> 
<!-- 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>
</b:section>

5. Widget chỉ hiển thị trên các trang Static pages 

Trang Static pages là trang có định dạng kiểu:  http://vn1download.blogspot.com/p/index.html

<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML4' locked='false' title='test 1' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "static_page"'>
<!-- 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>
</b:section>

6. Widget hiển thị trên trang tìm kiếm

Trang Static pages là trang có định dạng kiểu:  http://vn1download.blogspot.com/search?q=deadpool
Là trang hiển thị các kết quả tìm kiếm trên trang của bạn.

<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML4' locked='false' title='test 1' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.searchQuery'>
<!-- 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>
</b:section>

7. Widget chỉ hiển thị tại trang lưu trữ

Trang lưu trữ là trang có dạng kiểu: http://vn1download.blogspot.com/2014/02

<b:section class='sidebar' id='sidebar1' preferred='yes'>
<b:widget id='HTML4' locked='false' title='test 1' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "archive"'>
<!-- 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>
</b:section>

Theo Bít Tuốt

LIKE hoặc SHARE nếu thấy bài viết có ích
Read more ...

Cách cài đặt 1 bài viết luôn nằm trên đầu trong Blogger

Cách cài đặt 1 bài viết luôn nằm trên đầu trong Blogger


Thấy có nhiều người hỏi làm sao để 1 bài duy nhất ở trang chủ và set cho nó luôn nằm ở top đầu, tức là bài viết mới nhất. Cho nên sẵn mình làm luôn bài hướng dẫn cho ai có nhu cầu tìm hiểu.

Về vấn đề đặt duy nhất 1 bài viết trên trang chủ thì quá đơn giản rồi, chỉ cần set bài đăng hiển thị là 1 thôi.


Còn về vấn đề làm sao để cố định 1 bài viết mà mình muốn nó lúc nào cũng hiển thị trên top đầu tiên của trang chủ blog, tức là set cho nó là bài viết mới nhất, cho dù có đăng gì tiếp theo đi chăng nữa thì nó vẫn là thằng mới nhất và nằm trên top đầu.

Cũng rất đơn giản, sau khi đăng xong bài viết bạn chỉ cần vào edit post, và chỉnh lại phần thời gian là xong :D

Giả sử như thời điểm hiện tại mình viết topic này, thì là vào ngày 23/10/2013, thì mình sẽ set thời gian cho bài đăng mình muốn ghim trên đầu thành 12/12/2013, hoặc 2014, 2015 luôn, bao nhiêu cũng được là phải nằm ở tương lai. Thì khi đó bài đăng đó sẽ luôn nằm top.



Like hoặc +1 nếu thấy bài viết có ích! 

Read more ...

Hướng dẫn xóa bỏ dòng "Cung cấp bởi Blogger"

Hướng dẫn xóa bỏ dòng "Cung cấp bởi Blogger"


Blogger có 1 sức mạnh khủng khiếp, nhưng nhiều người chưa hiểu rõ được công dụng của nó.
Khi chúng ta sử dụng template của blogger, thường hay dính chữ [ Được cung cấp bởi Blogger], hôm nay mình sẽ hướng dẫn các bạn xóa dòng chữ đó để website của mình trông bắt mắt hơn.

1. Các bạn vào Mẫu -> Chỉnh sửa HTML và tìm dòng chữ sau

    ' attribution '

Tiếp theo để ý dòng chữ sau

    <b:widget id='Attribution1' locked='true' title='' type='Attribution'>

Thay thế từ true (màu xanh) thành false và lưu mẫu lại

2. Cuối cùng vào Bố cục tìm tiện ích [Định cấu hình Thuộc tính] Cung cấp bởi blogger và xóa đi là xong.





Like hoặc +1 nếu thấy bài viết có ích!
Read more ...

Cách lấy ảnh Thumbnail của video làm ảnh đại diện cho bài viết Blogspot



Cách lấy ảnh thumbnail của video làm ảnh đại diện cho bài viết Blogspot thường hay áp dụng cho những Blog dạng Video (Youtube, Dailymotion, Vimeo) or Phim ảnh.
Read more ...

Tự động thêm thuộc tính Title và Alt cho hình ảnh trên Blogspot


Tự động thêm thuộc tính Alt và Title cho hình ảnh

Chia sẻ code tự động thêm thuộc tính Alt, Title cho hình ảnh trong bài viết Blogspot giúp các blogger tiết kiệm được thời gian trong quá trình viết bài và là thủ thuật rất có ích cho những blog chuyên về hình ảnh.
Read more ...

Thủ thuật ẩn tiện ích ở trang chủ hoặc trang bài viết

An tien ich o trang chu hoac trang bai viet

Đôi khi chúng ta cần ẩn một hay nhiều Widget hoặc một thành phần nào đó tại trang chủ hoặc trang riêng biệt nào đó để giúp dễ dàng hơn trong việc bố trí thiết kế trang chủ blogspot theo ý thích của người tạo blog. Hôm nay tôi sẽ hướng dẫn cách ẩn tiện ích và thành phần ở một phần riêng biệt nào đó của blog.

Muốn ẩn một tiện ích hoặc một thành phần nào đó thì ta phải xác định được id hoặc class của nó. Các id thông thường trong blogspot như là: HTML1, HTML2, HTML3, …, Label1, Label2, Label3, …, BlogList1, Followers1, Blog1, BlogArchive1, Profile1, header-wrapper, sidebar, main-wrapper, footer-wrapper, comments, comments-block, … Các id khi đưa vào CSS có dấu # ở phía trước, ví dụ: #HTML1. Các class thường gặp trong blogspot như: header-outer, main-outer, footer-outer, post-body, post-footer, … Các class khi đưa vào CSS có dấu . (dấu chấm) ở phía trước, ví dụ: .header-outer.

Trước hết phải xác định id của tiện ích mà bạn muốn ẩn:

- Các bạn vào Bố cục → Nhấp vào Chỉnh sửa trên Tiện ích cần xử lý.
- 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=HTML1 (trong trường hợp này là tiện ích HTML1, đối với tiện ích khác sẽ có ID khác)



Lấy ví dụ muốn ẩn tiện ích có id là HTML1 ở trang chủ thì đặt đoạn code sau đây vào sau dòng ]]</b:skin> trong Template.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
#HTML1 {display:none !important;visibility:hidden !important}
</style>
</b:if>

Nếu muốn ẩn nhiều tiện ích ở trang chủ, ví dụ các tiện ích có id lần lượt là HTML1, Label1, Followers1 thì sử dụng đoạn code sau:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
#HTML1, #Label1, #Followers1 {display:none !important;visibility:hidden !important}
</style>
</b:if>

Nếu muốn ẩn tiện ích có id là HTML1 ở các trang bài viết thì sử dụng đoạn code sau:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#HTML1 {display:none !important;visibility:hidden !important}
</style>
</b:if>

Nếu muốn ẩn tiện ích có id là HTML1 ở các trang chính gồm trang chủ, trang nhãn, trang lưu trữ thì sử dụng đoạn code sau:

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<style type='text/css'>
#HTML1 {display:none !important;visibility:hidden !important}
</style>
</b:if>

Nếu muốn ẩn tiện ích có id là HTML1 ở các trang lưu trữ thì sử dụng đoạn code sau:

<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<style type='text/css'>
#HTML1 {display:none !important;visibility:hidden !important}
</style>
</b:if>

Nếu muốn ẩn tiện ích có id là HTML1 ở các trang tĩnh thì sử dụng đoạn code sau:

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<style type='text/css'>
#HTML1 {display:none !important;visibility:hidden !important}
</style>
</b:if>

Nếu muốn ẩn tiện ích có id là HTML1 ở một trang riêng biệt nào đó thì sử dụng đoạn code sau:

<b:if cond='data:blog.url == &quot;URL của trang riêng biệt&quot;'>
<style type='text/css'>
#HTML1 {display:none !important;visibility:hidden !important}
</style>
</b:if>

Trong trường hợp muốn ẩn tiện ích có id là HTML1 ở trang chủ, các trang nhãn, các trang lưu trữ mà không ẩn ở các trang bài viết thì sử dụng đoạn code sau:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type='text/css'>
#HTML1 {display:none !important;visibility:hidden !important}
</style>
</b:if>

Như vậy khi chúng ta muốn ẩn một cái gì đó thì chúng ta chỉ cần biết ID hoặc Class của thành phần đó. Chúc các bạn thành công.

Like hoặc +1 nếu thấy bài viết có ích!
Read more ...

Thêm biểu tượng chat yahoo vào website (blog)




Đối với các website, blog yêu cầu hỗ trợ khách hàng thì yahoo là một lựa chọn khá tốt, làm thế nào để khách hàng biết bạn đang online / offline để yêu cầu sự trợ giúp từ bạn, dưới đây là đoạn code đơn giản giúp bạn làm điều đó. Nó sẽ tạo một biểu tượng yahoo online / offline trên website, blog.
Read more ...

Bộ code mạng xã hội Facebook G+ Twitter Share cho Website (Blog)

code mang xa hoi cho website

Thủ thuật blog chia sẻ bộ code mạng xã hội (Social Network) với nhiều cách hiển thị cho blog hay website đều có thể sử dụng được, giúp blog của bạn có thể kết nối gần hơn đến tất cả mọi người bởi tính lan truyền của nó.
Read more ...

Thủ thuật tạo Popup under cho blogger (Website)

tao popup under cho blog

Chia sẻ code tạo Popup-under, cách tạo Popup-under cho blogger và website. Trước khi đi vào hướng dẫn cụ thể chúng ta sẽ tìm hiểu thế nào là Popup-under và đặc điểm của nó.
Read more ...

Code quảng cáo xuất hiện ở góc phải cho blogger (website)

code quang cao o goc phai

Hướng dẫn chèn code quảng cáo xuất hiện ở góc dưới bên phải cho blogger hay website, giúp các bạn kiếm được một phần lợi nhuận từ việc bán quảng cáo để có thể duy trì và nâng cấp website của mình.

Bước 1: Đăng nhập vào Blog.
Bước 2: Vào Bố cục, thêm tiện tích HTML ở Sidebar hoặc Footer, copy đoạn code bên dưới và Paste vào.
Bước 3: Lưu mẫu và kiểm tra kết quả.

<script type="text/javascript">
function hide_float_right() {
    var content = document.getElementById('float_content_right');
    var hide = document.getElementById('hide_float_right');
    if (content.style.display == "none")
    {content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_right()">Tắt quảng cáo [X]</a>'; }
        else { content.style.display = "none"; hide.innerHTML = '<a href="javascript:hide_float_right()">Xem quảng cáo...</a>';
    }
    }
</script>
<style>
.float-ck { position: fixed; bottom: 0px; z-index: 9000}
* html .float-ck {position:absolute;bottom:auto;top:expression(eval (document.documentElement.scrollTop+document.docum entElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))) ;}
#float_content_right {border: 1px solid #01AEF0;}
#hide_float_right {text-align:right; font-size: 11px;}
#hide_float_right a {background: #01AEF0; padding: 2px 4px; color: #FFF;}
</style>
<div class="float-ck" style="right: 0px" >
<div id="hide_float_right">
<a href="javascript:hide_float_right()">Tắt Quảng Cáo [X]</a></div>
<div id="float_content_right">
<!-- Start quang cao-->
  <a href="http://bittuot.blogspot.com/" taget="_blank" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhft4_9jL8I4Vn3ZSzeNJCzAnCYuqVQJlSJpRFdsfzWq_yUK5krPld9yUH4cP-EWYlpyeBofz6ZdWTB_rBrWiGAMQCjDQhRHRkYoyoKWorIKW9OqIe8jomUsDj54mtLHR14ETuDrj91Ms/s1600/idc.gif" width="250" height="200"></a>
<!-- End quang cao -->

</div>
</div>

DEMO:



Like hoặc +1 nếu thấy bài viết có ích!
Read more ...

Thủ thuật tạo hiệu ứng ẩn hiện avatar comment cho blogger

code an hien avatar comment cho blogger
Thủ thuật blog sưa tầm và chia sẻ  code ẩn hiện avartar comment trên blogger nhìn rất vui mắt, thủ thuật này mục đích chỉ để trang trí cho Blogger thêm sinh động, cảm giác mới hơn khi Comments.Chỉnh sửa lại và sử dụng code của CSS3 Minimalistic Navigation Menu.

Chèn đoạn code bên dưới vào trước thẻ: ]]></b:skin>

.comments .avatar-image-container {float: left;width: auto;max-height: 56px;visibility: hidden;opacity: 0;left: 50px;position: relative;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.comment:hover .avatar-image-container { visibility: visible;opacity: 1;left: 0;}
#comments a {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;text-decoration: none;}
.comments .avatar-image-container {float: left;width: auto;max-height: 56px;visibility: hidden;opacity: 0;left: 50px;position: relative;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.comment:hover .avatar-image-container {visibility: visible;opacity: 1;left: 0;}
#comments a {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;text-decoration: none;}

Like hoặc Share nếu thấy bài viết có ích!



Read more ...

Thay đổi tên tác giả trên blogger




Thủ thuật Blog mình nói đến hôm nay là cách thay đổi tên tác giả trên Blogspot.

Có rất nhiều blogger muốn ẩn danh tính của mình với nhiều mục đích khác nhau. Theo mặc định Blogger sẽ lấy thông tin tác giả từ nguồn tài khoản Google Plus (G+) để thực hiện lên ngay trên hoặc dưới mỗi bài đăng, do lấy tên từ tài khoản G+ nên tên sẽ bị phụ thuộc vào chính sách đặt tên của Google, không được tùy biến như mình mong muốn.

Bước 1: Vào bảng điều khiển Blogger -> Mẫu (Template) -> Chỉnh sửa HTML


Bước 2: Ctrl+F tìm tới đoạn code:

                                                  <data:post.author/>
và thay thế nó bằng tên bạn muốn hiển thị, ở blog của mình là "Vn1Download"

- Nếu bạn muốn thông tin tác giả lấy từ nguồn Facebook, G+, Twitter... hoặc bất kỳ nguồn nào khác thì các bạn thay thế theo code sau:

                             <a href='link_nguồn' rel='author'>Tên_hiển_thị</a>


Ví dụ:

                 <a href='http://www.facebook.com/giaitri365' rel='author'>Vn1Download</a>


Like hoặc Share nếu thấy bài viết có ích!
Read more ...

Tạo banner chạy dọc hai bên cho website (blog)


Hướng dẫn tạo code javascipt banner quảng cáo chạy dọc 2 bên website (blog) đẹp mắt.

1. Đăng nhập vào Blog
2. Vào Mẫu (Template)
3. Chọn Chỉnh sửa HTML (Edit HTML)
4. Dán đoạn code bên dưới vào sau thẻ <head> :

<style type='text/css'>
#slideads{
position: absolute;
visibility: hidden;}
#slideads1{
left:0;
top:20px;
position: absolute;
}
#slideads2{
right:0;
top:20px;
position: absolute;
}
</style>
<script src='http://dl.dropbox.com/u/66256041/popup/namkna.blogspot.con/slide_ads1.js' type='text/javascript'/>

5. Paste đoạn code bên dưới vào sau thẻ <body>

 <div id="slideads">
<div id="slideads1" class="slideads1">
<a target="_blank" href="http://vn1download.blogspot.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-JYlxWmlGLSVdYZqiFZg-tk0PyOaGsG6AMmhXsdap9LkrZhSjXUJnjs0I1-pqayJZ-LoIJV73vm8KxO8OOuRmXBzf7Yl6RlAS1DIR0sDT2NxjiMltgbAzU_iajKhW7mMFqijW5jSHzWQ/s1600/right.png" border="0"/></a>
</div>
<div id="slideads2" class="slideads2">
  <a target="_blank" href="http://vn1download.blogspot.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-JYlxWmlGLSVdYZqiFZg-tk0PyOaGsG6AMmhXsdap9LkrZhSjXUJnjs0I1-pqayJZ-LoIJV73vm8KxO8OOuRmXBzf7Yl6RlAS1DIR0sDT2NxjiMltgbAzU_iajKhW7mMFqijW5jSHzWQ/s1600/right.png" border="0"/></a>
</div>
</div>

6. Việc còn lại giờ là sửa link ảnh = link ảnh của bạn, linh website = link website của bạn rồi Lưu lại!

Like hoặc Share nếu thấy bài viết có ích!
Chúc các bạn thành công!
Read more ...

Cách tạo sitemap cho blogspot


Sitemap là gì? Sitemap là thành phần rất quan trọng trong website của bạn, nó giúp cho các bộ máy tìm kiếm (Search Engine) dễ dàng Crawls website của bạn. Khi website của bạn cập nhật bài mới lập tức các Search Engine bots sẽ tìm kiếm và index bài viết của bạn nhanh hơn.

Có hai loại sitemap một loại là HTML sitemap và XML Sitemap.
  • HTML sitemap được sử dụng chủ yếu cho người đọc biết được sơ đồ của trang web và họ có thể dễ dàng tìm kiếm thông tin hơn.
  • Loại thứ hai là XML Sitemap được tạo ra để dành riêng cho các công cụ tìm kiếm. Nó báo cho các công cụ tìm kiếm về cấu trúc của trang web, tần suất cập nhật nội dung của trang và trang nào được ưu tiên hơn trong kết quả tìm kiếm.
Hôm nay mình xin chia sẻ với các bạn thủ thuật blog cách tạo sitemap rất đơn giản. Cách này áp dụng được cho cả các blogspot dạng *.blogspot.com và dạng Custom domain.

Bước 1: Các bạn vào đây để Generate sitemap cho blog của mình. Bạn điền địa chỉ blog của mình vào rồi bấm Generate Sitemap

Bước 2: Sau khi Generate xong sitemap, các bạn Copy hết tất cả kết quả trong khung hiển thị.


Bước 3: Các bạn đăng nhập vào phần quản trị blogspot của bạn. Vào Settings > Search Preferences  > Crawlers and indexing  > Chọn Edit ở chỗ Custom Rotbots.txt  > Paste hết những thứ đã Copy ở Bước 2 vào.

Save lại. Vậy là xong. Các search engine sẽ tự động tìm thấy file sitemap trên blog của bạn thông qua file robots.txt !
Sau khi blog của bạn có số lượng bài viết khoảng trên 500 bài thì các bạn lặp lại thao tác này 1 lần nữa.

Like và Share nếu thấy bài viết có ích!

Read more ...

Thêm tiện ích Facebook comment vào blogger

Mạng xã hội đã trở nên quá quen thuộc với mọi người và góp phần không nhỏ trong việc lan truyền,quảng bá hình ảnh website.Việc thêm tiện ích "Facebook comment" vào blog sẽ giúp khách tương tác tốt hơn với những bài viết trên blog của bạn.



Hướng dẫn:

Copy đoạn code bên dưới, chèn trước thẻ  <body>



 <div id='fb-root'/>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = &quot;//connect.facebook.net/vi_VN/all.js#xfbml=1&quot;;
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>

Sau đó tiếp tục copy đoạn code:


<div class='fb-comments' data-href='http://vn1download.blogspot.com' data-num-posts='10' data-width='600'/>


chèn vào sau  <div class='post-footer'>


Sửa link 'http://vn1download.blogspot.com' thành link website (blog) của bạn.


Like nếu thấy bài viết có ích!


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

Thủ thuật tạo bài viết liên quan (Related posts) cho blogger

Tiện ích "Bài viết liên quan" cho phép hiển thị các bài viết liên quan (có cùng nhãn) ở cuối mỗi bài viết, giúp tăng tỷ lệ Bounce rate cho blog.Các Seoer chắc chắn sẽ rất quan tâm vấn đề này!




Hướng dẫn:

Thêm đoạn đoạn code bên dưới vào trước thẻ </head>

<!-- Bài viết liên quan (1) -->
<style>
/*Khung chính của bài viết liên quan*/
#related-posts {
    float:left;
    min-width: 100%;
    margin: 10px 5px 10px 0;
    font: 11px Tahoma;
}

#related-posts .widget { 
    List-style-type: none;
    margin: 5px 0 5px 0;
    padding: 0;
}

#related-posts .widget h2, #related-posts h2 {
    color: #940f04; 
    font-size: 20px;
    font-weight: normal;
    margin: 5px 7px 0;
    padding: 0 0 5px;
}

/*Màu link của bài viết liên quan*/
#related-posts a {
    color: #318686;
    font-size: 13px;
    text-decoration: none;
}

/*Màu link khi rê chuột vào*/
#related-posts a:hover {
    color: #C4436A;
    text-decoration: underline;
}

#related-posts ul {
    border: medium none;
    margin: 10px;
    padding: 0;
}

#related-posts ul li {
    display: block;
    background: url(https://lh5.googleusercontent.com/-zKhXxJUpROA/Tmr926k_EBI/AAAAAAAACks/1LrFz96DwAI/List_1.png) no-repeat 0 0;
    margin: 0 0 5px;
    padding: 0 0 1px 21px;
    margin-bottom: 5px;
    line-height: 2em;
    border-bottom:1px dotted #cccccc; /*Gạch đích dưới mỗi link bài viết liên quan*/
}
</style>

<script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
}
//]]>
</script>

Sau đó thêm đoạn code sau: 

<!-- Bài viết liên quan (2) -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>

  <div style='border-top:#AAAE95 0px dashed; margin: 0 50px 0 50px; padding-top:5px;'/>
<font face='Arial' size='3'><b>Bài viết liên quan: </b></font>

<font color='#FF0000'> <!-- Màu chữ label -->
<b:loop values='data:post.labels' var='label'> 

<b:if cond='data:label.isLast != &quot;true&quot;'>
, <!--Dấu phẩy ngăn cách các label -->
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>

<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=8&quot;' type='text/javascript'/>
</b:if>
</b:loop>
</font>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>
</b:if>

vào sau đoạn  <data:post.body/>

Kết quả:



Like nếu thấy bài viết có ích!

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

Designed By Published.. Blogger Templates

Copyright @ 2013 Vn1Download