Menu Editor

[osCommerce-Official]

Menu is a totally new concept in osCommerce v4 that comes built in and "out of the box". 

Instead of website menu being effectively a copy of the category tree in previous versions of osCommerce, in version 4 we have created a totally separate entity for menus, which can be embedded into any part of any page. 

And so, Menus are managed from a special section of the back end:

You can switch between different menus existing in the system or create a new one.

It is possible to export and import menus, to move them between websites.

A menu is a list of a tree of choices. Each menu item can have its own name, link (if not predefined link to one of the website's pages), and style class:

So, it is possible to rename categories as they get added to the menu, or even have the same category more than once in the menu. 

Besides categories and brands, It is also possible to add links to website's pages (like Shopping cart, Contact, etc), to the content pages (like About, Privacy policy, etc), or to a completely random URL (custom link).  

 

[alix32]

Hi - what would an horizontal category menu look like on the front end? A mega-menu like we see on pretty much every modern ecommerce site, with sub-categories in verticals/columns, a brand or any image of your choice in a dedicated space, etc..?

[osCommerce-Official]

16 minutes ago, alix32 said:

Hi - what would an horizontal category menu look like on the front end? A mega-menu like we see on pretty much every modern ecommerce site, with sub-categories in verticals/columns, a brand or any image of your choice in a dedicated space, etc..?

Alix, thanks for this question. 

So, there exists a "standard" menu widget at the moment. Of course we will welcome osCommerce developers to take it and work on it if they like, and perhaps submit back to the App store at some point. 

Standard menu widget can be used on any page of the website. It can be pointed to any of the menus created in the Menu management tool, be it a category menu or some service menu. 

Of course, osCommerce v4 being a modern day solution requires to be able to display some advanced menus to ease navigation through the websites. 

So we have currently created several "styles" for the Menu widget, including Mega menu (big drop down):

Also, styles and behaviour of the menus can be managed through the CSS. 

Here are some examples from a few recent sites we created for existing businesses.

1. Multiple category levels, graphics linked to sub-categories:

2. Similar to the first one, but slightly different design:

 

3. A simple way to display categories, again, design is very different to the first two examples:

 

 

4. Multiple categories, however the layout is vertical here:

 

[Hotclutch]

How does a menu(s) like this respond across device breakpoints, or does the user have to keep that in mind when designing his menu ?

Do brands (manufacturers) also go into menus ?

[osCommerce-Official]

6 minutes ago, Hotclutch said:

How does a menu(s) like this respond across device breakpoints, or does the user have to keep that in mind when designing his menu ?

Do brands (manufacturers) also go into menus ?

Ashley, when creating a design theme, it is possible to set different "breakpoints" (or widths) and have different widgets behave differently according to the screen size. 

It is also possible to have a special "mobile" version of the theme, which can be quite useful for some websites.

This is how the same menus look on mobile phone screen:

 

Brands, along with categories, can surely be present in the menus - please refer to the earlier message in this thread, where we wrote about how menus are created in the back end - it is possible to add links to categories, brands, system pages, content pages, and just literally any link to the menus.

 

[pete2007]

I don't suppose you have a demo of the back-end yet, or will this be released shortly? thanks

[osCommerce-Official]

6 minutes ago, pete2007 said:

I don't suppose you have a demo of the back-end yet, or will this be released shortly? thanks

Peter, demo will be made available shortly. Works are in progress to update the back end and front end at the moment.

[milkman45]

The demo will be very welcome.  Currently, I'm having to work with a WP store setup (which is very clumsy)  to redo the website from 2.3.4 as Pheonix is not an option. Looking through all the variants and options for V4. Cleaner, and better thought out as a true eCommerce platform. All required options (currently shown) to manipulate seem to be met in the V4 version.

Well done.

[alexiscruz007]

Great i wait osco 4.

[Guest]

For device break-points, there is media queries (CSS feature).
Also, menus are just texts, nested in html tags, having html attributes (/id/class/anyelse)... CSS can do the work perfectly! (I know it, I already doed it in past versions of OSCommerce (2.2 MS2, 2.3)

To answer the subject of topic, WHAT A GREAT CHANGE!!! I mean, a TRUE dynamic managed menu, from Admin !!
Anyway, here is some questions refering to that new version:

1) How are identifiable parts of menus, (I mean, look at this structure):

<!-- please note that it's for quicker demonstration -->
<!-- look below, I demonstrated a simple menu, but with identifiable parts,
     of it, in order to style (or manipulate through javascript) -->
<section class="menu-products">
	<div class="menu-products-item-block" id="menu_products_item_block_1">
		<span class="menu-products-item-icon" id="menu_products_item_icon_1">🧥</span>
		<span class="menu-products-item-text" id="menu_products_item_text_1">Admire our new coats from there</span>
  	</div>
</section>

<!-- as you may saw it, each parts of the menu are ready to receive
     either CSS rules/instructions
     	(mediaqueries or simple rules or complex with helps of Sass, Less parser syntax)
	 but also can be managed by Javascript (with or without help of any js frameworks), through "id".
	 this is really not a full example of what I've had in head, but you see what I mean by "identifiable parts", now! :)
     -->

2) From the menus managers, can we adds custom HTML attributes or manage them for a particular menu OR parts of menus ?

[wieland]

Please dont think to much as a coder but as a customer(shop owner), dont get me wrong im a coder/database designer for 20 years and i love to code but to ofthen i see code/apps that are logical for the coder, but end users have??? and quite

and sometimes yoyu have to protect the end user (ofcourse with GOOD reasoning why) 

My point, a page is a page there are only X type of pages needed, and shop owners/users want to make a page some where in the menu for there shop/website so let them navigate in the menu, and there add page (choose page type)

[radhavallabh]

On 3/8/2021 at 5:14 PM, osCommerce-Official said:

Alix, thanks for this question. 

So, there exists a "standard" menu widget at the moment. Of course we will welcome osCommerce developers to take it and work on it if they like, and perhaps submit back to the App store at some point. 

Standard menu widget can be used on any page of the website. It can be pointed to any of the menus created in the Menu management tool, be it a category menu or some service menu. 

Of course, osCommerce v4 being a modern day solution requires to be able to display some advanced menus to ease navigation through the websites. 

So we have currently created several "styles" for the Menu widget, including Mega menu (big drop down):

Also, styles and behaviour of the menus can be managed through the CSS. 

Here are some examples from a few recent sites we created for existing businesses.

1. Multiple category levels, graphics linked to sub-categories:

2. Similar to the first one, but slightly different design:

 

3. A simple way to display categories, again, design is very different to the first two examples:

 

 

4. Multiple categories, however the layout is vertical here:

 

How to select the style no. 1 Mega Menu from the admin section? I need to use that Mega menu style interface...