How to divide posts into blocks?
-
Hi,
I am creating a custom theme for a friend. I would like to know how to get this page:
https://shwangguitars.com/guitars/
to look like this page:
https://shwangguitars.com/fguitars/ (beneath the image)
in how the /fguitars page has space between each post rather than a horizontal rule. (Ignore the shortened width, I have some CSS coding to do.) I have experimented with moving around the closing </div> tag, but the closest I can get is that the red background ends at the first post, and the second post is against the brown background.How do I enclose the loop so that each post is its own block?
Long version of my question:
My site has 3 different posts:
Blog
Guitars (guitars he’s built)
RepairsGuitars and Repairs will look different from Blog (https://shwangguitars.com/blog/). I want Guitars and Repairs to have their own content blocks that will show an excerpt of the post, and then click into the individual post. The Guitars and Repairs individual post page will not look like the individual Blog post page because the Blog post page has a right side bar.
My first attempt to accomplish this was to use the Posts in Page plugin (which is what /fguitars is using). It was easy for me to get each post into its own block using CSS and modifying the template a bit; however, when I clicked into each post, it went to the individual blog post template, which had the sidebar and link back to the blog. I did not want that, so I resorted to learning how to make a custom post type.
I have successfully created two custom post types: one for Guitars and another for Repairs. The Guitars and Repairs templates will look the same so I’m just going to work on Guitars and copy it to Repairs. However, I can’t separate the posts other than using <hr />, but that just inserts a brown horizontal line whereas I want the posts to look like separate entities.
I want all the posts for Guitars to show up on /guitars so I made it an archive page (if anyone has any better suggestion on how to do that, I welcome it, but it does what I need it to do in that it shows all the Guitar posts). Here is the code:
<?php /* Template Name: Archive-Guitars */ ?> <?php get_header(); ?> <h1>Guitars I've Built</h1> <div id="blog-content"> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <?php if ( has_post_thumbnail() ) {the_post_thumbnail('thumbnail');}?> <div id="blog-content-text"><h2><a>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <div id="date"><?php the_time('F jS, Y') ?></div> <div id="blog-text"><?php the_excerpt(); ?></div> <hr /></div> <?php endwhile; else: ?> <p><?php _e('Sorry, no posts matched your criteria.'); ?></p><?php endif; ?> </div> <div class="clear"></div> <?php get_footer(); ?>
How do I enclose the blog posts to be its own individual block?
Thank you so much for reading this. I know my question was long!
Sincerely,
Chloe
- The topic ‘How to divide posts into blocks?’ is closed to new replies.