Thêm tiện ích widget hiển thị bài viết theo Label(Nhãn) cho Blogger/Blogspot

Xin chào các bạn! Trong bài viết này mình sẽ hướng dẫn các bạn thêm tiện ích widget hiển thị bài viết theo Label(Nhãn) cho Blogger/Blogspot.

Với tiện ích này bài viết sẽ được hiển thị theo nhãn, bạn có thể thay thế tiện ích ở bài viết tại trang chủ hoặc làm một trang tĩnh.

Xem thêm: Hiển thị bài viết trên trang chủ theo Label cho Blogspot

Tiện ích này mình lấy tại đây và sửa một số chỗ theo ý bản thân 😝

Hướng dẫn tạo tiện ích:
- Đăng nhập vào blogger
- Tạo một trang tĩnh hoặc tiện ích mới trong bố cục
- Copy đoạn code dưới đây

<style type="text/css" scoped="scoped">
/* Multi Feed Loader */
.list-entries{background:#fff;border:1px solid #d8d8d8}
.list-entries ul,.list-entries li{margin:0;padding:0;list-style:none}
.list-entries li{padding:1em;border-bottom:1px solid #ddd}
.list-entries .main-title{padding:0}
.list-entries .main-title h4{display:block;font:inherit;font-weight:700;padding:.5em 1em;background-color:#4f93c5;color:#fff;margin:0;line-height:normal;font-size:14px;margin-top:0!important}
.list-entries .title a{font-weight:300;font-size:14px;text-decoration:none;line-height:.5em;color:#222}
.list-entries .title a:hover{text-decoration:underline;color:#5886a7}
.list-entries img,.list-entries .fake-img{border:none;background-color:#333;margin:0 1em 0 0;padding:0;float:left}
.list-entries .summary{overflow:hidden;color:#999}
.list-entries .more-link{border-bottom:none}
.list-entries .more-link a{display:block;line-height:2em;height:2em;overflow:hidden;text-decoration:none;background-color:#82b965;padding:.5em 1em;position:relative;font-weight:700;color:#fff}
.list-entries .more-link a:after{content:"";width:0;height:0;position:absolute;top:50%;right:.3em;border:4px solid transparent;border-left-color:#fff;margin-top:-4px}
.list-entries .more-link a:hover{background-color:#71a555}
.list-entries{margin:7px;width:251px;float:left;font-size:11px}
</style>
<script type="text/javascript">
var multiFeed = {
    feedsUri: [
        {
            name: "Facebook",
            url: "http://www.startruongit.net/",
            tag: "Facebook"
        },
        {
            name: "Blogspot",
            url: "http://www.startruongit.net/",
            tag: "Blogspot"
        },
        {
            name: "Đồ Hoạ",
            url: "http://www.startruongit.net/",
            tag: "Đồ%20hoạ"
        },
        {
            name: "Facebook",
            url: "http://www.startruongit.net/",
            tag: "Facebook"
        },
        {
            name: "Facebook",
            url: "http://www.startruongit.net/",
            tag: "Facebook"
        },
        {
            name: "Facebook",
            url: "http://www.startruongit.net/",
            tag: "Facebook"
        }
    ],
    numPost: 4,
    showThumbnail: true,
    showSummary: true,
    summaryLength: 80,
    titleLength: "auto",
    thumbSize: 72,
    containerId: "feed-list-container",
    readMore: {
        text: "Xem thêm",
        endParam: "?max-results=8"
    }
};
</script>
<script type="text/javascript" src="https://cdn.rawgit.com/Arlina-Design/nubie/master/multifeedblog.js"></script>
<div id="feed-list-container"></div>
<div style='clear: both'/>

Chỉnh sửa code:
Bạn sửa chỗ màu đỏ name, url, tag sao cho phù hợp với blog của bạn, các đoạn code hiển thị bài bên dưới chỉnh sửa tương tự.
Chúc bạn thành công với thủ thuật này!

728x90

• Twitter
• Facebook
• Google
• Pinterest

Newer Post Older Post

Tác giả: Mộc Gin

Thành công không tự nhiên mà tới - Muốn thành công chúng ta phải nỗ lực không ngừng.

YOU MAY LIKE: