javascript - Using RSS content to display posts in custom placeholders -
i'm doing website , until now, i've been using rss feed widget. well, want little more stylish (something fits website). basically, want - rss titles, images, short post content , post times websites rss feed, , display in nice fancy placeholders have on homepage. here homepage code (specifically recent posts section):
<div id="templatemo-blog"> <div class="container"> <div class="row"> <div class="templatemo-line-header" style="margin-top: 0px;" > <div class="text-center"> <hr class="team_hr team_hr_left hr_gray"/><span class="span_blog txt_darkgrey">blog posts</span> <hr class="team_hr team_hr_right hr_gray" /> </div> </div> <br class="clearfix"/> </div> <div class="blog_box"> <div class="col-sm-5 col-md-6 blog_post"> <ul class="list-inline"> <li class="col-md-4"> <a href="#"> <img class="img-responsive" src="images/blog-image-1.jpg" alt="gallery 1" /> </a> </li> <li class="col-md-8"> <div class="pull-left"> <span class="blog_header">this post</span><br/> <span>posted : <a class="link_orange" href="#"><span class="txt_orange">tracy</span></a></span> </div> <div class="pull-right"> <a class="btn btn-orange" href="#" role="button">21 february 2084</a> </div> <div class="clearfix"> </div> <p class="blog_text"> aliquam quis rutrum risus, ut condimentum ipsum. nullam aliquet libero augue, eget auctor felis vulputate id. proin enim eu libero ornare malesuada. sed iaculis fringilla lacinia. sed laoreet lectus vitae [...] </p> </li> </ul> </div> <!-- /.blog_post 1 --> <div class="col-sm-5 col-md-6 blog_post"> <ul class="list-inline"> <li class="col-md-4"><a href="#"> <img class="img-responsive" src="images/blog-image-2.jpg" alt="gallery 2" /></a> </li> <li class="col-md-8"> <div class="pull-left"> <span class="blog_header">website template</span><br/> <span>posted : <a class="link_orange" href="#"><span class="txt_orange">mary</span></a></span> </div> <div class="pull-right"> <a class="btn btn-orange" href="#" role="button">18 february 2084</a> </div> <div class="clearfix"> </div> <p class="blog_text"> morbi imperdiet ipsum sit amet dui pharetra, vulputate porta neque tristique. quisque id turpis tristique, venenatis erat sit amet, venenatis turpis. ut tellus ipsum, posuere bibendum [...] </p> </li> </ul> </div><!-- /.blog_post 2 --> <div class="templatemo_clear"></div> <div class="col-sm-5 col-md-6 blog_post"> <ul class="list-inline"> <li class="col-md-4"><a href="#"> <img class="img-responsive" src="images/blog-image-2.jpg" alt="gallery 3" /></a> </li> <li class="col-md-8"> <div class="pull-left"> <span class="blog_header">web development</span><br/> <span>posted : <a class="link_orange" href="#"><span class="txt_orange">julia</span></a></span> </div> <div class="pull-right"> <a class="btn btn-orange" href="#" role="button">14 february 2084</a> </div> <div class="clearfix"> </div> <p class="blog_text"> fusce molestie tellus risus, id commodo turpis convallis id. morbi mattis sapien sapien, vitae lacinia ante interdum sit amet. praesent eget varius diam, ac tempor est. mauris @ scelerisque magna [...] </p> </li> </ul> </div><!-- /.blog_post 3 --> <div class="col-sm-5 col-md-6 blog_post"> <ul class="list-inline"> <li class="col-md-4"> <a href="#"> <img class="img-responsive" src="images/blog-image-1.jpg" alt="gallery 4" /> </a> </li> <li class="col-md-8"> <div class="pull-left"> <span class="blog_header">new fluid layout</span><br/> <span>posted : <a class="link_orange" href="#"><span class="txt_orange">linda</span></a></span> </div> <div class="pull-right"> <a class="btn btn-orange" href="#" role="button">11 february 2084</a> </div> <div class="clearfix"> </div> <p class="blog_text"> in venenatis sodales purus cursus. ut consectetur, libero ac elementum tristique, enim ante aliquet mauris, scelerisque congue magna neque ac purus. aliquam facilisis volutpat odio [...] </p> </li> </ul> </div> <!-- /.blog_post 4 --> </div> </div> </div>
here visual reference of above code:
basically, want - replace information pre-set there (from template i'm referencing), have no idea how that. if required, i'd happy upload entire project (html, css, js, img). appreciate in advance :)
Comments
Post a Comment