Grow your CSS skills. Land your dream job.

How to integrate WooCommerce plugin into existing WordPress theme.

  • # May 14, 2013 at 5:57 pm

    Hi guys

    I have built my own wordpress theme for a client, and would now like to integrate WooCommerce for the shopping cart.

    I was planning on using a wootheme for the cart, then customising it to match my current theme, however you cannot have two themes on wordpress. For some reason, I thought you were able to specify an individual theme for the shop, I know realise this is not the case, and also not logical anyway.

    My options seem to be this…

    1) Build the whole cart from scratch into my current theme (which seems quite daunting, not sure how easy this will be)

    2) Use a woocommerce theme, back up my current one, then start going into the new theme and changing it to match my backed-up theme.

    3) Any other way?

    Would love to hear some advice from someone that has worked with WooCommerce, and what the easiest way of integrating the plugin to an existing site would be.

    Thanks in advance.

    # May 14, 2013 at 6:16 pm

    a tutorial on [youtube](http://youtu.be/2_oQo6C6Yxo) you wont need the first half thats for people really new to making websites.

    it has everything you need and is actually quite detailed

    # May 14, 2013 at 6:33 pm

    Thanks for that.

    Yes very detailed but it’s more focused on actually setting up the shop as opposed to the actual development side of things. Plus he is using a WooTheme that supports WooCommerce. My question was how to use WooCommerce on an existing theme.

    # May 14, 2013 at 6:50 pm

    Sorry.
    Option 2 sounds like the best idea in that case.
    There is a plugin called [Page Theme](http://wordpress.org/extend/plugins/page-theme/) but couldn’t say if it’s any use to you.

    # May 14, 2013 at 7:26 pm

    You could just have another WordPress folder, and use the theme. You could possibly do a separate prefix for the second one, but not sure how this would work using the same database. When I have time I need to try this for my sister’s site.

    # May 14, 2013 at 7:35 pm

    After you install the plugin, you can just add a page called woocommerce.php to your wordpress theme and go from there, with the basic woocommerce css, or tell it not the load the css at all and start from scratch.. That’s the reason I love woocommerce so much, it drops right into your existing wordpress theme without a whole lot of hassel. There are docs on the woocommerce site on how to do the above, I can grab the links later if you are having trouble finding them.

    # May 14, 2013 at 8:01 pm

    You don’t need to add any page manually, when you add the plugin the required pages are created for you, it doesn’t take any extra work to add to any theme unless there’s some problem with the theme.

    # May 15, 2013 at 6:01 pm

    @unasAquila that is an interesting plugin which I may consider.

    @FragaGeddon I heard about this technique, but the example I saw the guy was using two separate wordpress sites (2 databases). This is not really a viable solution for me or my client I’m afraid.

    @will_wallace85 I believe you may be referring to this [link](http://docs.woothemes.com/document/third-party-custom-theme-compatibility/ “link”)

    According to this, calling the woocommerce.php function doesn’t allow for using different templates. To be honest, I am not sure if this is a good or bad thing at this stage, as I may like the whole eCommerce side of the website to share the same template.

    I tried the hook functions in the link, which seem to work but I am not sure which page to edit for the shop index. Would I still need to create a woocommerce.php file, thats what I am unclear on.

    @deeve007 yes this is true but it still needs to be styled and integrated into my theme.

    # May 15, 2013 at 6:02 pm

    It shouldn’t really need much styling outside of some button colours. I’d be interested to see what you’re having an issue with style-wise.

    # May 16, 2013 at 5:36 pm

    @deeve007 it is more for me having control of certain elements.

    For example, with a blog, I can control how the blog is displayed, whether I display recent posts, archives, tags, etc all with php. I want to know which files I will have to edit to have this control for the shop.

    I also seem to be having another problem with the default layout. When I click on ‘add to cart’ for a test product, and then click on ‘view cart’, it displays a blank page, which is strange as the cart page is calling the correct short code. I will possibly download a woocommerce theme just to see how the structure is laid out.

    # May 16, 2013 at 6:44 pm

    Well again, this is not difficult, you simply edit the Woocommerce theme files after moving them into your main theme folder as it outlines in the Woocommerce help files. Is that any different to how you’d do it with a “woocommerce theme”?

    http://docs.woothemes.com/document/template-structure/

    # May 17, 2013 at 3:34 pm

    Yes!!! Thanks @deeve007 that is exactly what I was after.

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.

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