CODEWITHSUNDEEP
phphtmlcsswordpress
user3688814
user3688814

Reputation: 69

Displaying last 3 blog posts on wordpress custom theme

I have a custom theme I am working on in wordpress, and I want to display the last 3 blog posts made onto my home page. I also want to style certain information regarding each post differently, like have the month and year be a certain font, and the day be much bolder and different font as well, along with displaying like a sentence or less of the article, followed by a "..." and "read more" type of thing.

How do I pull data from the blog? I know there are certain wordpress functions that can get me this data but I haven't been able to quite figure out how to do it, I'm not really well versed in the wordpress php functions. Right now I just have it hard coded but it's annoying to have to retype everything when I make a new post. I know you can set to show however many blog posts on the settings->reading but I want to be able to fully customize how it looks.

Let me know any suggestions on how I should go about doing this! 

<div class="bottom">
<div class="wrap-2"> 
<h2>Blog</h2>  

    <div class="content-div">
        <div class="bottom_box">
            <div class="btm-img"><h4>April <span>25</span><br />2014</h4></div>
            <div class="right_block">
                <p class="highlight2">blog title 1</p>
                <p class="highlight3">lksj sldkf jsl lsdkfj sdklf sd</p>
                <a href="#" class="more">Read More &gt;</a>
            </div>  
        </div>

        <div class="bottom_box">
            <div class="btm-img"><h4>April <span>24</span><br />2014</h4></div>
            <div class="right_block">
                <p class="highlight2">blog title 2</p>
                <p class="highlight3">lsdkjf lsdk fjsl dkkddk lsdkfjpaskldfj;</p>
                <a href="#" class="more">Read More &gt;</a>
            </div>  
        </div>

        <div class="bottom_box">
            <div class="btm-img"><h4>April <span>23</span><br />2014</h4></div>
            <div class="right_block">
                <p class="highlight2">blog title 3</p>
                <p class="highlight3">lksdjf slkdfjsldkfj;as dfklsd;j fsld;kfj</p>
                <a href="#" class="more">Read More &gt;</a>
            </div>  
        </div>
    </div>
</div>  
</div>

Upvotes: 1

Views: 344

Answers (1)

hex494D49
hex494D49

Reputation: 9225

Try the snippet below. Use your custom HTML block (the one with botom_box class) instead of this used below.

<?php $posts = get_posts("numberposts=3"); ?>
<?php if($posts) : ?>
    <?php foreach( $posts as $post ) : setup_postdata( $post ); ?>
        <!-- your HTML block goes here --->
        <div class="post">
        <h3><a href="<?php echo get_permalink($post->ID); ?>" ><?php echo $post->post_title; ?></a></h3>
        <?php the_excerpt(); ?>" rel="bookmark">read more</a>
        </div>
        <!-- end of the HTML block -->
    <?php endforeach; ?>
<?php endif; ?>

Upvotes: 2

Related Questions