MyListing Menu Addon
The {CODICTS} MyListing Menu Addon plugin enhances restaurant menu and general repeater block display on MyListing single listing pages. It replaces the default repeater template with an improved version that properly renders labels, icons, images, descriptions, prices, and links, and adds three powerful CSS-class-driven features: block grouping, tabbed navigation, and a decorative dotted price effect.
Installation & Activation
Start by downloading the plugin from the Downloads page on your dashboard on the CoDicts website.
After downloading, install and activate the plugin in WordPress by navigating to “Plugins” > “Add New” > “Upload Plugin” and selecting the downloaded zip file. Click “Install Now” and then “Activate”.
On activation, the plugin automatically copies its improved template file into your child theme directory. The enhanced repeater/menu layout is immediately active on all single listing pages.
Important: Both the MyListing theme and a MyListing child theme must be active. Without a child theme, the plugin displays an error notice and does not load.
Key Features
| Feature | Description |
|---|---|
| Improved Repeater & Menu Layout | Replaces the default MyListing general repeater block template with a structured layout that properly displays labels, icons, images, descriptions, prices, and links. |
| Join Blocks | Group multiple consecutive repeater/content blocks into a single combined container using a CSS class. |
| Tab Blocks | Convert grouped blocks into a tabbed interface with clickable navigation using a CSS class. |
| Dotted Price Effect | Add a decorative dotted line between menu item names and prices for a classic menu look. |
| Responsive Grid | Supports configurable column layouts for desktop, tablet, and mobile. |
| Image Lightbox | Menu item images open in a PhotoSwipe lightbox when clicked. |
What the Plugin Does
The plugin provides two main enhancements:
1. Improved Repeater & Menu Block Template
MyListing’s default general repeater block template has limited formatting. This plugin replaces it with an improved version that displays each repeater row as a structured menu item with:
An optional thumbnail image with lightbox support, a label/title, an optional description with paragraph formatting, an optional price, and an optional link button. The layout supports responsive grid columns configured through the block’s column settings (desktop, tablet, mobile).
This improvement applies automatically to all General Repeater and Restaurant Menu content blocks on single listing pages — no CSS classes or settings needed.
2. CSS Class Features
Three features are activated by adding CSS classes to content blocks in the MyListing listing type editor. These work with any content block type, not just repeater blocks.
CSS Class Features
There is no settings page for this plugin. All configuration is done by adding CSS classes to content blocks in the MyListing listing type editor.
| CSS Class | Purpose | Can Be Combined |
|---|---|---|
codicts-join-block | Groups multiple consecutive content blocks into a single visual container. | Yes — combine with codicts-tab-block and/or codicts-dot-price |
codicts-tab-block | Converts grouped blocks into a tabbed interface with clickable navigation. | Must be used together with codicts-join-block |
codicts-dot-price | Adds a decorative dotted line between menu item labels and prices. | Yes — can be used standalone or with other classes |
How to Add CSS Classes
1. Go to Listing Types in the WordPress admin and edit the listing type.
2. In the Single Page tab, find the content block you want to configure.
3. Enter the CSS class(es) in the block’s Custom Block Classes field.
4. Save the listing type.
Join Blocks — Grouping Content Blocks
Add the class codicts-join-block to multiple consecutive content blocks to merge them into a single visual container.
How it works: The first block in the group becomes the parent container. All subsequent blocks with the same class are visually merged into it — their content appears inside the parent block as though they were one combined block.
Example: You have three General Repeater blocks — “Starters”, “Mains”, and “Desserts”. Add codicts-join-block to all three. They merge into a single container showing all menu sections together.
Note: Blocks must be consecutive and within the same listing page tab/section. If blocks span different listing page tabs, they form separate groups.
Tab Blocks — Tabbed Navigation
Add both codicts-join-block and codicts-tab-block to multiple consecutive content blocks to convert them into a tabbed interface.
How it works: Each block’s header becomes a clickable tab button. When a tab is clicked, only that tab’s content is visible — the others are hidden. The first tab is active by default.
Example: Add codicts-join-block codicts-tab-block to three blocks named “Appetisers”, “Main Course”, and “Desserts”. The result is a tabbed menu where users click between categories.
Dotted Price Effect
Add the class codicts-dot-price to a content block to display a decorative dotted line between each menu item’s name and its price:
Margherita Pizza .................. $12.99
Caesar Salad ...................... $8.50
Grilled Salmon ................... $18.99
This class can be used standalone on a single block or combined with the join and tab classes.
Combining All Three Classes
For the most polished restaurant menu experience, combine all three classes:
codicts-join-block codicts-tab-block codicts-dot-price
This creates a tabbed menu where each tab shows a category of items (e.g., Appetisers, Mains, Desserts), and each item within displays the dotted price effect between the item name and price.
Repeater Row Fields
The improved template supports the following fields in each repeater row:
| Field | Required | Description |
|---|---|---|
| menu-label | Yes | The menu item name/title. Rows with an empty label are skipped. |
| menu-description | No | A description of the item, displayed with paragraph formatting. |
| menu-price | No | The price, displayed next to the item name. |
| menu-url | No | A link URL for the item. |
| link-label | No | Label for the link button. Both menu-url and link-label must be set for the button to appear. |
| mylisting_accordion_photo | No | An image for the item. Displayed as a thumbnail with PhotoSwipe lightbox support. |
Template File Management
The plugin overrides one MyListing template by copying a modified version into the child theme:
| Template | Purpose |
|---|---|
| general-repeater-block.php | Replaces MyListing’s default general repeater/restaurant menu block rendering with an improved structured layout. |
| Event | What Happens |
|---|---|
| Plugin activation | Template is copied to the child theme (force overwrite). |
| Plugin update | Template is force-reinstalled (overwrites existing file). |
| Plugin deactivation | Template is deleted from the child theme. MyListing reverts to its default rendering. |
| Theme switch | Template tracking is reset. |
Note: If you manually customize the
general-repeater-block.phpfile in your child theme, your changes will be overwritten when the plugin is activated or updated. Back up your customizations before updating the plugin.
Frequently Asked Questions
Is there a settings page?
No. This plugin has no settings page. The improved repeater template works automatically, and the CSS class features are configured by adding classes in the MyListing listing type editor.
Why is a child theme required?
The plugin copies a template override file into the child theme directory. MyListing’s template hierarchy picks up child theme templates over the parent theme’s defaults. Without a child theme, there’s nowhere to safely place the override.
Does the improved template apply automatically?
Yes. Once the plugin is activated, all General Repeater and Restaurant Menu content blocks on single listing pages use the improved template. No CSS classes or configuration needed for this feature.
How do I group blocks together?
Add the CSS class codicts-join-block to each of the consecutive content blocks you want to group in the listing type editor. They must be in the same listing page tab/section.
How do I create tabbed blocks?
Add both codicts-join-block and codicts-tab-block CSS classes to each consecutive block. Each block’s header becomes a clickable tab.
How do I get the dotted price effect?
Add the CSS class codicts-dot-price to the content block. A dotted line appears between each item label and its price.
Can I combine all three CSS classes?
Yes. Use codicts-join-block codicts-tab-block codicts-dot-price together for grouped, tabbed blocks with dotted price formatting.
Why don’t my blocks group together?
The blocks must be consecutive and within the same listing page tab/section. If they are in different tabs, they form separate groups rather than one combined block.
What happens to my template if I deactivate the plugin?
The plugin deletes its template file from the child theme on deactivation. MyListing reverts to using its default general repeater block template.
Will the plugin overwrite my custom template changes?
Yes. On activation and version updates, the plugin force-copies its template file, overwriting any existing file at the same path. Back up your customizations before updating.
Troubleshooting
Menu/Repeater Blocks Not Using Improved Layout
| Cause | Solution |
|---|---|
| Template not installed | Deactivate and reactivate the plugin to force-reinstall the template into the child theme. |
| Child theme not active | The plugin requires an active child theme. Go to Appearance → Themes and activate a MyListing child theme. |
| Another template override exists | If you have a different custom general-repeater-block.php in your child theme, it may have been overwritten on activation. Deactivate and reactivate the plugin, or check that the file at templates/single-listing/content-blocks/general-repeater-block.php in your child theme is the plugin’s version. |
Join/Tab/Dot Classes Not Working
| Cause | Solution |
|---|---|
| CSS classes not added | Edit the listing type, find the content block in the Single Page tab, and enter the CSS class(es) in the Custom Block Classes field. |
| Typo in class name | Classes must be exactly codicts-join-block, codicts-tab-block, and/or codicts-dot-price (with hyphens, not underscores). |
| Blocks not consecutive | Join and tab blocks must be consecutive blocks within the same listing page tab/section. Insert them one after another without other blocks in between. |
| Blocks in different sections | If blocks are in different listing page tabs, they form separate groups. Move them into the same tab to combine them. |
| JavaScript error | Check the browser console (F12 → Console) for errors that might prevent the script from running. |
Tab Block — Only First Tab Shows Content
| Cause | Solution |
|---|---|
| Expected behavior | Only the active tab’s content is visible. Click the other tab headers to switch between them. |
Missing codicts-join-block class | The codicts-tab-block class must be used together with codicts-join-block. Add both classes to each block. |
Images Not Showing in Menu Items
| Cause | Solution |
|---|---|
| No image field set | The repeater row must have the mylisting_accordion_photo field populated with an image URL. Check the listing’s repeater data. |
“MyListing Theme Not Detected” or “Child Theme Not Detected” Error
Both the MyListing theme and a MyListing child theme must be installed and active. Go to Appearance → Themes to verify.
For further support, visit codicts.com or contact us at support@codicts.com.