WebSite X5 Evo and Pro

Think about a restaurant: together with the contact page, where users can find the necessary information to make their reservation, one of the most important pages is surely the one reporting the menu. The reason is simple: the customer wants to know what your offering is, and possibly how much they will spend, too. 

Given its importance, how can you create a nice and functional menu? With the Price List Optional Object. You can use it to create complete and well-formatted menus. This Object can also be used to display the offering of any kind of business that needs to display a price list on their website: cafés, gyms, B&B's, car workshops, etc. Check out some examples on the Preview page

Create the list 

The first thing to create the menu is creating the list of the entries.

  • Double-click on the Price List Object to access the settings window.
  • Stay in the Contents section, click on Add so to add a new entry in the Entry List.
  • Select the entry you just added and report the necessary information. For each entry, you can define:
    • a Title, namely the name of the product/service; 
    • the Price: don't forget to report the complete product/service price with its currency (for instance, write "€5" and not just "5");
    • a Description, i. e. a brief text reporting the main features of the product/service;
    • an Image, for instance the dish;
    • one or more Icons. You can use them to convey important information in a completely visual way. On restaurant menus, for example, icons are generally used to indicate vegan dishes or to give an indication of the level of spiciness.

You can add more than one icon, remove the ones you don't need anymore, and rearrange them with the arrows. If you select an icon and lick on Description, you can report a Title and an Alternative Text. These are not only useful for the SEO: the Title is displayed in a Tooltip on mouseover. Write it carefully so that it serves to explain the meaning of the icon itself.  

#tip - None of the information required to compose an entry is mandatory. If, for example, you prefer not to show prices or not to put any pictures, you can simply leave these fields blank.
  • Follow these steps to create all the entries you need. You can also delete the ones you no longer need and rearrange them using the arrows.


Define the price list style

Once the entry list is ready, which you can update at any time, you can move on to the graphic style:

  • Access the Style section.
  • Select the wished element from the drop-down list: Title, Price, Description, Icons, Image.
  • You will find different options according to the element you selected. For instance, you can format text elements with the usual option, and add a border for the Title. As to the icons, you can define the size, the position and the alignment. Finally, as far as the images are concerned, you can set the wished corner bevel value. Use the Preview to check out the changes you apply.


If the price list you have to make includes many items or if you have special layout requirements, it may be more convenient to develop it by including more than one Price List Object.

Let's take the example of a restaurant menu that includes Appetizers, Main Courses and Desserts. Instead of managing all the items in one Price List Object, it might be convenient to divide them so that each section corresponds to a different Price List Object. In this way, the list could be divided into sections with their own headings (for example, the title “Appetizers” is followed by the list of appetizers), or it could be aligned over several columns or even have parts “shifted” to the side to provide space for additional images.

Are you curious to use this Object on your website pages? Install Price List now

You don't have enough Credits to buy this Object? Check out our Credit Packs