Hiển thị bài viết blogspot giống Vietbao.vn

Hiển thị bài viết trong blogspot, blogger giống Vietbao.vn

Trong trang erhay này mình đã giới thiệu khá nhiều kiểu hiển thị cho bài viết trên blogger.

Bài viết này hướng dẫn bạn cách hiển thị bài viết giống trang đọc báo Vietbao.vn

VIEW DEMO

Bạn có thể tham khảo cách thêm vào blogspot:

Bước 1:

Đầu tiên thêm CSS: (Search với từ khóa ]]></skin> ). Đặt toàn bộ code trước thẻ này.

/*Style Việt báo by http://www.erhay.com */

html, body, p, ul, li, div, form, h1, h2, h3, h4, h5, h6, select, marquee, dl, dd, dt, fieldset, input, select, blockquote
{
margin: 0px;
padding: 0px;
}
a
{
color: #005399;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
}
a:hover
{
color: #333;
text-decoration: underline;
}
.erhay_class
{
float: left;
width: 385px;
overflow: hidden;
}
.erhay_class .title
{
width: 377px;
height: 24px;
overflow: hidden;
}
.erhay_class .title ul
{
margin: 0px;
padding: 0px;
}
.erhay_class .title li
{
float: left;
display: block;
list-style: none;
line-height: 24px;
font-size: 11px;
color: #999999;
padding: 0px 3px;
}
.erhay_class .title li a
{
float: left;
line-height: 24px;
font-size: 11px;
}
.erhay_class .title li.active a
{
padding-left: 8px;
}
.erhay_class .title li h4
{
font-size: 11px;
font-weight: normal;
}
.erhay_class .title li a span
{
}
.erhay_class .title li.active
{
padding: 0px 0px 0px 7px;
background: url(http://images/v2011/sprice_icon.gif) no-repeat left -1530px;
}
.erhay_class .title li.active h2
{
float: left;
display: block;
line-height: 24px;
background: url(http://images/v2011/sprice_icon.gif) no-repeat right -1530px;
padding-right: 10px;
}
.erhay_class .title li.active h2 a
{
font-size: 12px;
font-weight: bold;
color: #333333;
padding-bottom: 4px;
padding-left: 2px;
text-transform: uppercase;
}
.erhay_class .title li.active a.erhay_classx
{
background: url(http://images/v2011/sprice_ico1.gif) no-repeat left -1513px;
text-indent: -999px;
width: 14px;
height: 18px;
font-size: 0px;
line-height: 0px;
padding: 0px !important;
display: inline-block;
}
.erhay_class .title li.active h2 a span
{
}
.erhay_class .tnd
{
width: 372px;
padding: 10px 3px 10px 5px;
background: #fff url(http://images/v2011/bg_lnew.gif) repeat-x left top;
}
.erhay_class .tnd .image
{
float: left;
width: 138px;
height: 101px;
overflow: hidden;
margin-right: 8px;
}
.erhay_class .tnd a
{
font-weight: bold;
padding-bottom: 5px;
display: block;
font-size: 12px;
}
.erhay_class .tnd span
{
line-height: 150%;
}
.erhay_class .l_bv
{
margin-left: 5px;
}
.erhay_class .l_bv a
{
display: block;
background: url(http://images/v2011/sprice_bg.gif) no-repeat 0px -342px;
padding: 3px 0px 3px 10px;
height: 15px;
overflow: hidden;
}

Bước 2:

Đặt code sau trước </head>

<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
s = s.join("");
s = s.substring(0,chop-1);
return s;
}
function erhay(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();
document.write('');
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var pcm;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
pcm = entry.link[k].title.split(" ")[0];
break;
}
}
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
postdate = entry.published.$t;
if(j>imgr.length-1) j=0;
img[i] = imgr[j];
s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);
if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;
//cmtext = (text != 'no') ? '<i><font color="'+cmcolor+'">('+pcm+' '+text+')</font></i>' : '';

var month = [1,2,3,4,5,6,7,8,9,10,11,12];
var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
var day = postdate.split("-")[2].substring(0,2);
var m = postdate.split("-")[1];
var y = postdate.split("-")[0];
for(var u2=0;u2<month.length;u2++){
if(parseInt(m)==month[u2]) {
m = month2[u2] ; break;
}
}
//var daystr = (showPostDate) ? '<i><font color="'+cmcolor+'"> - ('+day+ ' ' + m + ' ' + y + ')</font></i>' : "";
posttitle = (aBold) ? "<b>"+posttitle+"</b>" : posttitle;
if ((i == 0)){
var trtd = '<div class="tnd clearfix"><div class="image"><a style="" href="'+posturl+'"><img src="'+img[i]+'" alt="" style="width:138px; height:101px"></a></div><h4><a style="" href="' + posturl + '" target ="_top">' + posttitle + '</a></h4><span style="">'+removeHtmlTag(postcontent,270)+'</span></div>';
document.write(trtd);
}
if (i == 1) {
var trtd = '<div class="l_bv"><a href="' + posturl + '" target ="_top">' + posttitle + '</a>';
document.write(trtd);
}
if (i == 2) {
var trtd = '<a href="' + posturl + '" target ="_top">' + posttitle + '</a>';
document.write(trtd);
}
if (i == 3) {
var trtd = '<a href="' + posturl + '" target ="_top">' + posttitle + '</a></div>';
document.write(trtd);
}
j++;
}
document.write('');
}
//]]>
</script>

Bước 3:
Đặt vị trí bạn muốn hiển thị bài viết như vietbao

<div class='erhay_class'>
<div class='title'><ul class='clearfix'>
<li class='active'>
<h2>
<a class='erhay_classx' href='#'>KINH TẾ RSS</a>
<a href='#'><span>KINH TẾ </span></a>
</h2>
</li>
<li>
<h3>
<a href='#'><span>Thị trường </span></a>
</h3>
</li>
<li>|</li><li>
<h3>
<a href='#'><span>Nhà đất </span></a>
</h3>
</li>
<li>|</li><li>
<h3>
<a href='#'><span>Chứng khoán </span></a>
</h3>
</li>
</ul>
</div>
<script type='text/javascript'>
document.write(rdlabels[index]);
</script>
<script language='JavaScript'>
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMF-2G5HrvAz01mDMwQMIwvQwpisAaj2PXSfA6B7oUlW9nOYvLf7Mp2TguT2blScn07GGfrLH6sV0x3iZ5Ox_JN5AzYmkjtSihY05RtXel_hg9OTGLetxIAa2P0V1VlNKeGpIVO3r7LxA/s149/finallogo.png";
showRandomImg = true;
aBold = false;
summaryPost = 0; //số ký tự của bài viết hiển thị (bài tóm tắt)
sumPost = 0;
numposts = 4; //số bài được hiển thị
label = "A.Máy tính";
</script>
<script src='http://www.erhay.com/feeds/posts/default/?orderby=updated&alt=json-in-script&callback=erhay' type='text/javascript'/></div>

Nếu bạn gặp khó khăn có thể để lại thắc mắc mình sẽ giúp

Ghi lại nguồn erhay khi bạn phát hành lại thông tin từ trang này

Anonymous6/14/13, 1:23 AM
I really like your blog.. very nice colors & theme.
Did you create this website yourself or did you hire someone
to do it for you? Plz reply as I'm looking to construct my own blog and would like to know where u got this from. thanks a lot

my webpage ... tham my vien

- Rất vui khi được mọi người nhận xét, đóng góp ý kiến để bài viết chất lượng hơn.
- Các ý kiến mang nội dung xấu, tính chất spam, chia rẽ, vi phạm sẽ bị xóa mà không nhắc nhở.
- Comment và share bài viết nếu bạn cảm thấy hay và thú vị.
- Không quên ghi lại nguồn erhay khi bạn phát hành lại thông tin từ trang này.

Hiển thị bài viết blogspot giống Vietbao.vn

Popular Posts

Fanpage

Erhay - Trang thông tin hay và hữu ích

Flickr

Labels

Nhận xét mới

Bài viết mới