我最近购买了一个响应式网站模板，我对我的博客文章如何在我的博客时间轴和主页上自动显示博客帖子片段（简介）感到困惑。我正在使用Umbraco cms（6.1.5），这是我的博客文章html代码：
<!DOCTYPE html>
<!--[if IE 8 ]><html lang="en" class="isie ie8 oldie no-js"><![endif]-->
<!--[if IE 9 ]><html lang="en" class="isie ie9 no-js"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html lang="en" class="no-js">
<!--<![endif]-->
<head>
<!-- Meta Tags -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="<umbraco:Item field="postMetaDescription" runat="server" />">
<!-- Title -->
<title><umbraco:Item field="postTitle" runat="server" /></title>
<!-- Favicon -->
<link rel="shortcut icon" href="img/favicon.jpg" type="image/x-icon"/>
<!-- Google Fonts -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,400italic,700' rel='stylesheet' type='text/css'>
<!-- Stylesheets -->
<link rel='stylesheet' id='twitter-bootstrap-css' href='css/bootstrap.min.css' type='text/css' media='all'/>
<link rel='stylesheet' id='fontello-css' href='css/fontello.css' type='text/css' media='all'/>
<link rel='stylesheet' id='prettyphoto-css-css' href='js/prettyphoto/css/prettyPhoto.css' type='text/css' media='all'/>
<link rel='stylesheet' id='animation-css' href='css/animation.css' type='text/css' media='all'/>
<link rel='stylesheet' id='perfectscrollbar-css' href='css/perfect-scrollbar-0.4.10.min.css' type='text/css' media='all'/>
<link rel='stylesheet' id='jquery-validity-css' href='css/jquery.validity.css' type='text/css' media='all'/>
<link rel='stylesheet' id='jquery-ui-css' href='css/jquery-ui.min.css' type='text/css' media='all'/>
<link rel='stylesheet' id='style-css' href='css/style.css' type='text/css' media='all'/>
<link rel='stylesheet' id='mobilenav-css' href='css/mobilenav.css' type='text/css' media="screen and (max-width: 838px)"/>
<!-- jQuery -->
<script src="scripts/jquery-1.11.1.min.js"></script>
<!--[if lt IE 9]>
<script>
document.createElement("header");
document.createElement("nav");
document.createElement("section");
document.createElement("article");
document.createElement("aside");
document.createElement("footer");
document.createElement("hgroup");
</script>
<![endif]-->
<!--[if lt IE 9]>
<script src="scripts/html5.js"></script>
<![endif]-->
<!--[if lt IE 7]>
<script src="scripts/icomoon.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<link href="css/ie.css" rel="stylesheet">
<![endif]-->
<!--[if lt IE 9]>
<script src="scripts/jquery.placeholder.js"></script>
<script src="scripts/script_ie.js"></script>
<![endif]-->
</head>
<body class="w1170 headerstyle1">
<!-- Marine Content Wrapper -->
<body class="w1170 headerstyle1">
<!-- Marine Content Wrapper -->
<div id="marine-content-wrapper">
<header id="header" class="style6">
<div id="upper-header">
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="item left hidden-separator">
<ul id="menu-shop-header" class="menu">
</ul>
</div>
<div class="item right hidden-separator">
<div class="shopping-cart-dropdown">
<div class="cart-menu-item ">
<div class="sc-header">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Main Header -->
<div id="main-header">
<div class="container">
<div class="row">
<!-- Logo -->
<div class="col-lg-4 col-md-4 col-sm-4 logo">
<a href="index.html" title="Marine" rel="home"><img class="logo" src="img/marine-logo.png" alt="Marine"></a>
<div id="main-nav-button">
<span></span>
<span></span>
<span></span>
</div>
</div>
<div class="col-sm-8 align-right">
<!-- Text List -->
<ul class="text-list">
<li>Call Us: +1 800 450 17 08</li>
</ul>
<!-- Social Media -->
<ul class="social-media">
<li><a target="_blank" href="http://facebook.com"><i class="icon-facebook"></i></a>
</li>
<li><a target="_blank" href="http://twiiter.com/google"><i class="icon-twitter"></i></a>
</li>
<li><a target="_blank" href="http://google.com"><i class="icon-google"></i></a>
</li>
<li><a target="_blank" href="http://linkedin.com"><i class="icon-linkedin"></i></a>
</li>
<li><a target="_blank" href="http://instagram.com"><i class="icon-instagram"></i></a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- /Main Header -->
<!-- Lower Header -->
<div id="lower-header">
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="lower-logo">
<a href="index.html" title="Marine" rel="home"><img class="logo" src="img/marine-logo.png" alt="Marine"></a>
</div>
<!-- Main Navigation -->
<ul id="main-nav">
<ul class='mainMenu'>
<li><a href='http://www.redflyseo.co.za' title='Home'>HOME</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/seo' title='SEO'>SEO</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/social-media' title='SOCIAL MEDIA'>SOCIAL MEDIA</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/content-marketing' title='CONTENT MARKETING'>CONTENT MARKETING</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/digital-audits' title='DIGITAL AUDITS'>DIGITAL AUDITS</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/sme-business-package' title='SME BUSINESS PACKAGE'>SME BUSINESS PACKAGE</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/blog' title='BLOG'>BLOG</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/contact-us' title='Contact Us'>CONTACT US</a></li>
</ul>
<!-- /Main Navigation -->
</div>
</div>
</div>
<!-- /Lower Header -->
<script type="text/javascript">
//<![CDATA[
(function() {
var shr = document.createElement('script');
shr.setAttribute('data-cfasync', 'false');
shr.src = '//dsms0mj1bbhn4.cloudfront.net/assets/pub/shareaholic.js';
shr.type = 'text/javascript'; shr.async = 'true';
shr.onload = shr.onreadystatechange = function() {
var rs = this.readyState;
if (rs && rs != 'complete' && rs != 'loaded') return;
var site_id = '4703ccf47ac9b99588c7a6fb9d1b4ce2';
try { Shareaholic.init(site_id); } catch (e) {}
};
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(shr, s);
})();
//]]>
</script>
</header>
<!-- /Header -->
<!-- Marine Content Inner -->
<div id="marine-content-inner">
<!-- Main Content -->
<section id="main-content">
<!-- Container -->
<div class="container">
<!-- Container -->
<div class="container">
<div class="page-heading style3 wrapper border-bottom ">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6">
<h1><umbraco:Item field="blogPostTitle" runat="server" /></h1>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<p class="breadcrumbs" xmlns:v=""><span typeof="v:Breadcrumb"><a rel="v:url" property="v:title" href="http://www.redflyseo.co.za">Home</a></span><span class="delimiter">|</span> <span typeof="v:Breadcrumb"><a rel="v:url" property="v:title" href="#">Blog</a></span><span class="delimiter">|</span> <span class="current"><umbraco:Item field="pageName" runat="server" /></span></p>
</div>
</div>
</div>
<div class="row">
<section class="main-content col-lg-9 col-md-8 col-sm-8 small-padding">
<div class="row">
<div id="post-items">
<!-- Post Item -->
<div class="post blog-post blog-post-classic col-lg-12 col-md-12 col-sm-12 margin-top20">
<div class="blog-post-list">
<div class="blog-post-meta">
<span class="post-date">
<span class="post-day"><umbraco:Item field="day" runat="server" /></span><br/>
<umbraco:Item field="monthYear" runat="server" /> </span>
<span class="post-format">
<span class="photo-icon"></span>
</span>
<img alt='' src='<umbraco:Item field="authorPhoto" runat="server" />' class='avatar'/>
<span class="author"><umbraco:Item field="writerName" runat="server" /></span>
</div>
<div class="blog-post-content">
<!-- Post Image -->
<div class="post-thumbnail">
<img src="<umbraco:Item field="blogPhoto" runat="server" />" alt=""/>
<div class="post-hover">
</div>
</div>
<!-- /Post Image -->
<!-- Post Content -->
<div class="post-content">
<ul class="post-meta">
<li>no comments</li>
</ul>
<ul class="social-icons style2 social-media">
<li><a target="_blank" href="#">
<i class="icon-facebook-squared"></i>
</a>
</li>
<li>
<a target="_blank" href="#">
<i class="icon-twitter"></i>
</a>
</li>
<li>
<a href="#">
<i class="icon-google"></i>
</a>
</li>
<li>
<a target="_blank" href="#" >
<i class="icon-pinterest"></i>
</a>
</li>
<li>
<a href="#">
<i class="icon-linkedin"></i>
</a>
</li>
</ul>
<p><umbraco:Item field="content" runat="server" /></p>
</div>
<!-- /Post Content -->
</div>
</div>
<div class="post-author margin-bottom35">
<img alt="" src="img/avatar.png" class="avatar">
<h3>About Jack</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A accusantium adipisci architecto aspernatur consequuntur debitis distinctio dolorem, doloremque eius error eum eveniet facere harum impedit incidunt labore magnam modi necessitatibus non optio perspiciatis quas saepe similique tempore temporibus totam unde velit! Animi architecto culpa dolor expedita id illum impedit praesentium quae? Alias amet, exercitationem iure natus obcaecati ratione! Accusantium assumenda, dignissimos eveniet incidunt nesciunt perspiciatis similique. Alias aperiam architecto, autem ea error harum modi nemo nobis obcaecati quas. Accusamus atque aut consequatur consequuntur cumque debitis dolorem esse incidunt iure odio, odit, quia, repellendus saepe. Deserunt id libero magnam sunt voluptatum?</p>
</div>
</div>
<!-- /Post Item -->
</div>
</div><div class="row">
<div class="col-sm-12">
<div id="comments" class="post-comments">
<div id="respond" class="comment-respond">
</form>
</div><!-- #respond -->
</div><!-- #comments -->
</div>
</div>
</section>
<aside class="sidebar col-lg-3 col-md-4 col-sm-4">
<div id="twitter-rss-2" class="widget Twitter_Counter_media">
<div class="social">
<div class="social-item">
<a href="google">
<img alt="" src="img/twitter.png">
<span><span class="bold">9401354</span><br>
Followers</span>
</a>
</div>
<div class="social-item">
<a href="#">
<img alt="" src="img/rss.png">
<span><span class="bold">Subscribe</span><br>
to RSS Feed</span>
</a>
</div>
</div>
</div>
<div id="call-to-action-widget-2" class="widget widget_call_to_action">
<h3></h3>
<div class="info-box">
<h2><umbraco:Item field="callTitle" runat="server" /></h2>
<h4><umbraco:Item field="ndHeader" runat="server" /></h4>
<a href="#" target="_self" class="button"><umbraco:Item field="buttonText" runat="server" /></a>
</div>
</div>
</aside>
</div>
</div>
<!-- /Container -->
</section>
<!-- /Main Content -->
</div>
<!-- /Marine Conten Inner -->
<!-- Footer -->
<footer id="footer">
<!-- Main Footer -->
<div id="main-footer" class="smallest-padding">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-3">
<div id="text-2" class="widget widget_text">
<div class="textwidget">
<img src="img/marine-logo-light.png" alt="logo">
<p>
Vivamus orci sem, consectetur ut vestibulum a, mper ac dui. Aenean tellus nisl, commodo eu aliquet ut, pulvinar ut sapien. Proin tate aliquam mi nec hendrerit.
</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-3">
<div id="latest-posts-3" class="widget widget_latest_posts_entries">
<h4>Latest Posts</h4>
<div class="blog-post">
<span class="post-meta">June 11, 2014 | Jack</span>
<a class="post-title" title="Single Blog Post" href="#">Single Blog Post</a>
<p>
Suspendisse ornare tincidunt massa et malesuada. Integer consequat suscipit velit
</p>
</div>
<div class="blog-post">
<span class="post-meta">June 8, 2014 | Jack</span>
<a class="post-title" title="A Simple Text Post" href="#">A Simple Text Post</a>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed eleifend
</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-3">
<div id="text-4" class="widget widget_text">
<h4>Contact</h4>
<div class="textwidget">
<ul class="iconic-list">
<li>
<i class="icons icon-location-7"></i>
Phoenix Inc.<br>
PO Box 21177 <br>
Little Lonsdale St, Melbourne <br>
Victoria 8011 Australia </li>
<li>
<i class="icons icon-mobile-6"></i>
Phone: (415) 124-5678 <br>
Fax: (415) 124-5678 </li>
<li>
<i class="icons icon-mail-7"></i>
support@yourname.com </li>
</ul>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-3">
<div id="wysija-3" class="widget widget_wysija">
</div>
</div>
<div id="social-media-2" class="widget widget_social_media">
<h4>Follow Us</h4>
<ul class="social-media">
<li class="tooltip-ontop" title="Facebook"><a href="dfsdfsdfscvc"><i class="icon-facebook"></i></a></li>
<li class="tooltip-ontop" title="Twitter"><a href="dfsder"><i class="icon-twitter"></i></a></li>
<li class="tooltip-ontop" title="Google Plus"><a href="sdfs"><i class="icon-google"></i></a></li>
<li class="tooltip-ontop" title="Linkedin"><a href="fsdfsd"><i class="icon-linkedin"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- /Main Footer -->
<!-- Lower Footer -->
<div id="lower-footer">
<div class="container">
<span class="copyright">© 2014 Marine. All Rights Reserved</span>
</div>
</div>
<!-- /Lower Footer -->
</footer>
<!-- /Footer -->
</div>
<!-- /Marine Content Wrapper -->
<!-- JavaScript -->
<script type='text/javascript' src='scripts/bootstrap.min.js'></script>
<script type='text/javascript' src='scripts/jquery-ui.min.js'></script>
<script type='text/javascript' src='scripts/jquery.easing.1.3.js'></script>
<script type='text/javascript' src='scripts/jquery.mousewheel.min.js'></script>
<script type='text/javascript' src='scripts/SmoothScroll.min.js'></script>
<script type='text/javascript' src='scripts/jquery.prettyPhoto.js'></script>
<script type='text/javascript' src='scripts/modernizr.js'></script>
<script type='text/javascript' src='scripts/wow.min.js'></script>
<script type='text/javascript' src='scripts/jquery.sharre.min.js'></script>
<script type='text/javascript' src='scripts/jquery.flexslider-min.js'></script>
<script type='text/javascript' src='scripts/jquery.knob.js'></script>
<script type='text/javascript' src='scripts/jquery.mixitup.min.js'></script>
<script type='text/javascript' src='scripts/masonry.min.js?ver=3.1.2'></script>
<script type='text/javascript' src='scripts/jquery.masonry.min.js?ver=3.1.2'></script>
<script type='text/javascript' src='scripts/jquery.fitvids.js'></script>
<script type='text/javascript' src='scripts/perfect-scrollbar-0.4.10.with-mousewheel.min.js'></script>
<script type='text/javascript' src='scripts/jquery.nouislider.min.js'></script>
<script type='text/javascript' src='scripts/jquery.validity.min.js'></script>
<script type='text/javascript' src='scripts/tweetie.min.js'></script>
<script type='text/javascript' src='scripts/script.js'></script>
</body>
</html>
这是我的博客帖子时间轴代码：
<!DOCTYPE html>
<!--[if IE 8 ]><html lang="en" class="isie ie8 oldie no-js"><![endif]-->
<!--[if IE 9 ]><html lang="en" class="isie ie9 no-js"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html lang="en" class="no-js">
<!--<![endif]-->
<head>
<!-- Meta Tags -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Marine Main 1">
<!-- Title -->
<title>Blog Timeline Style | Marine</title>
<!-- Favicon -->
<link rel="shortcut icon" href="img/favicon.jpg" type="image/x-icon"/>
<!-- Google Fonts -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,800' rel='stylesheet' type='text/css'>
<!-- Stylesheets -->
<link rel='stylesheet' id='twitter-bootstrap-css' href='css/bootstrap.min.css' type='text/css' media='all'/>
<link rel='stylesheet' id='fontello-css' href='css/fontello.css' type='text/css' media='all'/>
<link rel='stylesheet' id='prettyphoto-css-css' href='css/prettyPhoto.css' type='text/css' media='all'/>
<link rel='stylesheet' id='animation-css' href='css/animation.css' type='text/css' media='all'/>
<link rel='stylesheet' id='perfectscrollbar-css' href='css/perfect-scrollbar-0.4.10.min.css' type='text/css' media='all'/>
<link rel='stylesheet' id='jquery-validity-css' href='css/jquery.validity.css' type='text/css' media='all'/>
<link rel='stylesheet' id='jquery-ui-css' href='css/jquery-ui.min.css' type='text/css' media='all'/>
<link rel='stylesheet' id='style-css' href='css/style.css' type='text/css' media='all'/>
<link rel='stylesheet' id='mobilenav-css' href='css/mobilenav.css' type='text/css' media="screen and (max-width: 838px)"/>
<!-- jQuery -->
<script src="scripts/jquery-1.11.1.min.js"></script>
<!--[if lt IE 9]>
<script>
document.createElement("header");
document.createElement("nav");
document.createElement("section");
document.createElement("article");
document.createElement("aside");
document.createElement("footer");
document.createElement("hgroup");
</script>
<![endif]-->
<!--[if lt IE 9]>
<script src="scripts/html5.js"></script>
<![endif]-->
<!--[if lt IE 7]>
<script src="scripts/icomoon.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<link href="css/ie.css" rel="stylesheet">
<![endif]-->
<!--[if lt IE 9]>
<script src="scripts/jquery.placeholder.js"></script>
<script src="scripts/script_ie.js"></script>
<![endif]-->
</head>
<body class="w1170 headerstyle1">
<!-- Marine Content Wrapper -->
<div id="marine-content-wrapper">
<header id="header" class="style6">
<div id="upper-header">
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="item left hidden-separator">
<ul id="menu-shop-header" class="menu">
</ul>
</div>
<div class="item right hidden-separator">
<div class="shopping-cart-dropdown">
<div class="cart-menu-item ">
<div class="sc-header">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Main Header -->
<div id="main-header">
<div class="container">
<div class="row">
<!-- Logo -->
<div class="col-lg-4 col-md-4 col-sm-4 logo">
<a href="index.html" title="Marine" rel="home"><img class="logo" src="img/marine-logo.png" alt="Marine"></a>
<div id="main-nav-button">
<span></span>
<span></span>
<span></span>
</div>
</div>
<div class="col-sm-8 align-right">
<!-- Text List -->
<ul class="text-list">
<li>Call Us: +1 800 450 17 08</li>
</ul>
<!-- Social Media -->
<ul class="social-media">
<li><a target="_blank" href="http://facebook.com"><i class="icon-facebook"></i></a>
</li>
<li><a target="_blank" href="http://twiiter.com/google"><i class="icon-twitter"></i></a>
</li>
<li><a target="_blank" href="http://google.com"><i class="icon-google"></i></a>
</li>
<li><a target="_blank" href="http://linkedin.com"><i class="icon-linkedin"></i></a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- /Main Header -->
<!-- Lower Header -->
<div id="lower-header">
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="lower-logo">
<a href="index.html" title="Marine" rel="home"><img class="logo" src="img/marine-logo.png" alt="Marine"></a>
</div>
<!-- Main Navigation -->
<ul id="main-nav">
<ul class='mainMenu'>
<li><a href='http://www.redflyseo.co.za' title='Home'>HOME</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/seo' title='SEO'>SEO</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/social-media' title='SOCIAL MEDIA'>SOCIAL MEDIA</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/content-marketing' title='CONTENT MARKETING'>CONTENT MARKETING</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/digital-audits' title='DIGITAL AUDITS'>DIGITAL AUDITS</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/sme-business-package' title='SME BUSINESS PACKAGE'>SME BUSINESS PACKAGE</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/blog' title='Blog'>BLOG</a></li>
 | 
<li><a href='http://www.redflyseo.co.za/contact-us' title='Contact Us'>CONTACT US</a></li>
</ul>
</div>
</div>
</div>
</div>
<!-- /Lower Header -->
<script type="text/javascript">
//<![CDATA[
(function() {
var shr = document.createElement('script');
shr.setAttribute('data-cfasync', 'false');
shr.src = '//dsms0mj1bbhn4.cloudfront.net/assets/pub/shareaholic.js';
shr.type = 'text/javascript'; shr.async = 'true';
shr.onload = shr.onreadystatechange = function() {
var rs = this.readyState;
if (rs && rs != 'complete' && rs != 'loaded') return;
var site_id = '4703ccf47ac9b99588c7a6fb9d1b4ce2';
try { Shareaholic.init(site_id); } catch (e) {}
};
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(shr, s);
})();
//]]>
</script>
</header>
<!-- /Header -->
<!-- Marine Content Inner -->
<div id="marine-content-inner">
<!-- Main Content -->
<section id="main-content">
<!-- Container -->
<div class="container">
<section class="full-width dark-blue-bg page-heading position-left-top size-cover" style="background-image: http://placehold.it/1903x90">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6">
<h1><umbraco:Item field="blogName" runat="server" /></h1>
</div>
</div>
</div>
</section>
<script>
var timelinePerPage = 8;
var timelineOffset = 0;
var timelineOffsetNext = ( timelinePerPage * timelineOffset ) + timelinePerPage; // Current
// Offset of page
var currentMonth = null;
var currentYear = null;
var templateUrl = "<umbraco:Item field="path" runat="server" />";
</script>
<section class="full-width-bg normal-padding medium-gray-bg ">
<div class="timeline-container-wrap">
<div class="timeline-date-tooltip">
<span>June 2014</span>
</div>
<div class="row timeline-row">
<div class="masonry-container timeline-container">
<div class="col-lg-6 col-md-6 col-sm-6 masonry-box" data-year="2014" data-month="June">
<div class="blog-post masonry timeline">
<!-- POST FOOTER -->
<div class="post-footer">
<img alt='' src='img/avatar.png' class='avatar'/><span class="post-date">
<span class="post-day">11 june </span>
2014 </span>
<ul class="post-meta">
<li> By Jack </li>
</ul>
</div>
<!-- END POST FOOTER -->
<div class="post">
<div class="post-thumbnail">
<img src="http://placehold.it/528x214" alt="Quotes Time!"/>
<div class="post-hover">
<a class="link-icon" href="#"></a><a class="search-icon prettyPhoto" href="http://placehold.it/870x475"></a>
</div>
</div>
<div class="post-content">
<div class="post-details">
<h4 class="post-title">
<span class="post-format">
<span class="document-icon"></span></span>
<a href='blog-single.html' title="Quotes Time!">Quotes Time!</a>
</h4>
</div>
<p class="latest-from-blog_item_text">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci. Duis libero orci, pretium a, convallis quis, pellentesque a, dolor. Curabitur vitae nisi non dolor vestibulum consequat. Proin vestibulum.
</p>
<a class="read-more big" href='blog-single.html' title="Quotes Time!">Read more</a>
</div>
<div class="clear">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- .masonry-container-wrapper -->
<div class="align-center load-more">
<a class="button big blue button-load-more" id="timeline-load-more" href="http://www.redflyseo.co.za/blog">Load More</a>
</div>
</section>
</div>
<!-- /Container -->
</section>
<!-- /Main Content -->
</div>
如果有人能帮助解决这个问题，我将不胜感激。我一直在研究并且在我的博客时间线和主页上显示博客帖子片段已经停留了大约一个月。我删除了一些页脚代码，因为我在这篇文章中达到了有限的字符。