Greetings User! We have had users let us know that the single product view while using Thesis was hard to modify and style to match the rest of their site, so we did some research and came up with the following steps.  These steps are what we’ve found to be the best way to use FoxyPress with Thesis. Should you have a better way, or want to contribute what you’ve done, please feel free to contact us or post a comment. We hope this helps all you FP/Thesis users out!

These steps don’t really need to happen in any particular order, as they should all be done before you refresh your single product view, but here is what I felt was the best way to approach it.

1. Create a file called product_template_functions.php.  This file is going to be very similar to the single FoxyPress product file you can find in our tutorial on Custom Product Templates. This file will be called when a single product is viewed. We can either use the detail shortcode in this file, or the API, more details here. I have the shortcode function commented out in this view, but you might want to use that to start.  Should you choose to use the detail shortcode, simply use that method of styling found here.

   <?php
   	function custom_content() {
   		global $post;
   	
   		if (have_posts()) :	the_post();
   			/*echo(foxypress_handle_shortcode_detail(true, true, $post->ID));*/
   			$product = foxypress_GetProduct($post->ID); 
   			echo('<h2>' . $product['name'] . '</h2>');
   		endif;
   	}
   	remove_action('thesis_hook_after_content', 'thesis_prev_next_posts');
   	add_action('thesis_hook_before_content','custom_content');
   	thesis_html_framework();
   ?>

2. Specify the use of the product_template_functions.php file in the wp-config.php file, much like we do for regular WordPress themes.

   define('FOXYPRESS_PRODUCT_TEMPLATE_PATH', dirname(__FILE__) . '/wp-content/themes/yourthemename/single-foxypress_product.php');

3.  Add a new function/hook to the custom_functions.php file in your custom folder. It will tell allow us to use Thesis hooks in our product_template_functions.php file.

   // Custom Page Template
   function custom_productpage() {
   		include (TEMPLATEPATH . '/custom/product_template_functions.php');
   }
   add_action('thesis_hook_custom_template', 'custom_productpage');

This should allow your thesis theme to be wrapped around the product as you would expect. Thanks for using FoxyPress!

Today I wanted to give some insight to product add-ons or upselling, whatever you’d like to call it.  We’ve done it two ways for clients thus far, so I thought I’d share these two approaches with you.

Approach #1: Embedding the products in your cart template

You can create a page that will be the template for your  FoxyCart cart template and cache it with the new FoxyCart/FoxyPress functionality that was released in 0.7.2.  We can also embed products into this template so you can add them to cart.  These are the steps for doing so:

1. Create a page for your cart template.  Place the following code into it. Note, you could use another FoxyPress shortcode here to meet your needs.

^^cart^^
<h2>Add Ons</h2>
&#91;foxypress id='129' mode='single'&#93;FoxyPress&#91;/foxypress&#93;

2. You will then want to make any styling additions to the page using this guide.

3. Now you will want to cache your template by going to Templates in the FoxyPress menu.  Click on Cart Template, enter the URL you made for the page, then click cache your template.

If all goes well with no errors in your caching, you will then be able to add a product to your cart on your website and view the additional product(s) you’ve cached!

Approach #2: Creating a separate page for the products.

The Nerd Machine approached us for a solution to have additional add on products for their cart.  Their needs were semi-unique in that they only wanted customers to add a sticker if they had purchased other items.  There were several different pieces of code involved here.  Let’s start from the beginning.

1. Create a new page in WordPress that will hold your products http://www.thenerdmachine.com/add-ons/

We had to lock down the items so that you could not add them to cart if your cart was empty.  There are two places you need to do this, one is on the add-ons page itself, and then also in the cart template.

For Page:

<script type="text/javascript">
		$(document).ready(function(){
			jQuery.getJSON('https://thenerdmachine.foxycart.com/cart?'+fcc.session_get()+'&output=json&callback=?', function(cart) {
				if (cart.products.length == 0) {
					$(".foxypress_item_submit_wrapper_nodetail").html("In order to add to cart, you must purchase other items. <a href='http://www.thenerdmachine.com/products/'>Get Some!</a>");
				}
			});
		});
	</script>

For Cart Template:

<script>
$(document).ready(function() 
{

	//check for stickers
	var stickerproductcount = 0;
	for (var i=0; i<fc_json.products.length; i++) 
	{
		if(fc_json.products[i].name.indexOf("Sticker") >= 0)
		{
			stickerproductcount++;	
		}
	}
	

	//if we only have stickers, we need to delete them
	if(stickerproductcount == fc_json.products.length && stickerproductcount > 0)
	{
		fc_PreventCheckout();
		for (var i=0; i<fc_json.products.length; i++) 
		{
			var NewQuantity = 0;
			var Parent = jQuery("input[value='" + fc_json.products[i].id + "']").parent("td").next("td.fc_cart_item_quantity");	
			jQuery(Parent).children("input").val(NewQuantity);
		}
		fc_UpdateCart();
	}
	
});
</script>

2. Add code to your cart template to let FoxyCart know you want to direct the user to the add-ons page if they are not on that page.  This way they can eventually get to checkout and will only see the add-ons page once.

<script>
$(document).ready(function() 
{
	var cur_pathname = document.referrer;
	if (cur_pathname != 'http://www.thenerdmachine.com/add-ons/') {
	  $('.fc_cart_checkout').attr('href', 'http://www.thenerdmachine.com/add-ons/');
	}
	
});
</script>

That wraps up this tutorial. Feel free to comment and let us know if it was helpful to you. Thanks for using FoxyPress! Don’t forget to stop by Nerd Machine and grab some nerd stuff!

We now have a demo store available to you to log-in to and play around with all the functionality that FoxyPress offers.  We ask that you be respectful of this open access we’ve provided and want to make you aware that this environment refreshes throughout the day to make sure everything is up and running the way it started, so don’t be alarmed if your changes are reverted after some time.  We want to make this available to you as a temporary sandbox and an example of how we’ve setup the store.

Things to consider/checkout while using the demo store…

Login credentials: http://demo.foxy-press.com/wp-admin demo / demo

We have set this up as a multi-site environment with multiple test orders that consist of regular products, as well as subscriptions.  We would strongly suggest checking out the differences in Subscription Management and Order Management between the Main site and the sub site installs.  You can see how you would manage your orders differently and be able to see all the orders on your site network.

Feel free to purchase some items.  All of the products are simply placeholders and nothing is “for sale”.  We do not store any credit card information, so we’d suggest using a test number from thiswebsite. You can then sync up the orders and see how they come through.

We’ve also added two affiliates so you can see how affiliate management works.  We are currently upgrading the functionality of the affiliate management to work better with Multi-Sites, so please stay tuned.

This is an open install and we’ve added many other plug-ins that we find incredibly useful in conjunction with FoxyPress and WordPress in general.  Please feel free to check them all out and support our friends who built the plug-ins as well.  Here is a list of some of them.

I’ve also added this information to the Getting Started page so that as this post gets buried, you are still aware of where to easily find the information.