Hiển thị các bài đăng có nhãn Blogspot. Hiển thị tất cả bài đăng
Hiển thị các bài đăng có nhãn Blogspot. Hiển thị tất cả bài đăng

Thứ Tư, 1 tháng 4, 2015

[Blogspot Tutorial] Hướng dẫn tạo blog cho người mới bắt đầu

Hiện nay blog đã không còn là từ ngữ xa lạ với "cư dân mạng", và blog đang ngày càng phát triển, có rất nhiều nền tảng giúp bạn tạo một blog ra đời. Nhưng có lẽ hiện nay chỉ có BloggerWordpress là 2 nền tảng blog tốt nhất dành cho những ai muốn tạo cho mình 1 blog riêng.

Blogger là gì? tại sao lại chọn blogger để bắt đầu ?

Blogger hay còn gọi là blogspot.

Blogger là một trong số những nền tảng hổ trợ bạn tạo blog riêng (bạn cũng có thể biến nó thành 1 website). Blogger là một sản phẩm của google và chính vì nó là "đứa con" của google nên google đã ưu tiên rất nhiều cho những blog(website) sử dụng nền tảng của nó trong việc SEO và đưa từ khóa lên google search, cũng như là index website của bạn lên google search nhanh chóng.

Bạn thắc mắc tại sao không chọn wordpress mà lại chọn blogger để bắt đầu? Đọc bài viết trong đường link đên dưới để hiểu rõ hơn tại sao tôi lại khuyên bạn chọn blogger. Vì trong bài viết này tôi chỉ tập trung hướng dẫn bạn tạo 1 blog mới.

Các bước tạo một blogger

Bước 1 : bạn cần có tài khoản gmail để đăng nhập vào blogger, nếu chưa có tài khoản gmail bạn có thể vào trang gmail.com và tạo cho mình một tài khoản. Sau đó bạn vào trang http://blogger.com, đăng nhập vào. Oke, bây giờ chúng ta bắt đầu tạo một blog cho riêng mình ^^.

Bước 2 : Sau khi vào trang blogger.com , bạn sẽ thấy giao diện trang như hình bên dưới, Click vào nút "blog mới" để bắt đầu tạo cho mình một blog.


Bước 3 : Một form mới hiện ra, ở đây bạn nhập vào ô đầu tiên là title blog của bạn ( là dòng hiển thị tiêu đề blog của bạn trên google hay trên trình duyệt ).

Ô thứ 2 bạn nhập vào địa chỉ blog của bạn (ví dụ như : kingsharkit.blogspot.com ) nếu nó hiện hình dấu chấm than và dòng chữ "Rất tiếc, địa chỉ blog này không khả dụng" thì có nghĩa là địa chỉ này đã có người sử dụng, bạn cần chọn một địa chỉ khác. Nếu hiện dòng chữ "Địa chỉ blog này có sẵn." thì bạn có thể sử dụng địa chỉ này

Bên dưới là phần chọn giao diện (template) cho blog của bạn, ở đây có một số template cơ bản mà blogger cung cấp sẵn cho người dùng, và thường thì mấy template này rất "quê", template dạng này thuộc vào dạng siêu lạc hậu rồi :))

Cuối cùng là click vào nút "Tạo blog" để khởi tạo blog mới của bạn


Bước 4 : Oke, bây giờ bạn đã có blog của riêng mình


Bước 5 : Click vào trang quản trị blog của bạn, giao diện trang quản trị như hình bên dưới


  1. 1. Nút đăng bài mới nhanh.
  2. 2. Trang tổng quan, chính là giao diện bạn đang nhìn thấy khi vừa vào trang quản trị, ở trang này blogger sẽ hiển thị tóm tắt về blog của bạn như : lượt view mỗi ngày, tổng bao nhiêu bài đăng, nhận xét, ..
  3. 3. Trang quản lý bài đăng cùa bạn.
  4. 4. "Trang" phần này như là những page riêng lẽ, tôi cũng không biết nói sao cho dễ hiểu, cơ bản như là "trang" sitemap này của tôi.
  5. 5. Phần quản lý các nhận xét trên blog của bạn, gồm nhận xét đã duyệt và chưa duyệt hay là các spam.
  6. 6. Đây là phần liên kết với Goolge plus của bạn.
  7. 7. Phần quản lý chi tiết thống kê về blog của bạn, như lượt view trong ngày, trong tuần, trong tháng, bài đăng xem nhiều, nguồn truy cập blog của bạn từ đâu,..
  8. 8. Liên kết với Google Adwords của bạn.
  9. 9. Tùy chỉnh bố cục blog của bạn.
  10. 10. Phần tùy chỉnh giao diện (template của bạn)
  11. 11. Cài đặt các thành phần cơ bản cho blog của bạn, như : title, trỏ tên miền, thiết lập tìm kiếm, ..

Hết phần tạo blog .Các bài tiếp theo tôi sẽ hướng dẫn các bạn chi tiết từng phần ở trên. Chúc các bạn thành công ! nếu có thắc mắc gì thì để lại bình luận bên dưới nhé ^^ mình sẽ trả lời nhanh nhất cho bạn

Thứ Ba, 17 tháng 3, 2015

Không hiển thị lượt view của Quản Trị Viên khi xem blog

Một số bạn làm khi tạo Blogger, thắc mắc không hiểu vì sao Blog mình vừa tạo mà đã có view? Thật ra đó là view của mình bạn! Trong lúc tạo blog rồi chỉnh sửa giao diện này nọ, vô tình Blogger của bạn đã có hàng trăm view.

Nếu như bạn muốn con số thống kê view trên Blog của bạn chính xác hơn thì bạn nên bỏ đi thống kê view của chính mình. Như vậy thống kê chỉ còn tính view của khách thôi.

Để tắt đi mặc định này, rất đơn giản các bạn chỉ việc vào tab Thống kê trên blog, và tick vào Không theo dõi số lần xem trang của riêng bạn là xong rồi đó

Không hiển thị lượt view của Quản Trị Viên khi xem blog
Không hiển thị lượt view của Quản Trị Viên khi xem blog

Tuy nhiên thì việc theo dõi lượt view trên chính blogger dễ làm nhiều bạn "hiểu nhầm". Hiểu nhầm ở đây theo mình đó là việc mỗi ngày blog của bạn có thể đón chào hàng trăm lượt view hoặc chỉ vài chục view chỉ đơn giản với việc... ngồi F5 :)) .

Thật ra công cụ thống kê của blogger không chính xác, nếu bạn muốn chính xác thì bạn nên sử dụng công cụ thống kê Google Analytics. Mình sẽ viết bài viết về sử dụng google analytics sau, hoặc nếu bạn cần gấp thì hỏi bác... Google :))

nguồn : vietdesigner

Chủ Nhật, 15 tháng 3, 2015

Hướng dẫn download trên kingsharkit

Mình nhận thấy có một số bạn khi click vào link download thì không biết làm thế nào để download được. Hôm nay mình sẽ hướng dẫn các bạn download tài liệu, theme trên KINGSHARKIT.

Khi bạn click vào một link down trên KINGSHARKIT. Ví dụ như bạn muốn tải 1 theme wordpress chẳng hạn. Click vào link down, sẽ sang 1 trang web quảng cáo. Bạn vui lòng đợi 5s, sau đó click vào nút "BỎ QUA QUẢNG CÁO" thì sẽ tới trang download.

Hướng dẫn download trên kingsharkit

Hướng dẫn download trên kingsharkit

Sau khi click "bỏ qua quảng cáo" thì sẽ chuyển sang trang download mediafire hoặc google drive.

Hướng dẫn download trên Google Drive



Cảm ơn các bạn đã ghé thăm blog của mình. Chúc các bạn tìm được những thông tin bổ ích

Thứ Bảy, 14 tháng 3, 2015

Code Chia Sẻ Mạng Xã Hội Chạy Dọc Trang Dành Cho Blogspot

Bạn muốn các bài viết được chia sẽ lên mạng xã hội, bạn mong muốn khách hàng của bạn khi lướt blog của bạn sẽ chia sẽ lại bài viết của họ khi thấy nó bổ ích hay là "like","+1" cho bài viết của bạn khi nó làm hài lòng khách hàng của bạn. Bạn muốn mọi thao tác của người dùng dễ hơn?

Hôm nay mình sẽ hướng dẫn các bạn tích hợp form chia sẻ thông qua mạng xã hội chạy dọc theo trang web của bạn,và nó được cố định tại 1 chỗ, đơn giãn mà đẹp ^.^

Code Chia Sẻ Mạng Xã Hội Chạy Dọc Trang Dành Cho Blogspot
Code Chia Sẻ Mạng Xã Hội Chạy Dọc Trang Dành Cho Blogspot

Oke, bắt đầu thực hiện nhé !

Bước 1 : Đặt đoạn code dưới đây vào phía dưới thẻ </body> 


Bước 2 : Save Template (lưu mẫu) lại. Oke , như vậy chúng ta đã có 1 khung chia sẽ bài viết qua mạng xã hội chạy dọc bên trang blog của bạn. Chúc bạn thành công ^.^

Có gì không hiểu các bạn có thể để lại comment bên dưới bài viết. Mình sẽ suppot cho các bạn nhanh nhất khi có thể.


Tag : free template blogspot, thủ thuật blogger, hướng dẫn blogspot, tùy chỉnh blogspot, tối ưu blogspot, seo blogspot.

Hướng Dẫn Thêm Admin Control Panel vào Blogspot

Hôm nay mình sẽ hướng dẫn các bạn tích hợp Admin Control Panel vào trực tiếp blog của bạn. Admin Control Panel này do Mybloggerlab.com phát triển. Mục đích chính của nó là giúp bạn làm việc nhanh hơn, quản lý blog của bạn dễ dang hơn. Admin Control Panel này chỉ hiển thị khi bạn là Quản Trị Viên hoặc Tác Giả, tức là bạn phải login vào blogger thì nó mới nhận diện được quyền quản trị của bạn. Hình Demo dưới đây

Hướng Dẫn Thêm Admin Control Panel vào Blogspot
Hướng Dẫn Thêm Admin Control Panel vào Blogspot
Admin Control Panel là thanh thao tác Admin hiển thị phí trên blog của bạn như hình trên. Nó giúp bạn thao tác trực tiếp khi đang ở giao diện chính blog của bạn.

Oke, bây giờ ta bắt đầu thực hiện thao tác đưa Admin Control Panel vào blog nhé !

Bước 1 : bạn vào Template (mẫu) >> Edit HTML (chỉnh sửa HTML). Sau đó bạn tìm thẻ ]]></b:skin> và thêm vào trên nó đoạn code sau:



Bước 2 : Tìm thẻ <body> và chèn đoạn code bên dưới vào sau thẻ <body> . Lưu ý : tùy vào template mà thẻ body có thể chứ các phần tử bên trong, nếu ko tìm thấy thẻ <body> thì bạn tìm thẻ </head> xem bên dưới có thẻ <body...>


Bước 3 : Save Template (lưu mẫu) và thưởng thức thành quả

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

Tag : free template blogspot, thủ thuật blogger, hướng dẫn blogspot, tùy chỉnh blogspot, tối ưu blogspot, seo blogspot.

Thứ Ba, 3 tháng 3, 2015

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

Nếu bạn không muốn mất quá nhiều công sức vào việc thiết kế blog của mình thì việc tham khảo 10 trang template free này sẽ rất hiệu quả đó. Nên nhớ, hãy chọn những template đẹp nhưng đơn giản để hỗ trợ tốt cho việc SEO nhé.

1. Soratemplates
Link trang : http://www.soratemplates.com/.
Đây là trang có rất nhiều mẫu đẹp, đặc biệt là các mẫu cho các trang phim, bán hàng.

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

2. Btemplates
Bạn có thể tùy chọn blog 2, 3 cột và theo từng chủ đề khác nhau rất đẹp.
Link trang:  http://btemplates.com/

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

3. Premium Blogger Templates
Có rất nhiều mẫu free đẹp nhé: http://www.premiumbloggertemplates.com/

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot
4. Blog Template 4u
Link trang: http://blogtemplate4u.com/

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

5. Zoom Template
Link trang : http://www.zoomtemplate.com/

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

6. Deluxe Templates
Link trang : http://www.deluxetemplates.net/

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

7. Lovely Templates
Link trang : http://www.lovelytemplates.com/blogger-templates

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

8. All blog Tools
Link trang : http://www.allblogtools.com/

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

9. Pro Btemplates
Link trang : http://www.probtemplates.com/

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

10. Blogger template Store
Link trang : http://www.bloggertemplatestore.com/

10 Trang Cung Cấp Template Free Đẹp Cho Blogspot

Chúc bạn tìm được môt template hợp với ý của bạn ^.^

Tag : thủ thuật blogspot, template blogspot miễn phí, template đẹp

Thứ Sáu, 27 tháng 2, 2015

Hướng dẫn khắc phục label (nhãn) bị lỗi font trong blogspot

Theo mình tìm hiểu thì đôi khi một số blog bị lỗi font chữ ở label.Một dạng lỗi cũng khá phổ biến ở các blogger Việt Nam mình, nguyên nhân là do tiếng việt thì thường khó khăn hơn khi lưu xuống cơ sở dữ liệu.

Lỗi font chữ ở label ( nhãn ) trong blogger

Để khắc phục tình trạng này thì chỉ có một cách là viết label không dấu và không chứa khoảng cách.

Ví dụ : bạn có label : Thủ Thuật Blogger thì bạn sẽ phải sửa thành : thu-thuat-blogger

Tag : thủ thuật lập trình, thủ thuật blogger, blogspot, hướng dẫn blogspot, template blogspot, giao diện blogspot miễn phí

Thứ Ba, 3 tháng 2, 2015

6 mẫu form tìm kiếm đẹp dành cho blogger

Đối với 1 website thì khung tìm kiếm cũng là 1 phần quan trọng, nó giúp cho người dùng dễ dàng tìm kiếm 1 vấn đề cụ thể nào đó. Vì khi vào website của bạn, người dùng thường là có chủ đích tìm 1 vấn đề nào đó, do vậy việc tích hợp 1 form tìm kiếm giúp bạn tạo được sự thân thiện của website với người dùng, giúp người dùng dễ dàng thao tác trong việc tìm kiếm nguồn bài viết.

Do các bài viết không thể hiển thị cùng lúc ra ngoài trang chủ hết được nên ngay bây giờ, bạn cần tạo cho blog (website) của mình 1 form tìm kiếm.Dưới đây là 1 số form tìm kiếm đẹp mà mình sưu tầm được.

Oke chúng ta bắt đầu tạo form tìm kiếm

Bước 1 : Tiến hành đăng nhập vào trang quản trị
Bước 2 : Vào phần bố cục trang (layout) ,thêm một tiện ích HTML tại vị trí bạn muốn đặt hộp tìm kiếm và dán một trong các đoạn mã dưới đây vào rồi lưu nó lại.

Mẫu 1 :



Mẫu 2 :




Mẫu 3 :




Mẫu 4 :



Mẫu 5 :



Mẫu 6 :




nguồn : Đức Phạm

Tag : Thủ thuật blogger, thủ thuật blogspot, form tìm kiếm, thiết kế blogspot, hướng dẫn blogspot, code blogger

5 mẫu code hiển thị bài viết phổ biến cho blogger

Đối với blogger nói riêng và các website, forum nói chung, việc tạo một tiện ích hiển thị bài viết phổ biến được nhiều người quan tâm là không thể thiếu và là một công cụ quan trọng giúp người xem biết được hoạt động nào đang được diễn ra phổ biến trên blog hay website đó. Nó cũng là một cách điều hướng người dùng tới nội dung của website.

Dưới đây là 5 mẫu "Bài Viết Phổ Biến" đẹp dành cho blog hay website của bạn :

Tiến hành thêm tiện ích

Bước 1:  Đăng nhập vào trang quản trị blogger của bạn
Bước 2:  Vào mục bố cục trang (layout) và tiến hành thêm một tiện ích HTML vào bất kì đâu trên blog của bạn (theo mình thì các bạn nên để bên phải trang), sau đó dán một trong các mẫu dưới đây vào và lưu lại.

Mẫu 1

5 mẫu code hiển thị bài viết phổ biến cho blogger

1234567891011121314151617181920212223242526272829303132<script style="text/javascript" src="http://googledrive.com/host/0B_-3-pIiTRGhenZGaVl3ZEhIX0k"></script>
<script style="text/javascript">
var posts_no = 5;
var showpoststhumbs = true;
var readmorelink = true;
var showcommentslink = false;
var posts_date = true;
var post_summary = true;
var summary_chars = 70;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>
<a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<link href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css' />
<style type="text/css">
img.recent-post-thumb {width:50px;height:50px;float:right;margin: 5px -5px 0px 0px; border-radius: 100%; padding: 3px;background: #fff}
.recent-posts-container {font-family: 'Ubuntu Condensed', sans-serif; float: left;width: 100%;min-height: 55px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent-posts-container {list-style-type: none; background: #fff;padding: 0px; }
ul.recent-posts-container li:nth-child(1n+0) {background: #F49A9A; width: 100%}
ul.recent-posts-container li:nth-child(2n+0) {background: #FCD092; width: 95%}
ul.recent-posts-container li:nth-child(3n+0) {background: #FFF59E; width: 90%;}
ul.recent-posts-container li:nth-child(4n+0) {background: #E1EFA0; width: 85%;}
ul.recent-posts-container li:nth-child(5n+0) {background: #B1DAEF; width: 80%;}
ul.recent-posts-container li {padding:5px 10px;min-height:50px; list-style-type: none; margin: 0px 5px -5px 5px; color: #777;}
.recent-posts-container a { text-decoration:none; }
.recent-posts-container a:hover { color: #222;}
.post-date {color:#e0c0c6; font-size: 11px; }
.recent-post-title a {font-size: 14px;color: #444; font-weight: bold;}
.recent-post-title {padding: 6px 0px;}
.recent-posts-details a{ color: #222;}
.recent-posts-details {padding: 5px 0px 5px; }
</style>

Mẫu 2

5 mẫu code hiển thị bài viết phổ biến cho blogger
123456789101112131415161718<div class="recentpoststyle">
<script src="http://googledrive.com/host/0B_-3-pIiTRGhV3pnaTVSaWU2a0k"></script>
<script>
var posts_no = 5;var posts_date = true;var post_summary = true;var summary_chars = 80;
</script>
<script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts">
</script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<style type="text/css">
.recentpoststyle {counter-reset: countposts;list-style-type: none;}
.recentpoststyle a {text-decoration: none; color: #49A8D1;}
.recentpoststyle a:hover {color: #000;}
.recentpoststyle li:before {content: counter(countposts,decimal);counter-increment: countposts;float: left;z-index: 2;position:relative;font-size: 20px;font-weight: bold;color: #fff;background: #69B7E2; margin: 15px 5px 0px -6px; padding: 0px 10px; border-radius: 100%;}
li.recent-post-title { padding: 5px 0px;}
.recent-post-title { font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;}
.recent-post-title a {color: #444;font-size: 13px; text-decoration: none; padding: 2px; font-weight: bold;}
.post-date {padding: 5px 2px 5px 30px; font-size: 11px; color: #999; margin-bottom: 5px;}
.recent-post-summ { border-left: 1px solid #69B7E2; color: #777; padding: 0px 5px 0px 20px; margin-left: 11px; font-family: Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif; font-size: 15px;}
</style></div>


Mẫu 3

5 mẫu code hiển thị bài viết phổ biến cho blogger

123456789101112131415161718192021222324<script style="text/javascript" src="http://googledrive.com/host/0B_-3-pIiTRGhenZGaVl3ZEhIX0k"></script>
<script style="text/javascript">
var posts_no = 5;
var showpoststhumbs = true;
var readmorelink = true;
var showcommentslink = true;
var posts_date = true;
var post_summary = true;
var summary_chars = 70;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>
<a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com" rel="nofollow">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
<style type="text/css">
img.recent-post-thumb {padding:2px;width:65px;height:65px;float:left;margin: 0px 10px 10px; background: #fff; border: 1px solid #69B7E2;}
.recent-posts-container {font-family: 'Oswald', sans-serif; float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent-posts-container li {padding:5px 0px;min-height:65px; list-style-type: none; margin-bottom: 5px;}
ul.recent-posts-container {counter-reset: countposts;list-style-type: none;}
ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 2;position:absolute; left: 15px; font-size: 13px;font-weight: bold;color: #fff;background: #69B7E2;padding: 4px 10px; border-radius: 100%;}
.recent-posts-container a { text-decoration:none; }
.recent-post-title a {font-size: 13px; text-transform: uppercase; color: #2aace3;}
.recent-posts-details {margin: 5px 0px 0px 92px; }
.recent-posts-details a{ color: #777;}
</style>

Mẫu 4

5 mẫu code hiển thị bài viết phổ biến cho blogger

123456789101112131415161718192021222324252627<script style="text/javascript" src="http://googledrive.com/host/0B_-3-pIiTRGhZDBSWjNEQ1FYbmc"></script>
<script style="text/javascript">
var posts_no = 5;
var showpoststhumbs = false;
var readmorelink = true;
var showcommentslink = true;
var posts_date = true;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>
<a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
<style type="text/css">
img.recent-post-thumb {padding: 2px; width:35px;height:35px;float:right;margin: -14px 0px 0px 5px; border: 1px solid #cea5ac; border-radius: 10%;}
.recent-posts-container {font-family: 'Oswald', sans-serif; float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent-posts-container li {padding:5px 0px;min-height:65px; list-style-type: none; margin: 0px 10px 5px 35px;}
ul.recent-posts-container {counter-reset: countposts;list-style-type: none;}
ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 2;position:absolute; left: 5px; font-size: 16px;color: #4D4D4D;background: #F7F7F7;padding: 9px 14px; border: 1px solid #efefef;}
.recent-posts-container a { text-decoration:none; }
.recent-posts-container a:hover{color: #4DACE3;}
.post-date {color:#e0c0c6; font-size: 11px; }
.recent-post-title a {font-size: 13px; text-transform: uppercase; color: #5C4D4D;}
.recent-post-title { margin: 5px 0px; }
.recent-posts-details {border-top: 4px solid #AC707A; margin-top: 5px; padding-top: 5px;}
.recent-posts-details a{ color: #888;}
a.readmorelink {color: #4DACE3;}
</style>

Mẫu 5

5 mẫu code hiển thị bài viết phổ biến cho blogger

12345678910111213141516171819202122232425262728<script style="text/javascript" src="https://googledrive.com/host/0B_-3-pIiTRGhZDBSWjNEQ1FYbmc"></script>
<script style="text/javascript">
var posts_no = 5;
var showpoststhumbs = true;
var readmorelink = true;
var showcommentslink = true;
var posts_date = true;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs" rel="nofollow"></script>
<a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<link href='http://fonts.googleapis.com/css?family=Lobster|Gloria+Hallelujah' rel='stylesheet' type='text/css' />
<style type="text/css">
img.recent-post-thumb {width:50px;height:50px;float:right;margin: -4px -35px 0px 0px; border: 4px solid #FCD6CB; border-radius: 100%;}
.recent-posts-container {font-family: 'Gloria Hallelujah', cursive; float: left;width: 100%;min-height: 55px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent-posts-container {counter-reset: countposts;list-style-type: none; background: #fff; }
ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 2;position:absolute; left: -20px; font-size: 16px;color: #616662;background: #FCD6CB;padding: 9px 14px; border-radius: 100%; margin-top: 15px;}
ul.recent-posts-container li {padding:5px 0px;min-height:50px; list-style-type: none; margin: -2px 5px 5px 5px; border-top: 2px solid #FCD6CB;}
ul.recent-posts-container {border: 2px solid #FCD6CB; }
.recent-posts-container a { text-decoration:none; }
.recent-posts-container a:hover { color: #222;}
.post-date {color:#e0c0c6; font-size: 11px; }
.recent-post-title a {font-size: 14px;color: #616662;}
.recent-post-title {padding: 6px 0px;}
.recent-posts-details a{ color: #888;}
.recent-posts-details {padding-bottom: 5px;}
a.readmorelink {color: #4DACE3;}
</style>

Nếu có bất kỳ câu hỏi hoặc yêu cầu nào liên quan đến chủ đề này, xin vui lòng để lại bình luận bên dưới. 

Tag : thủ thuật blogger, thủ thuật blogspot, code blogger, nhãn blogger, lập trình web, hướng dẫn blogger

Popular Posts