Theme Integration Guide

For the most part, eCommerce Product Catalog templates will integrate nicely with most WordPress themes. You may run into problems when the default eCommerce Product Catalog content wrappers do not match your chosen themes. This will manifest itself by breaking your layout on eCommerce Product Catalog pages and shifting your sidebars into incorrect positions.

This problem can potentially affect the product catalog page, the single product page and the category pages because eCommerce Product Catalog uses templates of its own to display these pages (and its impossible for eCommerce Product Catalog to know exactly what markup your theme uses).

Probably everything is just fine…

After plugin activation, run the theme integration wizard and check the example page for issues. If everything is ok, dismiss the theme integration message in the admin and use the eCommerce Product Catalog without problems.

If you see any problems on the example product page, there are currently two simple ways to resolve this:

  1. Using our catch-all content_product_adder() function inside your theme.
  2. Using shortcode integration

Using content_product_adder()

This method allows you to resolve the problem faster by really simple steps:

1. Login to your FTP server and find your website theme folder

If you don’t know how to login to your FTP use shortcode integration instead.

2. Duplicate your page.php (or any other theme template file)

page.php is inside your theme folder. Just duplicate it and name it product-adder.php. You will edit only this new file so it is impossible to break anything on the website. Only eCommerce Product Catalog will use it. If you are using a child theme the product-adder.php should be placed in child theme folder.

3. Edit product-adder.php

Open newly created file (product-adder.php) and find the loop (see The_Loop). The loop usually starts with a:

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

OR 

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

AND ends with:

<?php endif; ?>

OR 

<?php endwhile; ?>

This varies between themes. Full loop example:

<?php
		// Start the loop.
		while ( have_posts() ) : the_post();

			// Include the page content template.
			get_template_part( 'content', 'page' );

			// If comments are open or we have at least one comment, load up the comment template.
			if ( comments_open() || get_comments_number() ) :
				comments_template();
			endif;

		// End the loop.
		endwhile;
?>

Once you have found it, delete it. In its place put:

<?php content_product_adder(); ?>

This will make it use eCommerce Product Catalog loop instead. Save the file. You’re done.

Now your theme is properly integrated with eCommerce Product Catalog. The integration info will be disabled automatically and will not show up until the product-adder file exists.

If you want to update your theme in the feature we recommend creating a child theme and put the product-adder.php file to the child theme folder. This way you will be able to update the theme without loosing the eCommerce Product Catalog integration.

Using shortcode

You can create your product listing pages using [show_products] shortcode. The best result with such approach will be with the simple mode enabled.

  1. Create your main product listing by putting [show_products] in the selected page content.
  2. Create your category pages using category attribute with [show_products] shortcode e.g. [show_products category="1"]

For more information about shortcode usage please see product shortcode docs.