Grow your CSS skills. Land your dream job.

#56: Integrating FoxyCart and WordPress

FoxyCart is a very adaptable eCommerce system. Products are built on-the-fly as part of add to cart buttons that are just simple HTML. This means that you can integrate it with just about any CMS. In this screencast, we integrate it with WordPress. We make a special page template just for products. This page template loads the necessary FoxyCart files and automatically has an add to cart button that is controlled with custom fields in WordPress.

Links from Video:

Comments

  1. Matt
    Permalink to comment#

    Why of course! WordPress is my favourite programming language, next to Movable Type and Joomla!.

    Enough joking around, thanks for the helpful tutorial. I also enjoyed your calculator tut on tuts+.

  2. thanks for the helpful tutorial.

  3. kyle
    Permalink to comment#

    Thanks for the addendum – I’d run into the Foxycart not caching wordpress problem, so I’ll have to try the hash trick next time I make some changes. Incidentally, i’d gotten around it by putting the ^^checkout^^ stuff on the home page (temporarily), as that seemed to work.

  4. Brian
    Permalink to comment#

    Thanks for covering this Chris!

  5. Antti
    Permalink to comment#

    Hi Chris,

    Just a quick slightly off-topic question about the WordPress custom fields; is there any user-friendly way to add images as custom field values (instead of typing )?

    As I’d like to create such an option to the blog of my wife, and she’s not too much into HTML :)

    Best regards,
    Antti

  6. talon
    Permalink to comment#

    hey Chris,

    excellent tutorial. eerie timing too, got something cooking that this definitely helped with!

    got a question about how you copied the WP generated html and uploaded it. does the new checkout page then become static and independent of any global changes you make it WP i.e. changing the header section or navigation?

    you rock,
    Talon

  7. thank you so much chris. this is exactly what i was looking for. now i can sleep. lol

  8. What a great Tutorial, can’t wait to get started on my fishing lure site project.

  9. David Jones
    Permalink to comment#

    Just thought you might like to know there is an error in the Code Samples / Written Tutorial link.

  10. todd valentine
    Permalink to comment#

    Thanks again, Chris. I really enjoy your blog and screen casts!

  11. Good stuff! Thanks Chris.

  12. Chris. I’m stoked you got a chance to do a tut on this. Its an easy e-commerce solution even I can understand. Great video!

  13. Maybe I missed it but if I wanted to create a page that users could see all the current products, then link to a product page for more info like you have set up. Would I want a ul in the content section..or would I want a custom field for each product? Looking for the easiest to manage after set up. Or should I use a foreach in the page template to get that info? Any help would be great.

  14. Hey guys, any ideas on an inventory system using Wordress and Foxycart? I can’t think of any way to work it myself…

  15. Jana
    Permalink to comment#

    Is FoxyCart also mobile friendly? Thanks for the video!

  16. Bijoy

    Nice Video and thanks!!!
    Is Foxy cart is mobile friendly?
    I am creating the mobile version fo the current live site which used the Foxycart.

Leave a Comment

Posting Code

Markdown is supported in the comment area, so you can write inline code in backticks like `this` or multiline blocks of code in in triple backtick fences like this:

```
<div>Example code</div>
```

You don't need to escape code in backticks, Markdown does that for you. If anything screws up, contact us and we can fix it up for you.

*May or may not contain any actual "CSS" or "Tricks".