Gắn nhãn New/Old vào bài viết cho Blogger (Blogspot)

Bài viết này sẽ giới thiệu cho các bạn cách gắn nhãn New/Old nằm phía trên bên phải của bài đăng mới nhất và các bài đăng cũ.


Cách gắn nhãn New/Old vào bài đăng mới và cũ cho Blogger (Blogspot)

Đăng nhập Blogger ~> Vào Mẫu ~> Chỉnh sửa HTML
Thêm đoạn css này vào trước thẻ ]]></b:skin>

.new1 {
width: 56px;
height: 56px;
position: relative;
left: 20px;
top: -13px;
float: right;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYoGLibgvHeJeBFYtIramzTPcTlvbYmd52Mz7Vvpm4FUcojGbQCkql6SIU5ZrNFdvkIIyTZkZhT5Ya8LqARz1HAouw5yg9ICfrE6oc4FQUyqUchJ0bG_b_UM7ihTmm9h6ejrdgyVTSyxCo/s400/New.png") no-repeat scroll 0% 0% transparent;
}
.old1 {
width: 56px;
height: 56px;
position: relative;
left: 20px;
top: -13px;
float: right;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUyCz_JiKWWyd22yGMy9Akx-BBrH29DIwKIt8uSX3OJXJDeMbgaTOtgtawlIQwnOTLSFq0BxiAz_o_yHHq-LnINCie-DBW_QgHxdiBHWqZAm7xFg9ZqOJGs1HT2mI81C7ZwCte6UnYInae/s400/old.png") no-repeat scroll 0% 0% transparent;
}

Tiếp theo, chèn đoạn code sau vào trước thẻ </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function() {
$(".dropdown img.flag").addClass("flagvisibility");
$(".dropdown dt a").click(function() {
$(".dropdown dd ul").toggle();
});
$(".dropdown dd ul li a").click(function() {
var text = $(this).html();
$(".dropdown dt a span").html(text);
$(".dropdown dd ul").hide();
$("#result").html("Selected value is: " + getSelectedValue("sample"));
});
$('.blog-posts').find($('.post')).slice(1).prepend("<span class='old1'></span>")
function getSelectedValue(id) {
return $("#" + id).find("dt a span.value").html();
}
$(document).bind('click', function(e) {
var $clicked = $(e.target);
if (! $clicked.parents().hasClass("dropdown"))
$(".dropdown dd ul").hide();
});
$('.blog-posts').find($('.post')).first().prepend("<span class='new1'></span>")
$("#flagSwitcher").click(function() {
$(".dropdown img.flag").toggleClass("flagvisibility");
});
});
</script>

Cuối cùng, Lưu Mẫu lại và truy cập blog để xem kết quả.