{"id":2507,"date":"2012-10-16T17:21:55","date_gmt":"2012-10-16T16:21:55","guid":{"rendered":"http:\/\/www.simonbattersby.com\/blog\/?page_id=2507"},"modified":"2012-10-23T09:20:34","modified_gmt":"2012-10-23T08:20:34","slug":"opencart-use-different-modules-on-multiple-stores","status":"publish","type":"page","link":"https:\/\/www.simonbattersby.com\/blog\/opencart-use-different-modules-on-multiple-stores\/","title":{"rendered":"Opencart – Use different modules on multiple stores"},"content":{"rendered":"

If you have multiple stores on one Opencart installation<\/a>, it’s quite likely you might want to display different versions of the same module on your different stores. I first came across this issue when developing a mobile theme, designed to be used alongside a ‘standard’ theme suitable for desktops. While most modules transfer fairly easily across from one theme to another, one that doesn’t is Banner, and Slideshow is much the same. On my standard site I want a nice wide banner to take up the whole width of the home page, but if this is transferred directly to the mobile theme, designed to have an entirely fluid width to fit a screen down to 320px wide, it won’t fit. This could perhaps be overcome with css, but the Slideshow module creates an inline style setting the width, which on the face of it appears insuperable…<\/p>\r\n

The good news is that this is easily addressed using Opencart’s Layout functionality. A Layout is the entity which links Modules to pages and stores. When a page is to be displayed on a store, Opencart looks up the layout appropriate to that page on that store, and then finds any modules configured for that layout. Let’s use the Slideshow example to show how we can use two different slideshows on the homepages for our default and mobile stores. The first thing to do is to create a new layout for the mobile store home page. First we create the new Layout, via System > Design > Layouts, and click the ‘Insert’ button. I’ll call the new layout Home_Mobile. Now I need to tell Opencart which pages (or routes) on which store this Layout should be used for. Click ‘Add Route’, select the mobile store from the dropdown and then, to use this on the homepage, add the route ‘common\/home’. Like this:<\/p> \r\n\"Screenshot\r\n

Click ‘Save’. Now we’ve done this, assuming no other changes have been made, Opencart will use the Layout Home for the home page on the default store – this is set up already, but for the mobile store it will use the Layout Home_Mobile.<\/p>\r\n

Once we’ve done this the next bit’s easy…. Let’s assume we’ve got a suitably sized Banner already created. Bring up the Slideshow module config screen (Extensions > Modules > Slideshow – Edit), then click ‘Add Module’, and fill in the details for your new Slideshow, selecting ‘Home_Mobile’ as the Layout to which this module is applied. Something like:<\/p>\r\n\"Screenshot\r\n

Click ‘Save’ and it’s done – you have two separately sized Slideshows visible on the two different homepages.<\/p>\r\n","protected":false},"excerpt":{"rendered":"

If you have multiple stores on one Opencart installation, it’s quite likely you might want to display different versions of the same module on your different stores. I first came across this issue when developing a mobile theme, designed to be used alongside a ‘standard’ theme suitable for desktops. While most modules transfer fairly easily […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2507","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.simonbattersby.com\/blog\/wp-json\/wp\/v2\/pages\/2507","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.simonbattersby.com\/blog\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.simonbattersby.com\/blog\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.simonbattersby.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.simonbattersby.com\/blog\/wp-json\/wp\/v2\/comments?post=2507"}],"version-history":[{"count":13,"href":"https:\/\/www.simonbattersby.com\/blog\/wp-json\/wp\/v2\/pages\/2507\/revisions"}],"predecessor-version":[{"id":2576,"href":"https:\/\/www.simonbattersby.com\/blog\/wp-json\/wp\/v2\/pages\/2507\/revisions\/2576"}],"wp:attachment":[{"href":"https:\/\/www.simonbattersby.com\/blog\/wp-json\/wp\/v2\/media?parent=2507"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}