WordPress › Support » How to create category archives like 101 Cookbooks?

BakingandBooks
Member
Posted 3 years ago #

Is there any way to create a category archive like the one on 101 Cookbooks using WordPress?

Snazzy Archives comes close, but it's organized by month/date instead of category.

Thanks for your time and help!
BakingandBooks
Member
Posted 3 years ago #

If this can't be done with WP excerpts and categories, is there a way to modify Snazzy Archives so that it shows the categories instead of the months/date?
SpankMarvin
Member
Posted 3 years ago #

Hi

I'm sure there is more than one way to do this, but maybe try this out:

- Prepare your thumbnail images in PS or whatever.
- Write a few posts as per the next few points:
- In each post go to insert an image, upload the appropriate theumbnail image for the post. Do not insert into the post, but instead, where it gives the url for the image, copy this full location. Close the image upload window
- Go to custom fields at the bottom and (in the first instance) create a new field called front_page_thumb (for this example). In the value, paste in the URL of the image you just uploaded. Update the field.
- Type in an excerpt, or, if you plan to have a different blurb for your front page extract, create another custom field called something like front_page_excerpt and add your content there.
- Finish up writing the post.
- Repeat a few times!
- Open your index.php file, and go to the loop. Beneath the "while" line of the loop (which contains the $wp_query string) add:

<?php $thumbnail = get_post_meta($post->ID, 'front_page_thumb', $single = true); ?>

Next, add something like the following (I'm including some kind of basic markup for containers, which hopefully is self-explanatory):

[SEE CODE BELOW!!]

After that comes any other info for each post you want to include, then the endwhile.

The if statement above says that if your custom field is not blank, i.e. you entered a value, display the image as per the URL value you entered. It'll do this for each post in the loop. You can copy and customise the image thumb for a custom summary in the same way.

Then all you need to do is style your listing accordingly.

Hope this helps

J
SpankMarvin
Member
Posted 3 years ago #

Oh, and my assumption above is that you're modifying index.php because this is a listing on your home page...

J

SpankMarvin
Member
Posted 3 years ago #

Code got fudged in the above. Trying again...

<div class="summary-container">

<?php if($thumbnail !=='') { ?>
<div class="post_thumb"><a href="<?php the_permalink() ?>" rel="bookmark" title="Click here to go to <?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, "front_page_thumb", true);?>" class="front_page_thumb" alt="image for <?php the_title(); ?>" /></a></div>
<?php } ?>

<div class="post_summary"><?php the_content('Read the rest of this entry &raquo;'); ?></div>

</div><!-- end summary container -->

BakingandBooks
Member
Posted 3 years ago #

Thank you for this SpankMarvin! You are so completely awesome.

Two questions:

1. Where would I add the front_page_excerpt to the code above?

2. I don't want this to show up on the front page, but in the category archives. So, for instance, if you clicked on the "Quick Breads" category you would see thumbnails and brief descriptions for all the posts in that category. So would I still add the code to index.php? Or somewhere else?

Thank you for your help!
SpankMarvin
Member
Posted 3 years ago #
Check out the codex for list hierarchies. If you apply this to index.php, it should affect all category listings too, unless you have a custom category.php file. If you don't have this file, WP will look for archive.php, then I believe index.php. You'll need to modify whichever is the relevant file to get your listings how you want them.

If you're using the standard "Excerpt" field in the post editor, I think it should just add that automatically. You could expand the code above to include a custom summary if you'd rather - for listings. So, in addition to the setup for the thumbnail, you'd create one for the other custom field you create:
```
<?php $thumbnail = get_post_meta($post->ID, 'front_page_thumb', $single = true); ?>
<?php $custom_summary = get_post_meta($post->ID, 'front_page_excerpt', $single = true); ?>
```
Then add it to your loop:
```
<div class="summary-container">

<?php if($thumbnail !=='') { ?>
<div class="post_thumb"><a href="<?php the_permalink() ?>" rel="bookmark" title="Click here to go to <?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, "front_page_thumb", true);?>" class="front_page_thumb" alt="image for <?php the_title(); ?>" /></a></div>
<?php } ?>

<div class="post_summary">
<?php if($custom_summary !=='') { ?>
<?php echo get_post_meta($post->ID, "front_page_excerpt", true);?>
<a href="<?php the_permalink() ?>" title="Read full article">Read full article</a>

<?php } ?>

<?php if($custom_summary =='') { ?>
<?php the_content('Read the rest of this entry &raquo;'); ?>
<?php } ?>
</div>

</div>
```
This looks for the thumbnail value. If there is one, it adds the image code accordingly. It then looks for a custom field called front_page_excerpt. For each post, if this value has been entered, it adds that to the front page with link to the main post. Next, if the value for the front_page_excerpt IS blank, it defaults to the standard excerpt, or if all else fails, outputs the main content of the post. You could have put else in up there, but I've run into problems doing that in this instance (probably some bad coding on my part somewhere) and I know this way ought to work.

You can easily apply this to category listings - the format of category.php is the same. Open category.php (or create it by copying and renaming archive.php or index.php) and add the code.

So, after the <?php if (have_posts()) : ?> line, put in your main overall container for all the posts.

After the while line, set up the variables, and add the content for each post.

Make sense?

J

SpankMarvin
Member
Posted 3 years ago #

Tidier version of the above:

<div class="summary-container">

<?php if($thumbnail !=='') { ?>
<div class="post_thumb"><a href="<?php the_permalink() ?>" rel="bookmark" title="Click here to go to <?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, "front_page_thumb", true);?>" class="front_page_thumb" alt="image for <?php the_title(); ?>" /></a></div>
<?php } ?>

<div class="post_summary">
<?php if($custom_summary !=='') {
echo get_post_meta($post->ID, "front_page_excerpt", true);?>
<a href="<?php the_permalink() ?>" title="Read full article">Read full article</a>

<?php }
if($custom_summary =='') {
the_content('Read the rest of this entry &raquo;');
} ?>
</div>

</div><!-- end summary container -->

BakingandBooks
Member
Posted 3 years ago #

You are a genius SpankMarvin! Thank you, thank you!

I created the category.php and implemented the code as you said. It works great, but there is one issue I'm seeing which is - posts are only showing up in 1 category.

For instance, the jelly-filled doughnuts I made last month should be showing up in the Yeasted Breads category and the Desserts category, but it only shows up in yeasted breads. Any idea how to make posts with more than 1 category show up in all the category pages they're assigned to?

BakingandBooks
Member
Posted 3 years ago #

I just noticed another problem - only one thumbnail shows up on any category page. :( There should be 3 on the desserts page already. Any idea how to fix this?

Below is the code I'm using - thank you again!

<?php get_header(); ?>

	<div id="content" class="narrowcolumn">

		<?php if (have_posts()) : ?>

 <?php $post = $posts[0]; // Hack. Set $post so that the_date() works. ?>
<?php /* If this is a category archive */ if (is_category()) { ?>
<h2 class="title">Archive for the '<?php echo single_cat_title(); ?>' Category</h2>

<?php /* If this is a daily archive */ } elseif (is_day()) { ?>
<h2 class="title">Archive for <?php the_time('F jS, Y'); ?></h2>
<?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
<h2 class="title">Archive for <?php the_time('F, Y'); ?></h2>
<?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
<h2 class="title">Archive for <?php the_time('Y'); ?></h2>
<?php /* If this is a search */ } elseif (is_search()) { ?>
<h2 class="title">Search Results</h2>

<?php /* If this is an author archive */ } elseif (is_author()) { ?>
<h2 class="title">Author Archive</h2>

<?php /* If this is a paged archive */ } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
<h2 class="title">Blog Archives</h2>
<?php } ?>

<div align="center">
<?php /* If this is a category archive */ if (is_category()) { ?>
<p>You are currently browsing the archives for the <?php single_cat_title(''); ?> category.</p>
<?php /* If this is a yearly archive */ } elseif (is_day()) { ?>

<?php } ?>
</div>

<!-- start summary container -->
<div class="summary-container">

<?php if($thumbnail !=='') { ?>
<div class="post_thumb"><a href="<?php the_permalink() ?>" rel="bookmark" title="Click here to go to <?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, "front_page_thumb", true);?>" class="front_page_thumb" alt="image for <?php the_title(); ?>" /></a></div>
<?php } ?>

<div class="post_summary"><strong><a href="<?php echo get_permalink() ?>" rel="bookmark" title="Permanent Link: <?php the_title(); ?>"><?php the_title(); ?></a></strong><br /> <?php the_time('F j, Y'); ?>.
<br />
<?php if($custom_summary !=='') {
echo get_post_meta($post->ID, "front_page_excerpt", true);?><br />
<a href="<?php the_permalink() ?>" title="Read the full article"> Read the full article</a>

<?php }
if($custom_summary =='') {
the_content('Read the rest of this entry &raquo;');
} ?>
</div>

</div>
<!-- end summary container -->	

		</div>
	<?php else : ?>
		<h2 class="center">Not Found</h2>
		<?php include (TEMPLATEPATH . '/searchform.php'); ?>

	<?php endif; ?>		</div>
<?php get_footer(); ?>

SpankMarvin
Member
Posted 3 years ago #

I think I see the problem, which might be the cause of both your issues.

Firstly, I see there's an extra closing div tag toward the bottom of your code above. since I don't know what div tags you've started in your header, this might be correct, but you have a LOT of validation errors, and this could be one of the causes of that. My guess is that taking out the </div> beneath the end summary container comment might help.

Re your one-post-only problems -- your loop appears to be loopless!! You need a "while" in there for the loop to, err, loop through the posts. You also need to set up the thumbnail and custom_summary variables prior to their usage. Though this might not be giving you issues now, it will do in the future.

Here is a suggested amended version of your code above. Not the addition of an opening "while" loop and its closure after the summary container. This means that each post will appear in its own summary container, and all of these containers will be inside the main content div. Directly after opening the "while" statement, create the two variables prior to their use. The code below has also removed what appears to be the stray closing div tag beneath the summary container. I believe that to be the correct thing to do, unless I'm missing something

[DURRRRR, CODE BELOW AGAIN. SORRY.]

I would strongly recommend validating this page on w3c validator service. When I looked there were 340 errors. Removing the stray closing tag might help some, but you might need to go through each of the errors and recheck each time. Many of them are probably knock-on errors created by the odd stray bit of code gone bad.

Let me know how you get on with this.

J

SpankMarvin
Member
Posted 3 years ago #

Not sure how I keep messing up the code formatting. Try again:

<?php get_header(); ?>

<div id="content" class="narrowcolumn">

<?php if (have_posts()) : ?>

<?php $post = $posts[0]; // Hack. Set $post so that the_date() works. ?>
<?php /* If this is a category archive */ if (is_category()) { ?>
<h2 class="title">Archive for the '<?php echo single_cat_title(); ?>' Category</h2>

<?php /* If this is a daily archive */ } elseif (is_day()) { ?>
<h2 class="title">Archive for <?php the_time('F jS, Y'); ?></h2>
<?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
<h2 class="title">Archive for <?php the_time('F, Y'); ?></h2>
<?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
<h2 class="title">Archive for <?php the_time('Y'); ?></h2>
<?php /* If this is a search */ } elseif (is_search()) { ?>
<h2 class="title">Search Results</h2>

<?php /* If this is an author archive */ } elseif (is_author()) { ?>
<h2 class="title">Author Archive</h2>

<?php /* If this is a paged archive */ } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
<h2 class="title">Blog Archives</h2>
<?php } ?>

<div align="center">
<?php /* If this is a category archive */ if (is_category()) { ?>
<p>You are currently browsing the archives for the <?php single_cat_title(''); ?> category.</p>
<?php /* If this is a yearly archive */ } elseif (is_day()) { ?>

<?php } ?>
</div>

<!-- start summary container -->
<div class="summary-container">
<?php while (have_posts()) : the_post(); ?>
<?php $thumbnail = get_post_meta($post->ID, 'thumbnail', $single = true); ?>
<?php $custom_summary = get_post_meta($post->ID, 'front_page_excerpt', $single = true); ?>
<?php if($thumbnail !=='') { ?>
<div class="post_thumb">" rel="bookmark" title="Click here to go to <?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, "front_page_thumb", true);?>" class="front_page_thumb" alt="image for <?php the_title(); ?>" /></div>
<?php } ?>

<div class="post_summary">" rel="bookmark" title="Permanent Link: <?php the_title(); ?>"><?php the_title(); ?>
<?php the_time('F j, Y'); ?>.

<?php if($custom_summary !=='') {
echo get_post_meta($post->ID, "front_page_excerpt", true);?>
" title="Read the full article"> Read the full article

<?php }
if($custom_summary =='') {
the_content('Read the rest of this entry »');
} ?>
</div>

</div>
<!-- end summary container -->
<?php endwhile; ?>

<?php else : ?>
<h2 class="center">Not Found</h2>
<?php include (TEMPLATEPATH . '/searchform.php'); ?>

<?php endif; ?> </div>
<?php get_footer(); ?>

BakingandBooks
Member
Posted 3 years ago #

Thank you for getting back to me again SpankMarvin! I wasn't aware there are so many validation errors on my site.... will have to go through them and see if I can fix whatever is causing them.

As for the code, I implemented the changes you suggested and now all the thumbnails are showing up - but so are the full posts. You can see an example of this on the Fruits page.

Also, how do I set it so all the posts in the category appear? I assume that only 2 appear because I have the "Reading" setting in WP-admin set to 2 posts for the front page. But in the category archives I want all the posts to appear.

Thank you again! I am going to add your name/link to the credits on my sidebar if that's ok with you?
BakingandBooks
Member
Posted 3 years ago #

It looks like most of the errors are coming from the table tags - I built my template using a table instead of a CSS layout, because that's what I was able to do on my own. (Sad, I know.) It's marking nearly all the closing TD tags as errors, but there's no way for me to change them in the code without breaking the entire site...
BakingandBooks
Member
Posted 3 years ago #

I copied and pasted your code just now (previously I had just added the loop) and now none of the thumbnails appear. It's just text like this (Desserts Archive):

" rel="bookmark" title="Permanent Link: Chocolate Toffee Cookies with Toasted Pecans">Chocolate Toffee Cookies with Toasted PecansDecember 31, 2008. Chocolate and toffee are irresistible on their own, but if you put them together? Whoo whee! Trust me. You need to make these cookies." title="Read the full article"> Read the full article
" rel="bookmark" title="Permanent Link: Blueberry & Raspberry Jelly Doughnuts for a Happy Chanukah">Blueberry & Raspberry Jelly Doughnuts for a Happy ChanukahDecember 22, 2008. Sufganiyot are ball-shaped doughnuts that are first fried, then pierced and injected with jelly and sprinkled with powdered sugar. This post also has a recipe for hot chocolate." title="Read the full article"> Read the full article

In other words, instead of showing the thumbnails & excerpts, it just wrote out the titles and some of the code.

SpankMarvin
Member
Posted 3 years ago #

I think there's something messed up in the code as I pasted it in. Let me try again. Looks like the summary code got fudged. Annoying, can't work out what I'm doing wrong when I make it code in this editor...

Right, here goes -- hopefully this should sort out your summary issues:

<?php get_header(); ?>

	<div id="content" class="narrowcolumn">

		<?php if (have_posts()) : ?>

 <?php $post = $posts[0]; // Hack. Set $post so that the_date() works. ?>
<?php /* If this is a category archive */ if (is_category()) { ?>
<h2 class="title">Archive for the '<?php echo single_cat_title(); ?>' Category</h2>

<?php /* If this is a daily archive */ } elseif (is_day()) { ?>
<h2 class="title">Archive for <?php the_time('F jS, Y'); ?></h2>
<?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
<h2 class="title">Archive for <?php the_time('F, Y'); ?></h2>
<?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
<h2 class="title">Archive for <?php the_time('Y'); ?></h2>
<?php /* If this is a search */ } elseif (is_search()) { ?>
<h2 class="title">Search Results</h2>

<?php /* If this is an author archive */ } elseif (is_author()) { ?>
<h2 class="title">Author Archive</h2>

<?php /* If this is a paged archive */ } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
<h2 class="title">Blog Archives</h2>
<?php } ?>

<div align="center">
<?php /* If this is a category archive */ if (is_category()) { ?>
You are currently browsing the archives for the <?php single_cat_title(''); ?> category.

<?php /* If this is a yearly archive */ } elseif (is_day()) { ?>

<?php } ?>
</div>

<!-- start summary container -->
<div class="summary-container">
<?php while (have_posts()) : the_post(); ?>
<?php $thumbnail = get_post_meta($post->ID, 'front_page_thumb', $single = true); ?>
<?php $custom_summary = get_post_meta($post->ID, 'front_page_excerpt', $single = true); ?>

<?php if($thumbnail !=='') { ?>
<div class="thumbnail_main_link"><a href="<?php the_permalink() ?>" rel="bookmark" title="Click here to go to <?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, "front_page_thumb", true);?>" class="front_page_thumb" alt="image for <?php the_title(); ?>" /></a></div>
<?php } ?>

<div class="post_summary"><strong><a href="<?php echo get_permalink() ?>" rel="bookmark" title="Permanent Link: <?php the_title(); ?>"><?php the_title(); ?></a></strong> <?php the_time('F j, Y'); ?>.

<?php if($custom_summary !=='') {
echo get_post_meta($post->ID, "front_page_excerpt", true);?>
<a href="<?php the_permalink() ?>" title="Read the full article"> Read the full article</a>

<?php }
if($custom_summary =='') {
the_content('Read the rest of this entry &raquo;');
} ?>
</div>

</div><!-- end summary container -->	

<?php endwhile; ?>
<?php else : ?>
		<h2 class="center">Not Found</h2>
		<?php include (TEMPLATEPATH . '/searchform.php'); ?>

	<?php endif; ?>		</div>
<?php get_footer(); ?>

SpankMarvin
Member
Posted 3 years ago #

I think I know how to sort your other issue, but let's first see whether the new code I put in works for you? then we can back it up and work on the numbering...!

J
BakingandBooks
Member
Posted 3 years ago #

That did it! Thank you so much!

The only question now is: how do I get all the posts in one category to show up in the category archive, but only 2 posts on the front page?
SpankMarvin
Member
Posted 3 years ago #
Yay! Glad that's worked! I'd recommend backing up the category.php file now!!!

Right, the other issue. You could use the query_posts feature, but a more robust way of doing this (to guarantee no conflicts with any other loops on the page, if there are any) is to make the category listing into a custom loop.

Before your if(have_posts) line, insert the following:
```
<?php $thiscategory = get_query_var('cat');  /* gets the current category number, for entry into the query below */
$temp = $wp_query;
$wp_query= null;
$wp_query = new WP_Query('cat=' . $thiscategory . '&showposts=-1'; ?>
```
Now REPLACE the while(have_posts) line to the following:

<?php while ($wp_query->have_posts()) : $wp_query->the_post(); ?>

Finally, before the endif line, add the following to reset the variable:

<?php $wp_query = null; $wp_query = $temp;?>

This creates a custom loop by getting the current category number, creating a WP_Query for the loop for the category. the showposts value can be any number you want. -1 means show all posts ;)

I BELIEVE you can use the same parameters as for query_posts in the WP_Query function. Not 100% sure about that though.
http://codex.wordpress.org/Template_Tags/query_posts

Oh, and any linkage is great, thank you...! I don't know whether my profile has my URL on there, but I'll add it now.

Let me know how you get on with the above!

J

BakingandBooks
Member
Posted 3 years ago #

Saved it! I am so completely thrilled.

As for getting all the posts to show up, I made the changes you suggested but am getting this error on the category pages now:

Parse error: syntax error, unexpected ';' in /home/baking5/public_html/wp-content/themes/Dec08/category.php on line 8

Here is the code I'm using:

<?php get_header(); ?>

	<div id="content" class="narrowcolumn">

<?php $thiscategory = get_query_var('cat');  /* gets the current category number, for entry into the query below */
$temp = $wp_query;
$wp_query= null;
$wp_query = new WP_Query('cat=' . $thiscategory . '&showposts=-1'; ?>

		<?php if (have_posts()) : ?>

 <?php $post = $posts[0]; // Hack. Set $post so that the_date() works. ?>
<?php /* If this is a category archive */ if (is_category()) { ?>
<h2 class="title">Archive for the '<?php echo single_cat_title(); ?>' Category</h2>

<?php /* If this is a daily archive */ } elseif (is_day()) { ?>
<h2 class="title">Archive for <?php the_time('F jS, Y'); ?></h2>
<?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
<h2 class="title">Archive for <?php the_time('F, Y'); ?></h2>
<?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
<h2 class="title">Archive for <?php the_time('Y'); ?></h2>
<?php /* If this is a search */ } elseif (is_search()) { ?>
<h2 class="title">Search Results</h2>

<?php /* If this is an author archive */ } elseif (is_author()) { ?>
<h2 class="title">Author Archive</h2>

<?php /* If this is a paged archive */ } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
<h2 class="title">Blog Archives</h2>
<?php } ?>

<div align="center">
<?php /* If this is a category archive */ if (is_category()) { ?>
You are currently browsing the archives for the <?php single_cat_title(''); ?> category.

<?php /* If this is a yearly archive */ } elseif (is_day()) { ?>

<?php } ?>
</div>

<br /><br /><strong>The category archives are currently under construction.</strong> If you are looking for a recipe please use the <a href="http://www.bakingandbooks.com/all-the-recipes/">Recipe Index</a>. Thanks! :)<br /><br />

<!-- start summary container -->
<div class="summary-container">

<<?php while ($wp_query->have_posts()) : $wp_query->the_post(); ?>

<?php $thumbnail = get_post_meta($post->ID, 'front_page_thumb', $single = true); ?>
<?php $custom_summary = get_post_meta($post->ID, 'front_page_excerpt', $single = true); ?>

<?php if($thumbnail !=='') { ?>
<div class="post_thumb"><a href="<?php the_permalink() ?>" rel="bookmark" title="Click here to go to <?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, "front_page_thumb", true);?>" class="front_page_thumb" alt="image for <?php the_title(); ?>" /></a></div>
<?php } ?>

<div class="post_summary"><strong><a href="<?php echo get_permalink() ?>" rel="bookmark" title="Permanent Link: <?php the_title(); ?>"><?php the_title(); ?></a></strong><br /> <?php the_time('F j, Y'); ?>.
<br />
<?php if($custom_summary !=='') {
echo get_post_meta($post->ID, "front_page_excerpt", true);?>
<a href="<?php the_permalink() ?>" title="Read the full article"> Read the full article</a>

<?php }
if($custom_summary =='') {
the_content('Read the rest of this entry &raquo;');
} ?>
</div>

</div><!-- end summary container -->	

<?php endwhile; ?>
<?php else : ?>
		<h2 class="center">Not Found</h2>
		<?php include (TEMPLATEPATH . '/searchform.php'); ?>

<?php $wp_query = null; $wp_query = $temp;?>
	<?php endif; ?>		</div>
<?php get_footer(); ?>

SpankMarvin
Member
Posted 3 years ago #

Right at the top, the code seems to have gone from being on several lines to being on one (at line 5). Where it says:

$temp = $wp_query;$wp_query= null;

Try adding a space after the first semi-colon? Or hit return after each semi-colon on that line to return these to individual lines.

EDIT: Oh, hang on. You seem to have done that now. Let me take another look.
BakingandBooks
Member
Posted 3 years ago #
I actually changed that bit super quick after I posted (thinking maybe that was the issue) but you read the post before I could save the changes. Sorry! My bad.

I double checked that top bit of code, it looks like this now but is still returning the error on line 8.
```
<?php $thiscategory = get_query_var('cat');  /* gets the current category number, for entry into the query below */
$temp = $wp_query;
$wp_query= null;
$wp_query = new WP_Query('cat=' . $thiscategory . '&showposts=-1'; ?>
```
SpankMarvin
Member
Posted 3 years ago #

My mistake. I missed off a closing bracket. Line 8 should read:

$wp_query = new WP_Query('cat=' . $thiscategory . '&showposts=-1'); ?>
BakingandBooks
Member
Posted 3 years ago #
I think we're almost there. I added the closing bracket, and now the first 2 posts display correctly and all the other ones in the category overlap each other... including the other posts with the post thumb & excerpt already. See what I mean here.

This is the CSS I'm using - it seems to format the first 2 posts correctly, but then any post that come afterwards aren't spaced properly.
```
.post_thumb {float: left; clear: right;  border: 3px double #FFFFFF; margin-left: 4px; margin-right: 4px; margin-bottom: 1px; }

.post_summary {text-align:left; margin-top: 5px; height: 85px;}
```
SpankMarvin
Member
Posted 3 years ago #

Perhaps another bad one by me. Could you try cutting the summary container div line (the opening one), and pasting it AFTER the "while" line?
BakingandBooks
Member
Posted 3 years ago #
Sorry, I'm a little confused - there are so many changes we've made I'm not sure which piece of code I should move after the <?php while ($wp_query->have_posts()) : $wp_query->the_post(); ?> line?

Do you mean move this one to after the while line above?
```
<?php $thiscategory = get_query_var('cat');  /* gets the current category number, for entry into the query below */
$temp = $wp_query;
$wp_query= null;
$wp_query = new WP_Query('cat=' . $thiscategory . '&showposts=-1'); ?>
```

SpankMarvin
Member
Posted 3 years ago #

No -- try changing the opening div in the following lines (this is what you currently have:

<strong>The category archives are currently under construction.</strong> If you are looking for a recipe please use the <a href="http://www.bakingandbooks.com/all-the-recipes/">Recipe Index</a>. Thanks! :)

<!-- start summary container -->
<div class="summary-container">

<<?php while ($wp_query->have_posts()) : $wp_query->the_post(); ?>

<?php $thumbnail = get_post_meta($post->ID, 'front_page_thumb', $single = true); ?>
<?php $custom_summary = get_post_meta($post->ID, 'front_page_excerpt', $single = true); ?>

to the following (div class="summary_container" has moved below the while part):

<strong>The category archives are currently under construction.</strong> If you are looking for a recipe please use the <a href="http://www.bakingandbooks.com/all-the-recipes/">Recipe Index</a>. Thanks! :)

<?php while ($wp_query->have_posts()) : $wp_query->the_post(); ?>

<!-- start summary container -->
<div class="summary-container">

<?php $thumbnail = get_post_meta($post->ID, 'front_page_thumb', $single = true); ?>
<?php $custom_summary = get_post_meta($post->ID, 'front_page_excerpt', $single = true); ?>

For some reason, there was also some rogue open bracket on the while line (see the first code snippet). I've taken this out of the corrected lines just above. Hopefully if you paste in the second snippet of code where the first one was, it should work, fingers crossed.

BakingandBooks
Member
Posted 3 years ago #

That did it!! *does a happy dance*

Check it out: Desserts Archive

Now I just need to finish making all the thumbnails. :)

Thank you for your help!! I added your name to the credits section in the lefthand sidebar and am going to mention you in my next post too. You rock!

Not sure what to do about all those errors that show up when my site is validated, but I don't want to take up more of your time. You've been more than generous already.
SpankMarvin
Member
Posted 3 years ago #
You've still got a slight issue with your CSS (scroll down your example page and see the overlap). Add the following:
```
.summary_container {
	width: 500px;
	display: block;
	clear: both;
	overflow: visible;
}
```
and REMOVE the height property from your .post_summary class. this should correct the layout issues...!

Glad I could help. Thanks so much for the mention. If you fancy adding a proper link, my website (launching next week) is http://itchaway.net ;)

In producing my own site, I frequented these forums and learned so much. It's nice to be able to pass on the karma!!!

John
BakingandBooks
Member
Posted 3 years ago #

I updated your name and link. :)

I fixed the CSS but if I take the height part out of the post_summary class then the thumbnails don't align. See what I mean.

But I think the issue of overlapping posts will be resolved despite the height parameter once I finish making all the thumbnails right?

This forum is incredible. Do you have any sites you'd recommend I read for fixing the validation errors?

12 Next »

Topic Closed

This topic has been closed to new replies.

WordPress.org

Forums

How to create category archives like 101 Cookbooks? (34 posts)

Topic Closed

About this Topic

Tags

Code is Poetry