WordPress.org

Ready to get started?Download WordPress

Forums

Five column front page (2 posts)

  1. cruthas
    Member
    Posted 1 year ago #

    I am trying to create a dynamic five column wordpress front page. I am building my theme using the Reverie framework (based on ZURB’s Foundation (http://foundation.zurb.com/docs/)). In the image below you can see the five columns with icons, an h tag and a paragraph below them. I can build this statically but was hoping someone could point me in the right direction on how to do this dynamically in wordpress so the icons can be changed along with the h tag and paragraph text.

    Any help would be greatly appreciated.

    http://crothersenvironmental.com/images/crothers.jpg

    Thanks in advance.

  2. cruthas
    Member
    Posted 1 year ago #

    Ok, for anyone else that might be looking for the same thing, here is the solution that worked for me.

    from Max at stockflow:
    I'd recommend using a custom post type for that. Others would argue to use widgets, others would say keep it simple and use a category in posts, while others still would say to just add admin panel options to change it.

    With my personal option, you'd install a plugin called Custom Press. Configure a new post type (call it services or something, and make sure Title, Editor, and Thumbnail are checked under "Supports".

    Now in your home page (i plug it into a custom page template) you'd query the custom posts (limiting it to 5), the image would be the post's featured image, the description would be the post's content, and the post's title would be the service's name.

    Create the five posts in the newly created section (should show up right under Comments in the admin panel).

    To query the posts on your home page (I used a custom page template), try something like:

    <?php
    $query = new WP_Query(array('post_type'=>'services','posts_per_page'=>'5'));
    while ($query->have_posts()) : $query->the_post();
    ?>
    <!-- Post Start -->
    <?php the_post_thumbnail(array(150,150), array("class"=>"service-image")); ?>
    <h2><?php the_title(); ?></h2>
    <p><?php the_content(); ?></p>

    <?php endwhile; wp_reset_query(); ?>
    What that does is query the five newest posts in the post type 'services' (that is what you set in custom press) and loops through each one printing out first the image, then the title, then the content. You'll need to style this and change it's structure to match yours.

    I hope this helps anyone looking to add columns to their theme.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.