Shortcodes

FW Food Menu tutorial for Wordpress

Text commands that allow to add FW Food Menu layouts to a post and define parameters available for layouts and add-ons. Shortcode always looks like [fwfm_shortcode parameter1="xyz" parameter2="abc" ...].

There 5 shortcodes available in FW Food Menu:

  • [fwfm_categories] - categories list - FW Food Menu plugin.
  • [fwfm_menu] - meals list - FW Food Menu plugin.
  • [fwfm_mod_mealpromo] - single meal promo block - FWFM Promo add-on.
  • [fwfm_mod_cart] - a summary of items in cart block - FWFM Order Basket add-on.
  • [fwfm_mod_categories] - a clickable list of selected categories - FWFM Categories List add-on.

Apart from shortcode there are plugins extensions that we call add-ons which can be turned off with any shortcode if required. See Plugins section below for more information.

By default all installed add-ons (plugins) are on.

Another type of add-ons is design. Design allows to set template parameter and change layout appearance. See Designs section below for more information.

Designs can only be applied to FW Food Menu shortcodes.
FW Food Menu shortcodes
  • [fwfm_categories] - categories list
  • [fwfm_menu] - meals list
[fwfm_categories]
Categories Layout shows categories with their titles, short descriptions. number of meals and View Menu button, depending on settings. Categories look may vary depending on a parent category or global Settings Design parameter.
... category_id

Set categories available for layout by defining their IDs.

Options: comma separated category IDs.

Example: [fwfm_categories category_id="2,14,8"]
... category_text_alignment

Align category title and short description text.

Options: left, center, right.

Example: [fwfm_categories category_text_alignment="right"]
... display_category_shortdescription

Define if categories short description should appear on this layout.

Options: on, off.

Example: [fwfm_categories display_category_shortdescription="off"]
... show_meals_total

Show meals counter at the bottom of a category block.

Options: on, off.

Example: [fwfm_categories show_meals_total="on"]
... show_menu_button

Display a button called View Menu at the bottom of a category block to let a customer open a meals page by clicking it.

Options: on, off.

Example: [fwfm_categories show_menu_button="off"]
... add_params

Additional parameters from add-ons specific to a particular shortcode can be added via add_params parameter separated with a | (pipe) symbol.

cols_qty - FWFM Columns add-on
Description: number of meal columns for this categories layout.
Options: 1, 2, 3, 4.

category_meal_image - FWFM Images add-on
Description: Category Title image position and visibility + background Meals slideshow configuration.
Options: title, slideshow, all, none.

Title image option will show only category Title image set in a category parameters. Title image position is defined by parameter below or parameter set in a category. Parameter below has a priority.

Meal slideshow is an option when a category block shows all meals images as a background slideshow for a category block. If this parameter selected only slideshow will be shown.

Both option will show Title image along with Meal slideshow at the same time.

None option will show no images at all. Neither Title image nor Meals slideshow even if images are set.

category_image_position - FWFM Images add-on
Description: if Title image is visible this parameter will define category image position in relation to a category title.
Options: top, left, right, hide.

Example: [fwfm_categories add_params="cols_qty:2|category_meal_image:title|category_image_position:top"]
[fwfm_menu]
Meals listing layout that show selected categories with their subcategory. Design and layout for every category can be defined for each category independently.
... category_id

Set categories available for layout by defining their IDs.

Options: comma separated category IDs.

Example: [fwfm_menu category_id="2,14,8"]
... layout

Align category title and short description text.

Options: default, grid, order.

Default.A standard FW Food Menu meal layout.

Grid. A tab like layout with selected categories with their own design and layout setting.

Order. Order page with category list, search bar and order form according to Order Online settings.

Example: [fwfm_categories layout="cascading"]
... add_params

Additional parameters from add-ons specific to a particular shortcode can be added via add_params parameter separated with a | (pipe) symbol.

cascading_show_categories_as - FWFM Cascading Layout add-on
Description: Define cascading tabs layout.
Options: tabs, carousel.

Tabs - all selected categories are shown next to each other and then down below. Looks and works as tabs.

Carousel - one line slider that shows all selected categories as a row and scroll them as you hover and move a mouse over it.

cascading_items_in_row - FWFM Cascading Layout add-on
Description: A number of items shown per row for a Carousel layout.
Options: any integer number.

cascading_category_image - FWFM Cascading Layout add-on
Description: Define if category Title image should show up and where.
Options: top, left, right, hide.

cascading_short_description - FWFM Cascading Layout add-on
Description: Use Short description as a tag line or a short intro text right below a category name.
Options: on, off.

Example: [fwfm_menu add_params="cascading_show_categories_as:tabs|cascading_items_in_row:4|cascading_category_image:top|cascading_short_description:off"]

order_cols_qty - FWFM Order Online add-on
Description: Sets layout for all categories overwriting category Design & Layout settings. Show meals as a list (1 column) or in multiple columns (2,3...). Default settings will use Meal category column setting.
Options: 1, 2, 3.

order_show_search - FWFM Order Online add-on
Description: A meal search text field will be visible on top of the meals list allowing to find items by a name or description.
Options: on, off.

order_show_cats - FWFM Order Online add-on
Description: A list of categories selected for Online Order layout will be shown on the left column to help navigate through the list. Clicking a category will scroll a page up and down to show selected category. A category list will remain visible while scrolling.
Options: on, off.

order_show_order - FWFM Order Online add-on
Description: An order form with an info block, a list of selected meals, tax, delivery and total will be show in the right column presenting current order state. A form will remain visible on scroll.
Options: on, off.

Example: [fwfm_menu add_params="order_cols_qty:2|order_show_search:on|order_show_cats:on|order_show_order:on"]
Add-ons shortcodes
  • [fwfm_mod_mealpromo] - single meal promo block - FWFM Promo add-on.
  • [fwfm_mod_cart] - a summary of items in cart block - FWFM Order Basket add-on.
  • [fwfm_mod_categories] - a clickable list of selected categories - FWFM Categories List add-on.
[fwfm_mod_mealpromo] FWFWM Promo add-on
A single meal promo block adjusted with a max size, easily designed with one out of the box designs and tuned with a special promo label. Promo block may be added everywhere where a module can be placed - in a module position or inside an article. Key part of the block is a meal image, so make sure you add images for promo meals at least. Other elements like FWFM Order Online (Order button), FWFM Prices & Discounts (price label and discount) and FWFM Meal Badges add-ons will appear on promo block if available.
... meal

Select one of available meals from FW Food Menu to display as a separate promo block with its own design anywhere on a website.

Options: published meal name.

Example: [fwfm_mod_mealpromo meal="Latte"]
... size

A size of a promo block in pixels. Define a maximum size in pixels between 250px and 500px to fit into area where it should appear. A block will shrink and adjust on mobile devices automatically.

Options: integer number from 250 to 500.

Example: [fwfm_mod_mealpromo size="320"]
... design

Promo comes with designs that will increase and update over time. Depending on a meal and elements used some design will work with with certain images better, depending on an image and elements used. Every design has specific meal title, image, price with a label (first only if several), description, meal badges and order button styles. Of course you can modify them yourself via CSS, but every design is a finished meal presentation.

Options: promo_01, promo_02, promo_03, promo_04, promo_05, promo_06.

Example: [fwfm_mod_mealpromo design="promo_02"]
... label

A short text on a promo block to add some extra info like "Meal of the day" or "Special". Make your meal stand out and specify why exactly selected meal is special for. If left empty will not show. Please note that every design has a Label in a different place. You can always see it on a preview.

Options: any text.

Example: [fwfm_mod_mealpromo label="Some promo label"]
[fwfm_mod_cart] FWFWM Order Basket add-on
Shows order summary box with the list of all items selected for order, delivery options, tax and order notes. This shortcode duplicates Order summary from Order Online layout. FWFM Order Online add-on is required for module to work.
[fwfm_mod_categories] FWFWM Categories List add-on
Shows a list of selected categories with links to menu pages. If a category is on the same page as a Category list it will not reload and will just scroll to a category clicked. If a module show categories located on a different page a link will take a customer to a page with a category and scroll to its title. There is a Hide hidden titles parameter that helps to keep Category list clean from non-visible categories.
... category_id

Select parent categories with their subcategories to be shown in Category list.

Options: comma separated category IDs.

Example: [fwfm_mod_categories category_id="2,14,8"]
... hide_hidden_categories

Hide categories which has Show title parameter set to No. Using categories with no titles allows to add text blocks in-between categories or group other categories into sections with different number of columns, thus they will not contain any meals.

Options: on, off.

Example: [fwfm_mod_categories hide_hidden_categories="off"]
Functional add-ons (plugins)

There is a list of functional add-ons that extend main functionality. Those add-ons can be switched on/off using plugins parameter. If multiple add-ons needs to be switched off, use I (pipe) symbol to add an extra add-on.

Example: [fwfm_menu plugins="cart:off|image:off"]

The list of available parameters can be found below.

Add-on nameParameter
FWFM Order Onlinecart
FWFM Imagesimage
FWFM Prices & Discountsprices
FWFM Cascading Layoutcascading
FWFM Meal Badgesmealbadges
FWFM Columnscolumns
FWFM Category PDFcategorypdf
FWFM Color & Backgroundcolor
FWFM SEO Boosterseobooster
FWFM Multilingualmultilingual
Designs
FW Food Menu shortcodes can change layouts with template parameter if any design add-ons are installed. The list of available designs can be found below.
Example: [fwfm_menu category_id="14,8,17" template="coffee"]
template parameter will work with FW Food Menu shortcodes only.
coffee FWFM Coffee House add-on
Clean and minimalistic coffee theme with dot leveled prices and coffee colors.
italian FWFM Italian Restaurant add-on
Italian Restaurant theme with implements Italian colors and atmosphere through top categories and sub-categories design. Combination of fonts, backgrounds and text colors make this theme look elegant.
sushi FWFM Sushi Restaurant add-on
Traditional Japanese red and black theme for sushi or Asian food directory. Sub-category design available with Asian style vertical category names on the left side.
pizzeria FWFM Pizzeria add-on
Bright Pizzeria theme with contrast image background and good color balance to help a customer find its favorite pizza or salad. Sub-category design is available and groups categories in nice sections that are easy to read.