Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

osCommerce-Official

Multiple Design Templates and built in Designer

Recommended Posts

osCommerce v4 is coming with support for Multiple Design Templates and built in Template Builder

Template management doesn't require any PHP coding, and is done via the back end of the website. 

It is possible to create, import, and export multiple design templates. This opens ways for professional designers and developers to offer their osCommerce templates for sale in the future App Marketplace - announcements to follow.

Design templates are managed and modified via the back end of osCommerce, using a special built in Designer.

It is possible to edit template settings in several ways (visual editor and CSS editor).

It is possible to add, move, and delete various widgets from any page of the osCommerce website. 

Additionally, all documents (invoices, packing slips, emails) can be edited if required.

It is also possible to create copies of the existing pages. For example, there can be 2 or more product pages, and different products can be assigned different designs of the product page.

Support for Responsive design is implemented, as well as an additional optional Mobile view for each template.

The system allows both professional designers and end users (i.e. shop owners) change the look and feel of the osCommerce online store without going deep into the code or even without HTML knowledge. Of course designers and developers are able to modify widgets or create new widgets to extend functionality of osCommerce v4

Have any comments or questions? - please feel free to post them here.

Interested in becoming a Beta tester - sign up via the Contact Us form on osCommerce.com website to be added to the list, get notified about the releases quicker, and get access to the Beta version as soon as it becomes available.

Would you like to learn how to create beautiful osCommerce templates and offer them on this website to shop owners? Sign up via our Contact page. Watch this space!

osc design 1.jpg

Share this post


Link to post
Share on other sites
Quote

Support for Responsive design is implemented, as well as an additional optional Mobile view for each template.

Is this using Bootstrap or CS Grid or a combination of anything that works ?

Share this post


Link to post
Share on other sites
23 hours ago, Nige-A said:

Is this using Bootstrap or CS Grid or a combination of anything that works ?

It definitely works! :)  But no, it is not using Bootstrap or CS Grid. Will publish more detail on the design templates and editing in the near future for everyone to read and comment.

Share this post


Link to post
Share on other sites

Is there a header and a footer template ? Or can the header and footer of each page be customised in their respective templates ?

Can php conditions be used in templates ?

Share this post


Link to post
Share on other sites
55 minutes ago, Hotclutch said:

how many templates does the default theme have ?

This is to be confirmed. We have a few templates at the moment and it is likely that they will be listed in the Template Store as free templates. We are positive osCommerce design partners will want to work on creating very advanced design templates and listing them in the osCommerce Template store too for a certain fee. 

Share this post


Link to post
Share on other sites

Sorry, i think you misunderstand. 

The default theme consists of a template set right ? I am referring to the number of templates in the template set.

Share this post


Link to post
Share on other sites
45 minutes ago, Hotclutch said:

Is there a header and a footer template ? Or can the header and footer of each page be customised in their respective templates ?

Can php conditions be used in templates ?

It is possible to customise each and every page of the design template. It is also possible to have multiple (well, be reasonable :) ) implementations of the same page template. For example one can have 2 differently looking templates of the product page, and then assign them to different product ranges being offered of their site.

PHP conditions wont be used in the template as such, as the template is being edited in the built in visual Designer. HOWEVER you can of course go inside particular Widgets and edit the code there. In fact, we will be welcoming designers and developers creating not just templates but also widgets!

Share this post


Link to post
Share on other sites

Also when in mobile mode a design i like is to have a slide in menu from the left hand side, which contains the main categories and important links etc. The menu slides in by the user clicking a small icon on the left hand side, which also remains in place as the user scrolls down so is always available. This hugely benefits the user experience when in mobile mode as there isn't the space the have categories in the header menu. https://www.w3schools.com/howto/howto_js_sidenav.asp

Share this post


Link to post
Share on other sites
21 minutes ago, annuity said:

Also when in mobile mode a design i like is to have a slide in menu from the left hand side, which contains the main categories and important links etc. The menu slides in by the user clicking a small icon on the left hand side, which also remains in place as the user scrolls down so is always available. This hugely benefits the user experience when in mobile mode as there isn't the space the have categories in the header menu. https://www.w3schools.com/howto/howto_js_sidenav.asp

See the 4th shop on this page:

https://sites.oscommerce.com/

The new osCommerce menu appears to function like this.

Share this post


Link to post
Share on other sites
On 2/19/2021 at 11:10 AM, osCommerce-Official said:

osCommerce v4 is coming with support for Multiple Design Templates and built in Template Builder

Template management doesn't require any PHP coding, and is done via the back end of the website. 

It is possible to create, import, and export multiple design templates. This opens ways for professional designers and developers to offer their osCommerce templates for sale in the future App Marketplace - announcements to follow.

Design templates are managed and modified via the back end of osCommerce, using a special built in Designer.

It is possible to edit template settings in several ways (visual editor and CSS editor).

It is possible to add, move, and delete various widgets from any page of the osCommerce website. 

Additionally, all documents (invoices, packing slips, emails) can be edited if required.

It is also possible to create copies of the existing pages. For example, there can be 2 or more product pages, and different products can be assigned different designs of the product page.

Support for Responsive design is implemented, as well as an additional optional Mobile view for each template.

The system allows both professional designers and end users (i.e. shop owners) change the look and feel of the osCommerce online store without going deep into the code or even without HTML knowledge. Of course designers and developers are able to modify widgets or create new widgets to extend functionality of osCommerce v4

Have any comments or questions? - please feel free to post them here.

Interested in becoming a Beta tester - sign up via the Contact Us form on osCommerce.com website to be added to the list, get notified about the releases quicker, and get access to the Beta version as soon as it becomes available.

Would you like to learn how to create beautiful osCommerce templates and offer them on this website to shop owners? Sign up via our Contact page. Watch this space!

osc design 1.jpg

I am disappointed with the theming capability. I don't believe this is true separation of HTML from code. Some people will be able to build themes with this, but it's not the way I would have liked to develop a theme with full control of the page HTML. Sorry to be over critical at this point of the release, but I also think the average user will have difficulty producing a theme, which means they will have to make do with one of the 2 themes provided or wait for ready to use themes to become available.

 

Share this post


Link to post
Share on other sites
7 hours ago, Hotclutch said:

I am disappointed with the theming capability. I don't believe this is true separation of HTML from code. Some people will be able to build themes with this, but it's not the way I would have liked to develop a theme with full control of the page HTML. Sorry to be over critical at this point of the release, but I also think the average user will have difficulty producing a theme, which means they will have to make do with one of the 2 themes provided or wait for ready to use themes to become available.

 

Ashley,

Thanks for your feedback! 

Theme editor allows building new themes / templates using the set of widgets. There are "general" widgets that can be added to any page of the theme, and there are page-specific widgets (like widgets for the product page, shopping cart page, etc). It is indeed possible to build a new theme "from scratch" using the widgets. 

Alternatively it is possible to copy an existing theme, and edit it to create new one. 

In either way, it is possible to completely control the look and feel (or the "style") of each widget using the build in style editor or by overwriting the CSS directly. 

osCommerce will be supplied with more themes than were included in B1 and B2. It will be confirmed for the release (due in approximately 3 weeks). 

Share this post


Link to post
Share on other sites

Is it possible to replace the responsive grid that is being used, and use another framework? Can this be done from within the design console? I see each theme consists of a desktop and mobile theme. 

Share this post


Link to post
Share on other sites
1 hour ago, Hotclutch said:

Is it possible to replace the responsive grid that is being used, and use another framework? Can this be done from within the design console? I see each theme consists of a desktop and mobile theme. 

@Sergey Dunaevcould you please comment?

Share this post


Link to post
Share on other sites
15 hours ago, Hotclutch said:

Is it possible to replace the responsive grid that is being used, and use another framework? Can this be done from within the design console? I see each theme consists of a desktop and mobile theme. 

You can't change system grid. But you can use one theme for desctop and mobile (responsive desgn). osCommerce has setting use mobile or not in Theme settings.

Share this post


Link to post
Share on other sites
11 minutes ago, Sergey Dunaev said:

You can't change system grid. But you can use one theme for desctop and mobile (responsive desgn). osCommerce has setting use mobile or not in Theme settings.

Yes, I thought so, but thanks for clarifying.

Share this post


Link to post
Share on other sites

i tried to install the "smartwatch" theme but it always fails. not sure why?

also i would be very helpful from a design and edit perspective to have a stock theme that is very close to the original ecommerce layout (so the widgets and parts are easy to understand)

why i suggest this, is to help with migration from an old store to a new one. i have found with testing, its very hard to compare and duplicate all the functions as to not start from scratch

the main issue i have right now is, categories.    so for example... 
home > furniture > office > sitting  > chairs  
home > furniture > office > sitting  > chairs > folding
home > furniture > office > sitting  > chairs > wheels
home > furniture > office > sitting  > stools 
home > furniture > office > sitting  > bench 

if i have a store with many many sub cats. i cannot figure out how to load the cat map/trail to show like old OSC, so the customer knows where they are or can click around on any  page
and how to load the product listing while using that menu (again basically like old OSC)

the new theme seem to use a totally different map? 

 

Share this post


Link to post
Share on other sites

1.thumb.JPG.0e92e903951dcaf9d12479587482214a.JPG2.thumb.JPG.88673ff81335689ce7c8e4ad49245be1.JPG3.thumb.JPG.efbe5f7017c546a8636503a062fbf033.JPG

 

i cannot understand how to then add it into the theme or front end? as a list like layout like the old OSC

when i got it kind of working, it would only show the top and sub level but not the deeper current product cat.

the stores i work on have LOTS of CATS. and sub sub sub cats. to break down parts and products, the the simple stock themes i cant find a work around i can understand to use.

thanks

 

Share this post


Link to post
Share on other sites

Hi,

Regarding "i cannot figure out how to load the cat map/trail to show like old OSC, so the customer knows where they are or can click around on any  page" please add the Breadcrump widget in the required place while adding/editing the required theme. Please see the screenshot attached how to do it. See also another screenshot with the result of it.

As for setting up the menu with categories and subcategories please see the newly created article - https://wiki.oscommerce.com/index.php?title=Adding_Brands_and_Categories_to_Menus.  

Best regards,

Ivan

Screenshot_11.png

Screenshot_12.png

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×