Menu List

Overview

If you want to make website for restaurant menu then this Menu List Widget is for you. It is used to make customizable and responsive menu in which you can make list of items with prices.

Screenshot

The following is a GIF video to show you how to use the menu list widget and the various options available :

Menu List

Menu List Widget

The following is a Menu list widget :

Menu Item
Cheese | Pepper | Mushrooms
$59
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Menu Item
Cheese | Pepper | Mushrooms
$59
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Menu Item
Cheese | Pepper | Mushrooms
$59
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Options

Menu List

Menu Item

  • Title : Set the title of menu item.
  • Includes : Set the text of includes or ingredients.
  • Description : Set description of menu item.
  • Price : Set price of menu item.
  • Image : Set image of menu item.
  • Space Between : Set space between one menu item to other.
  • Vertical Align : Choose vertical alignment of image.
  • Divider : Select divider and divider type from None, Solid, Dashed… etc.
  • Divider Color : Set color of divider.
  • Thickness : Set height of divider.

Title Style

  • Color : Set menu title color.
  • Typography : Set the font and text style of menu title.
  • Bottom Space : Set space between title and description.

Item Details

  • Color : Set menu items color.
  • Typography : Set the font and text style of menu items.

Price

  • Color : Set menu Price color.
  • Typography : Set the font and text style of price.

Description

  • Color : Set menu description color.
  • Typography : Set the font and text style of description.

Image

  • Width : Set width of image.
  • Spacing : Set space between image and description.
  • State : Set the State in which effects has to be displayed viz. Normal or Hover.
  • Border Type : Set the border type. CLICK HERE to see the types of border.
  • Border Color : Set the border color.
  • Border Width : Set the border width.
  • Border Radius : Set the border radius.

Seperator Style

  • Type : Select type of separator from Dotted, Dashed… etc.
  • Color : Set the color of separator.
  • Width : Set width of separator.
  • Spacing : Set space between separator and menu item title.
Was this helpful to you?