VN tin mới trang chuyên tin học , Kiếm tiền online, Tin tức công nghê, Phầm mềm tiện ích,thủ thuật máy tính,hướng dẫn kiếm tiền , Trò chơi

Powered by Blogger.

2/23/14

Recent Posts với hiệu ứng load đổi bài viết liên tục cho Blogspot

1 comments
Recent Posts với hiệu ứng load đổi bài viết liên tục cho Blogspot
Recent Posts với hiệu ứng load đổi bài viết liên tục cho Blogspot. Bài viết mới nhất với hiệu ứng load đổi bài viết liên tục cho Blogspot

Hôm nay Bít Tuốt xin chia sẻ với các bạn 1 thủ thuật blog là cách thêm 1 widget: Recent Posts với hiệu ứng load đổi bài viết liên tục cho Blogspot

Widget này có gì đặc biệt: Nó sẽ hiển thị những bài viết mới nhất mà bạn viết. Ở đầu  widget này sẽ hiển thị một bài duy nhất cùng với tiêu đề (liên kết), tác giả, ngày và một bản tóm tắt ngắn gọn về nội dung của nó. Ngoài ra, bài viết này sẽ tự động xoay,chuyển bài viết trong danh sách bài viết mới đó lên top đầu widget này.

Ai có nhu cầu tìm kiếm templates đẹp miễn phí cho blogspot vui lòng ghé qua web sau để down temp: bit.templates

Demo: Recent Posts với hiệu ứng load đổi bài viết




Cách tạo widget: Recent Posts với hiệu ứng load đổi bài viết

Bước 1: Đăng nhập blogspot ==> Bố Cục (Layout)

Bước 2: Thêm 1 tiên ích HTML/Javascript vào vị trí bạn muốn hiển thị rồi copy code dưới đây vào

<style>
.gfg-root {
width: 100%;
height : auto;
position : relative;
overflow : hidden;
margin: 0 auto;
text-align : center;
font-size: 12px;
border: 1px solid #DBDBDB;
}
.gfg-title {
font-size: 16px;
font-weight : bold;
color : #6B6B6B;
background:#F3F3F3;
background-repeat: repeat;
line-height : 1.4em;
overflow : hidden;
white-space : nowrap;
padding: 5px;
text-shadow: 0px 2px #fff;
}
.gfg-entry {
background-color: #FFFFFF;
width : 100%;
height : 9.2em;
position : relative;
overflow : hidden;
text-align : left;
margin-top : 3px;
}
.gf-title a {
text-transform: capitalize;
color: #0000ff;
font-size: 14px;
}
.gfg-subtitle {
display: none;
}
.gfg-list {
position : relative;
overflow : hidden;
text-align : left;
}
.gfg-listentry {
line-height : 1.5em;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
padding-left : 15px;
padding-right : 5px;
}
.gfg-listentry-odd {
background-color : #F3F3F3;
border-bottom : 1px dotted #CCCCCC;
padding: 5px;
}
.gfg-listentry-even {
background-color : #F3F3F3;
border-bottom : 1px dotted #CCCCCC;
padding: 5px;
}
.gfg-listentry-odd a{
color: #595959;
padding: 0 0px 0 10px;
}
.gfg-listentry-even a{
color: #242424;
padding: 0 0px 0 10px;
}
.gfg-listentry-highlight {
background: #FFFFFF;
}
.gfg-listentry-highlight:before {
position: absolute;
left: 0;
content: '\25BA ';
font-size: 14px;
color: #DBDBDB;
}
.gfg-listentry-highlight a {
color: #242424;
}
.gfg-root .gfg-entry .gf-result {
position : relative;
background-color: #ffffff;
width : auto;
height : 100%;
padding-left : 20px;
padding-right : 5px;
}
.gfg-root .gfg-entry .gf-result .gf-title {
font-size: 14px;
line-height : 1.2em;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
margin-bottom : 2px;
margin-top: 5px;
}
.gfg-root .gfg-entry .gf-result .gf-snippet {
height : 3.8em;
color: #000000;
margin-top : 3px;
}
.clearFloat {
clear : both;}</style>
<script src="http://www.google.com/jsapi" type="text/javascript"></script><script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script>
<script type="text/javascript">
function showGadget() {var feeds = [{title:'List',url:'http://bittuot.blogspot.com/feeds/posts/default?redirect=false&start-index=1&max-results=15'},];
new GFdynamicFeedControl(feeds, 'feedGadget',{title: 'Bài Viết Mới Nhất',numResults : 12displayTime : 5000, hoverTime : 500});} google.load("feeds", "1");
google.setOnLoadCallback(showGadget);
</script>
<div id="feedGadget">Loading...</div>

Các bạn nhấn lưu lại rồi ra xem kết quả

Chú ý: Các bạn cần thay đổi các thông tin dưới đây sao cho phù hợp

  • http://bittuot.blogspot.com/: Các bạn sửa thành link blog của các bạn
  • title: 'Bài Viết Mới Nhất' : Tên tiêu đề của Widget
  • numResults : 12: Số bài viết bạn muốn hiển thị
  • displayTime : 5000, hoverTime : 500 : Thời gian chuyển đổi giữa các bài viết
  • Nếu ko thấy chạy các bạn thử thay http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js thành link sau https://sites.google.com/site/seovnpro/gfdynamicfeedcontrol.js .Thay http://www.google.com/jsapi thành https://sites.google.com/site/seovnpro/jsapi
Nếu các bạn ko muốn hiển thị cái tên Bài viết mới nhất thì các bạn thêm thuộc tính display:nonevào  cái css tên là .gfg-title
by blog tin hoc: tinhoc360

1 comment:

  1. Kiếm tiền 101 là cộng đồng chia sẻ những kiến thức về kiếm tiền online hiệu quả cho người mới bắt đầu. Kiếm tiền 101 có các bài viết giới thiệu về các hình thức MMO hiệu quả như tiếp thị liên kết, dropshipping,... đánh giá ưu và nhược điểm của mỗi hình thức kiếm tiền và các bài hướng dẫn chi tiết dành cho những ai muốn bắt đầu.


    Những năm gần đây, các hình thức kiếm tiền online
    phát triển nhanh chóng với sự ra đời của nhiều cộng đồng Make Money Online (MMO) lớn nhỏ. Với mong muốn xây dựng một cộng đồng uy tín, Kiếm tiền 101 ra đời nhằm chia sẻ những kiến thức bổ ích và chính xác về marketing và kiếm tiền online hiệu quả. Nếu bạn quan tâm đến các công cụ Marketing online, các mẹo quảng cáo để bán hàng trên Facebook,... đừng bỏ lỡ những bài viết thú vị của cộng đồng này nhé!


    Bạn muốn tìm hiểu về xu hướng SEO mới nhất? Bạn muốn năng cao kiến thức về digital marketing để làm marketing hiệu quả hay bạn đang tìm kiếm một cách Kiếm tiền 101
    phù hợp? Dù bạn đang tìm kiếm điều gì, Kiếm tiền 101 cũng chính là nơi bạn cần. Tại Kiếm tiền 101, những bài viết về các chủ đề marketing luôn được cập nhật liên tục để bắt kịp những xu hướng và những thay đổi về thuật toán google.


    Kiếm tiền online
    với các nền tảng trong nước đã quá quen thuộc nhưng lại không mang lại lợi nhuận như bạn mong muốn? Gia nhập các nền tảng thương mại điện tử hoặc các chương trình affiliate quốc tế sẽ giúp tăng cơ hội kiếm tiền thụ động. Tuy nhiên, tham gia các nền tảng quốc tế như Amazon, Ebay, Shopify,... thường không dễ dàng vì các rào cản về ngôn ngữ, quy định, điều khoản thanh toán,... Nếu bạn có những phân vân như thế, hãy tham khảo các bài viết hướng dẫn tại Kiếm tiền 101 để có thể dễ dàng bắt đầu tham gia vào xu hướng kiếm tiền online của thế giới.


    Ngày nay, bán hàng hiệu quả không còn là phải nhập hàng về và bán dần. Với các hình thức bán hàng như in theo yêu cầu, dropshipping hay tiếp thị liên kết, bạn không cần nhìn thấy sản phẩm mà vẫn bán được hàng. Để giúp cộng đồng tìm hiểu những xu hướng kinh doanh online này, Kiếm tiền 101 có những bài viết chia sẻ và hướng dẫn chi tiết các thức tham gia. Đây còn là nơi để chia sẻ kiến thức, hỏi và giải đáp những thắc mắc về kiến thức marketing và các hình thức kiếm tiền online hiệu quả.

    ReplyDelete