WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Category Grid (11 posts)

  1. kwibbles
    Member
    Posted 4 years ago #

    My goal is to take one category and get it to post on another page as an image with a the title and date, so when someone adds a post and puts it under this category it will then display on another page in a grid.

    blog: http://blog.kylewebdeveloper.com/?page_id=24
    What i want to do: http://twitpic.com/1lckvv

    Any help would be greatly appreciated.

  2. vtxyzzy
    Member
    Posted 4 years ago #

    The columns can probably be created with the
    WP Post Columns plugin.

    To assign a category to the page which has the columns, use the Page Links To plugin.

  3. kwibbles
    Member
    Posted 4 years ago #

    The WP Post Columns plugin doesn't work.

    Also the Page Links To plugin is nice, but I don't want to redirect it outside the wordpress frame work.

  4. vtxyzzy
    Member
    Posted 4 years ago #

    OK. I think you will need to either find a theme that has a grid style template that you can adapt, or code one from scratch. I have installed the Zack-990 theme you are using, and will take a look to see how difficult it will be to modify it.

    As for the Page Links To plugin, it is ideal for having a page show a category. It will also link to almost anything else, but will certainly link a category to a page.

  5. vtxyzzy
    Member
    Posted 4 years ago #

    Here is a code snippet derived from index.php that should give you a start with the 4 column page. Make a copy of your index.php to fourcolumn.php. Add in the lines at the top to identify it as a template. Replace the lines between <div id="home_content"> and <div class="archive_nav"> with these:

    <div id="home_content">
    
          <?php $paged = (intval(get_query_var('paged'))) ? intval(get_query_var('paged')) : 1;
          query_posts("cat=39&paged=$paged");
          if (have_posts()) : ?>
             <?php while (have_posts()) : the_post();
                if( ++$count > 4) $count = 1;
                if ($count == 1) echo '<div class="row">'; ?>
                   <div class="col-post">
                      <p><b><?php the_title(); ?></b></p>
                      <?php the_excerpt('More Photos'); ?>
                   </div>
                <?php if ($count == 4) echo '</div><!-- End row --><div class="clear"></div>'; ?>
            <?php endwhile; ?>
            <?php if ($count < 4) echo '</div><!-- End row --><div class="clear"></div>'; ?>
    
             <div class="archive_nav">

    Use your own category number in the query.

    Create a new page and assign this as the template. You will also need to add styles for col-post and row to style.css. The samples below should be a starting point:

    .row {
       width: 100%;
       margin: 2px;
    }
    
    .col-post {
       width: 22%;
       float: left;
       margin: 2px;
       border: 1px solid green;
       padding: 0 .7em 0 .7em;
       min-height: 150px;
       text-wrap: unrestricted;
       overflow: hidden;
    }
  6. Allen Moore
    Member
    Posted 4 years ago #

    Thanks for this code snippet. I created another post looking for just what you posted here. Here's a link to a working result.

    http://www.bethelchurch.info/sermon-videos/

  7. kwibbles
    Member
    Posted 4 years ago #

    @vtxyzzy You are awesome thanks for the start. Now how do I assign this code to just the All Spaces page?

    @amcreative Is there any special way you did the thumbnails for that page?

  8. vtxyzzy
    Member
    Posted 4 years ago #

    1. Make a copy of your index.php to fourcolumn.php.
    2. Add in the lines at the top to identify it as a template.
      <?php
      /*
      Template Name: fourcolumn
      */?>
    3. Replace the lines between <div id="home_content"> and <div class="archive_nav"> with the ones above.
    4. In your All Spaces page, assign 'fourcolumn' as the template for the page.
    5. Add the .row and .col-post definitions to your style.css
  9. Allen Moore
    Member
    Posted 4 years ago #

    @kwibbles If you look down in the right hand corner of wordpress on a post you will see a heading "Post Thumbnail". Right under there, you will see a link for "Set Thumbnail". When that window opens up, upload your graphic and assign it as a thumbnail for your post.

    In your template where you want the thumbnail to appear, place the following code.
    <?php the_post_thumbnail(); ?>

    And that will give you a post thumbnail.

  10. kwibbles
    Member
    Posted 4 years ago #

    As I posted the message I figured it out, thanks a lot vtxyzzy you've been a great help!

  11. vtxyzzy
    Member
    Posted 4 years ago #

    You are welcome!

Topic Closed

This topic has been closed to new replies.

About this Topic