» Bắt đầu thủ thuật
1. Đăng nhập vào tài khoản Blogger
2. Vào phần thiết kế (Design)
3. Chọn chỉnh sửa HTML (Edit HTML)
4. Chèn code bên dưới vào sau thẻ <head>
<script src="http://data-traidatmui.appspot.com/scripts/jquery.min.v1.4.1.js" type="text/javascript"></script>
<script src="http://data-traidatmui.appspot.com/scripts/JQuery-ui.min.1.8.11.js" type="text/javascript"></script>
<script src="http://data-traidatmui.appspot.com/scripts/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="http://data-traidatmui.appspot.com/scripts/jquery.booklet.1.3.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('#mybook').booklet({
tabs: true,
width: 650, // độ rộng tiện ích
height: 500, // chiều cao tiện ích
overlays: true, // nếu không muốn click vào bài để lật trang bạn thay thành false
manual: false
});
});
</script>
<style>.flippage{text-shadow:0 1px #fff;font-size:16px;color:#222;line-height:1.5em}
.imgp{width:305px;height:150px;margin:0 0 8px 0}
.flippage h2{background:none;font-weight:bold;text-transform:uppercase;font-family:times;font-size:16px;line-height:1.3em;margin:0;padding:0}
.flippage h2 a{color:#045a90}
.booklet{position:relative}
.booklet .b-page{left:0;top:0;position:absolute;overflow:hidden;padding:0}
.booklet .b-wrap{top:0;position:absolute}
.booklet .b-wrap-left{background:#fff}
.booklet .b-wrap-right{background:#efefef}
.booklet .b-pN .b-wrap,.booklet .b-p1 .b-wrap,.booklet .b-p2 .b-wrap,.booklet .b-p3 .b-wrap,.booklet .b-p4 .b-wrap{left:0}
.booklet .b-p0 .b-wrap{right:0}
.booklet .b-counter{text-shadow:0 1px #fff;box-shadow:0 0 6px #999 inset;bottom:0;position:absolute;display:block;width:25px;background:#eee;color:#033982;text-align:center;font-family:arial;font-size:12px;padding:4px 0 4px 0;font-weight:bold}
.booklet .b-wrap-left .b-counter{left:0}
.booklet .b-wrap-right .b-counter{right:0}
.booklet .b-overlay{top:0;position:absolute;height:100%;width:50%}
.booklet .b-overlay-prev{left:0}
.booklet .b-overlay-next{right:0}
.booklet .b-tab{font-weight:bold;border-top-left-radius:5px;border-top-right-radius:5px;text-shadow:0 1px #fff;box-shadow:0 0 6px #666 inset;background:#eee;width:100%;padding:5px 0 0 0;text-align:center;color:#024093;position:absolute;font-size:12px}
.booklet .b-tab-prev{left:0}
.booklet .b-tab-next{right:0}
.booklet .b-tab:hover{background:#ccc;color:#000}
body{z-index:0}
.b-menu{z-index:100}
.b-selector{z-index:100}
.booklet{z-index:10}
.b-pN{z-index:10}
.b-p0{z-index:30}
.b-p1{z-index:20}
.b-p2{z-index:20}
.b-p3{z-index:30}
.b-p4{z-index:10}
.b-prev{z-index:40}
.b-next{z-index:40}
.b-counter{z-index:40}
</style>
<script src="http://data-traidatmui.appspot.com/scripts/JQuery-ui.min.1.8.11.js" type="text/javascript"></script>
<script src="http://data-traidatmui.appspot.com/scripts/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="http://data-traidatmui.appspot.com/scripts/jquery.booklet.1.3.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('#mybook').booklet({
tabs: true,
width: 650, // độ rộng tiện ích
height: 500, // chiều cao tiện ích
overlays: true, // nếu không muốn click vào bài để lật trang bạn thay thành false
manual: false
});
});
</script>
<style>.flippage{text-shadow:0 1px #fff;font-size:16px;color:#222;line-height:1.5em}
.imgp{width:305px;height:150px;margin:0 0 8px 0}
.flippage h2{background:none;font-weight:bold;text-transform:uppercase;font-family:times;font-size:16px;line-height:1.3em;margin:0;padding:0}
.flippage h2 a{color:#045a90}
.booklet{position:relative}
.booklet .b-page{left:0;top:0;position:absolute;overflow:hidden;padding:0}
.booklet .b-wrap{top:0;position:absolute}
.booklet .b-wrap-left{background:#fff}
.booklet .b-wrap-right{background:#efefef}
.booklet .b-pN .b-wrap,.booklet .b-p1 .b-wrap,.booklet .b-p2 .b-wrap,.booklet .b-p3 .b-wrap,.booklet .b-p4 .b-wrap{left:0}
.booklet .b-p0 .b-wrap{right:0}
.booklet .b-counter{text-shadow:0 1px #fff;box-shadow:0 0 6px #999 inset;bottom:0;position:absolute;display:block;width:25px;background:#eee;color:#033982;text-align:center;font-family:arial;font-size:12px;padding:4px 0 4px 0;font-weight:bold}
.booklet .b-wrap-left .b-counter{left:0}
.booklet .b-wrap-right .b-counter{right:0}
.booklet .b-overlay{top:0;position:absolute;height:100%;width:50%}
.booklet .b-overlay-prev{left:0}
.booklet .b-overlay-next{right:0}
.booklet .b-tab{font-weight:bold;border-top-left-radius:5px;border-top-right-radius:5px;text-shadow:0 1px #fff;box-shadow:0 0 6px #666 inset;background:#eee;width:100%;padding:5px 0 0 0;text-align:center;color:#024093;position:absolute;font-size:12px}
.booklet .b-tab-prev{left:0}
.booklet .b-tab-next{right:0}
.booklet .b-tab:hover{background:#ccc;color:#000}
body{z-index:0}
.b-menu{z-index:100}
.b-selector{z-index:100}
.booklet{z-index:10}
.b-pN{z-index:10}
.b-p0{z-index:30}
.b-p1{z-index:20}
.b-p2{z-index:20}
.b-p3{z-index:30}
.b-p4{z-index:10}
.b-prev{z-index:40}
.b-next{z-index:40}
.b-counter{z-index:40}
</style>
5. Save template lại và trở về phần tử trang (Page Elements)
6. Thêm 1 HTML/Javascript và thêm vào code bên dưới.
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizw4OTZyAv74zf3PC_lGFsmRyJmsBKb1SBNcvVOgggBkq8wJiIVcV4XMEaofIkBKDH_0D2GPX6dQB7G4aax5fbEIZgmuMcPUvaE1kHIhE7rLt15spY8tWIhvaA51EACXD7lCxlJies9vVc/";
showRandomImg = true;
aBold = true;
text = "";
showPostDate = true;
summaryPost = 400; //số kí tự phần tóm tắt
numflipposts = 30; //số bài viết hiển thị
fliplabel = "Advanced blogger"; //thay thành tên nhãn của blog bạn
fliphome_page = "http://www.traidatmui.com/"; //thay thành địa chỉ blog của bạn
</script>
<script src="http://data-traidatmui.appspot.com/scripts/booklet_label.js" type="text/javascript"></script>
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizw4OTZyAv74zf3PC_lGFsmRyJmsBKb1SBNcvVOgggBkq8wJiIVcV4XMEaofIkBKDH_0D2GPX6dQB7G4aax5fbEIZgmuMcPUvaE1kHIhE7rLt15spY8tWIhvaA51EACXD7lCxlJies9vVc/";
showRandomImg = true;
aBold = true;
text = "";
showPostDate = true;
summaryPost = 400; //số kí tự phần tóm tắt
numflipposts = 30; //số bài viết hiển thị
fliplabel = "Advanced blogger"; //thay thành tên nhãn của blog bạn
fliphome_page = "http://www.traidatmui.com/"; //thay thành địa chỉ blog của bạn
</script>
<script src="http://data-traidatmui.appspot.com/scripts/booklet_label.js" type="text/javascript"></script>
7. Cuối cùng save tiện ích lại
Để hiển thị cho tất cả bài viết bạn thay http://data-traidatmui.appspot.com/scripts/booklet_label.js thành link bên dưới
http://data-traidatmui.appspot.com/scripts/booklet_allpost.js
Có vấn đề gì chưa rỏ bạn để lại comment bên dưới để trao đổi thêm nhé
nguồn: Traidatmui.com
0 nhận xét:
Speak up your mind
Tell us what you're thinking... !