FYI – How to make a catalogue grid for products using WordPress as a CMS

Step 1) Each of your products will be entered as a post in your WordPress site. Organize the products into their categories.

Step 2) You can upload the image of each product with the post. The text of the post should be the product’s description, the title should be the name of the product. In custom fields you can also add price, size, weight, etc.

Step 3) Upload and activate the post_image plugin

Step 4) Use the code below on the template of your category page (in yourdomain.com/wp-content/themes/yourtheme/category.php).

In the “content” div of your category page, you can display a grid of your products with the post_image (image of the product), and custom fields like the price.

When people visit your site, you can show them your categories as a menu, each of which will lead to its own category page, which will have a grid of products (posts you made) with their images. These product images would link to individual product pages which you would set up using the single.php template. You would further set up the single templates with a shopping cart system / script.

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

 <ul style="list-style-type: none; width: 100%; ">
   <?php
$posts = get_posts('numberposts=6&offset=0');
foreach($posts as $post) :
setup_postdata($post);
?>
  <li style="float: left; margin: 10px; padding: 5px; width: 23%; border: 1px solid #eeeeee;">

use the post_image or any other function here to
call data from the post or the custom information  

<?php endforeach;

 ?>
    <?php
 else: ?>

 <?php endif; ?>

Please let me know if this works for you 🙂