Tuesday, October 26, 2021
HomeTài Liệu HayGắn nhãn New/Old vào bài viết cho Blogger (Blogspot)

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://1.bp.blogspot.com/-w-cH9_Xp_6o/UPxhlmAMpWI/AAAAAAAAIyk/ozIqx5lOk7g/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://3.bp.blogspot.com/-lpcMFav3uls/UPxhmBrAmHI/AAAAAAAAIyw/-HrZloG5h_Q/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='https://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ả.

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -

Most Popular