The Price Menu and Price List Elementor widgets by Stratum Elementor addons will aid you in creating categorized lists of items with prices, which can work for (but are not limited to) restaurant and cafe menus, product lists and diverse price lists.
In this post, we’re looking into two dedicated widgets that will help you channel your menu list design ideas to interactive website content. The key elements of both Elementor widgets are a title, description, price placeholder, plus optional dotted lines and images.
The Purpose of the Price List & Price Menu Elementor Widgets
Using both or the preferable widget, you can build:
- All types of dish menus.
- Online menus for restaurants, coffee shops, bars, pizza parlors, snack bars, etc.
- Food recipes.
- Tables of content.
Note: if you need your WordPress restaurant menus to sell food and drinks online, read more about the MotoPress solution.
The most obvious benefit is that you can save up some money since these Stratum widgets are free while their native Elementor counterpart (the Elementor Price List widget) is available within the Pro version. But there is much more to it:
- You can achieve different layouts: list, grid, and simplified list formats.
- You can create a different look for each menu item by customizing content and styling.
- Fully customizable colors, typography, and backgrounds.
- Mobile-friendly layouts.
What’s the main difference between these similar widgets?
The Price List Elementor widget is rather suitable for listing menu items under a broad category; for example, the list of appetizers will contain a list of items from this category with prices.
The Price Menu Elementor widget allows you to build a list of independent menu items, each with a corresponding image, description, and price.
Let’s now review the main settings and possibilities of these widgets so you can learn by example.
General Features and Settings of the Price List Elementor Widget
- General menu heading
- Heading size.
Customizing menu items
You can create and then duplicate your custom menu items. For each item, you can set:
- A menu item title
- A menu item size
- A menu item price.
You can also turn on/off men item images and the title-price separator in the Price List Elementor widget. For images, you can configure the image size, width, and alignment.
Styling the widget
By heading over to the Style tab, you’ll find more tools to give a more custom look to your menus:
- Change content padding
- Select colors for individual menu item elements (heading, title, and price).
For the advanced styling, you can benefit from the default Elementor’s toolkit (navigate to the Advanced tab) and customize the food list even further:
- Change background colors:
- Set an image as a background:
- Customize borders:
You can even create something more transcendental by playing with shapes, spacing, and motion effects.
General Features and Settings of the Price Menu Elementor Widget
Using the Elementor Price Menu widget, you can add unlimited items with the following details:
- Menu item title
- Menu item title size:
- Menu item description
- Menu item price
- Title color
- Price color
- Description color
- Image settings
You can change the image size:
And set the needed alignment:
You can also turn on/off the title-price separator and items separator.
Styling the widget
- You can optionally animate items on hover:
- Designate the items gap and image width:
- Set up a background color:
- Customize the border type:
For example, you can remove the items gap and add a thin border:
Or change the border radius to get fancier shapes:
- Set up box shadow:
- Apply content padding to adjust the spacing:
As usual, you are free to employ the Advanced styling by Elementor and get even deeper into customization:
- Customize margins and paddings between menu items:
- Edit background:
Stratum Free Elementor Widgets: Download Now
Get these awesome widgets for your online cafe or restaurant menu on WordPress and easily design them with Elementor. In addition to them, you’ll get a great collection of the Stratum Elementor widgets for different website building needs:
We also design and develop blocks for the block editor (Gutenberg WordPress), so make sure to check out Getwid – one of the most popular libraries of free addons for WordPress.