Hộp Subcribe là thành phần khá quan trọng trong blogger, ngoài tác dụng giúp độc giả theo dõi bài viết của bạn còn có tác dụng giúp độc giả có thể chia sẻ các bài viết của bạn lên các mạng xã hội phổ biến hiện nay như facebook, google +, Twiter, Rss.
Bài viết này mình tiếp tục chia sẻ một style nữa của subscribe box widget cho Blogger. Các bạn có thể xem hình bên.
Sau đây là các bước thực hiện:
Bước 1: Tại trang quản trị blog, các bạn vào Bố cục, tạo một tiện ích HTML/JavaScripts.Bước 2: Dán đoạn code bên dưới vào ô nội dung:
<!--Subscribe box style 4 by kjmagic.blogspot.com--> <style>#topbox{width:250px;border:1px solid #a1a1a1;background-color:#ffffff;padding-bottom:15px;padding-top:5px;padding-left:5px;} #news-letter{clear:both;padding-top:20px;} .msg-box{float:left;width:50px;height:54px;margin-right:9px;padding-top:5px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjik-0Tc6RXAuSrTd9fjz13Pr5LONIGf5XBFA-qNgA0EYt3mX3fSg0pq6a8wg5iaHNl4xWLAhDIPcu3Pomp2ZWC8WIlHSal13sgUrjQC-Ksxwx5qJggDjbXUqovKxpIbE_ytIhWXUxLhLI/s800/mail-box.png) no-repeat;} .news-headline{position: relative;z-index: 999;font-size: 18px;padding-bottom:10px;font-weight:bold;} </style><br /><div id="topbox"> <center> <div class="news-headline" color:="color:"> Cập nhật tin mới </div> </center> <center> <table border="0"><tbody> <tr><td style="padding-right: 4px;"><a href="http://twitter.com/quocdoantrinh" target="_blank" title="Follow Me On Twitter"><img src="http://www.techblis.org/wp-content/uploads/2013/08/twitter.png" style="height: 25px; width: 25px;" /></a></td><td style="padding-right: 4px;"><a href="http://feeds.feedburner.com/YourFeedID" target="_blank" title="Subscribe Via RSS"><img src="http://www.techblis.org/wp-content/uploads/2013/08/feed.png" style="height: 25px; width: 25px;" /></a></td><td style="padding-right: 4px;"><a href="http://www.facebook.com/kj.magician" target="_blank" title="Find Us On Facebook"><img src="http://www.techblis.org/wp-content/uploads/2013/08/feacebook.png" style="height: 25px; width: 25px;" /></a></td><td style="padding-right: 4px;"><a href="https://plus.google.com/your-gplus-id" target="_blank" title="Add me on Google+"><img src="http://www.techblis.org/wp-content/uploads/2013/08/gplus.png" style="height: 25px; width: 25px;" /></a></td><td style="padding-right: 4px;"><a href="http://youtube.com/username" target="_blank" title="Add To Technorati"><img src="http://www.techblis.org/wp-content/uploads/2013/08/feed-2.png" style="height: 25px; width: 25px;" /></a></td></tr> </tbody></table> </center> <a href="default.asp"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVotsPgP1ZUNHoH98H1ysNuAsUCZfG89DT7gMNtglqJ1ybWJncVknfba_c3ej2QXaZ5QKtTzhouw_zRxZWkmIR_uWQaEMNHuGjeIl5LibbkO59V6UM1oHVjIRisHl6XtayNxCfmNj-_eB9/s640/white-square-872x844.jpg" alt="rss subscribe widget for blogger" width="1" height="1" /></a><div id="news-letter"> <span class="msg-box"></span><b>Đăng ký bằng Email</b><br /><form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=KjMagic', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"> <input class="ebutton3" gtbfieldid="2" maxlength="100" name="email" onfocus="this.value = '';" size="25" style="color: #333333; font-size: 11px; height: 21px; width: 130px;" type="text" valign="middle" value="Enter your email address" /><input name="uri" type="hidden" value="KjMagic" /><input name="loc" type="hidden" value="en_US" /><input class="ebutton2" id="submit" style="font-size: 11px;" type="submit" value="Đăng ký" /></form> </div> </div> <div class="clear"> </div> <br /><div class="clear"> </div> <!--/Subscribe box style 4 by kjmagic.blogspot.com-->
Sửa những chỗ mình đánh dấu thành ID của bạn.
Chúc thành công !
Xem thêm thủ thuật: www.đoàntrịnh.vn
Nhận xét
Nhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóaBạn ơi bạn có thể chỉnh hộ mình các trang label hiển thị chỉ có tiêu đề và ảnh giống như trang này http://genk.vn/thu-thuat/page-105.chn hoặc tương tự như vậy được không bạn blog của mình http://ketnoicn.blogspot.com/search/label/Th%E1%BB%A7%20Thu%E1%BA%ADt%20Ph%E1%BA%A7n%20M%E1%BB%81m
Trả lờiXóaTrong mẫu sau thẻ <data.post:body/> có đoạn scrip tương tự như dưới:
Trả lờiXóa<script type='text/javascript'> createSummaryAndThumb("...............");
</script>
Chú ý coi chừng xóa nhầm đoạn recent post ở trang chủ.
xóa nó đi nếu không muốn có ảnh và mô tả.
với mẫu đó đoạn mô tả và hình ảnh chung trong một sumary nên xóa ảnh tương đương với xóa mô tả và ngược lại.
Trả lờiXóaNếu muốn xóa một đoạn thì ta có thể chú ý phần sau:
if(thumbnail_mode == "yes") {
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
Đoạn in đậm thứ 2 là đoạn mô tả, Muốn bỏ phần mô tả ta chỉ cần bỏ đoạn in đậm tương ứng đi là được.
CÁCH KHÁC=> ta điều chỉnh đoạn có dạng như bên dưới:
var thumbnail_mode = "yes"; // bật hoặc tắt ảnh thu nhỏ
summary_noimg = 198; Phần mô tả khi có ảnh thumbnail (không muốn có thì sửa thành 0
summary_img = 198; Phần mô tả khi không có ảnh thumbnail (không muốn có thì sửa thành 0
img_thumb_height = 160; chiều cao ảnh
img_thumb_width = 300; chiều rộng ảnh
Nhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóa