MyListing Listing Package Toggles
The {CODICTS} MyListing Listing Package Toggles plugin enhances the package selection step of the “Add Listing” flow by adding a stylish sliding toggle control above the package cards. Site owners can group WooCommerce listing packages into named categories (e.g., “Monthly” / “Yearly” or “Basic” / “Premium”) and let users switch between groups with a single click, rather than seeing all packages at once.
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”.
Once activated, navigate to “Listing Package Toggles” in the WordPress admin sidebar to configure your toggle groups.
The Problem It Solves
When using MyListing’s “Add Listing” flow, users are presented with all available listing packages at once. If your site offers many packages — free, monthly, yearly, premium tiers — the package selection page becomes overwhelming and cluttered.
This plugin adds a toggle switcher above the package cards. Each toggle represents a named group of packages. When a user clicks a toggle, only the packages in that group are shown, and the rest are hidden. A smooth animated slider indicates the active selection.
Key Features
| Feature | Description |
|---|---|
| Simplifies Package Selection | Reduces visual clutter by hiding irrelevant packages — users only see what’s relevant to their chosen group. |
| Per Listing Type Configuration | Each MyListing listing type can have its own set of toggles with different groupings. |
| 2–6 Toggle Options | Supports between 2 and 6 toggle groups with a smooth animated CSS slider. |
| Default Toggle | Pre-select which group users see first when they arrive at the package selection page. |
| Claim Listing Support | Works with claim listing packages as well as standard listing packages. |
| Zero Code Required | Fully managed through a WordPress admin settings page. |
Setting Up Toggles
Navigate to “Listing Package Toggles” in the WordPress admin sidebar.
The settings page lists every listing type registered in your MyListing setup. For each listing type:
Step 1 — Enable Toggles
Check the “Enabled?” checkbox next to the listing type you want to add toggles to. The toggle configuration panel appears below.
Step 2 — Create Toggle Groups
1. Click “Add a Toggle” to create a new toggle entry.
2. Fill in the fields:
| Field | Description |
|---|---|
| Toggle Name | The label displayed on the toggle button (e.g., “Monthly”, “Yearly”, “Free Plans”). |
| Select listing packages / claim packages | A multi-select dropdown listing all WooCommerce products configured as packages for this listing type. Hold Ctrl (or Cmd on Mac) to select multiple packages. |
| Use as default toggle? | Check this box to make this toggle the pre-selected option when the page loads. |
3. Repeat for each toggle group you need (minimum 2, maximum 6).
4. Click “Save Changes”.
Step 3 — Verify on the Frontend
Visit the Add Listing page for the configured listing type. You should see the toggle switcher above the package cards. Clicking each toggle shows only the packages assigned to that group.
Example Setup
A restaurant directory with monthly and yearly billing options:
Toggle 1: Name = “Monthly” → Select the monthly Basic, Standard, and Premium package products. Check “Use as default toggle.”
Toggle 2: Name = “Yearly” → Select the yearly Basic, Standard, and Premium package products.
Result: Users see the Monthly packages by default. Clicking “Yearly” switches to show the yearly packages instead.
Important Rules
Assign every package: Any package not included in at least one toggle group will be permanently hidden on the frontend. Make sure every package is assigned to a toggle.
Minimum 2 toggles: The toggle UI will not render if fewer than 2 valid toggle groups exist. A single toggle has no purpose — users need at least two options to switch between.
Maximum 6 toggles: The animated slider supports up to 6 toggle options. Adding more may result in incorrect slider positioning.
One default toggle: If you check “Use as default toggle” on multiple toggles, only the last one will effectively be the default. If no default is set, the first toggle in the list is used automatically.
CSS Customization
The toggle slider automatically uses your MyListing theme’s accent color. If you want to customize the appearance further, you can add custom CSS to your child theme or via Appearance → Customize → Additional CSS.
Some common customizations:
/* Change toggle container max width */
.cmllpt-slide-container {
max-width: 500px;
}
/* Change toggle label font size */
.cmllpt-slide-container label {
font-size: 14px;
}
/* Change the slider pill appearance */
.cmllpt-slide-container a {
border-radius: 30px;
background-color: #f5f5f5;
}
/* Adjust spacing above packages */
.cmllpt-slide-container-app {
margin-bottom: 20px !important;
}Frequently Asked Questions
Does it work with claim listing packages?
Yes. Since v1.1.0, the plugin supports both standard listing packages and claim listing packages in the package selector.
Can I have different toggles for different listing types?
Yes. Each listing type has its own independent toggle configuration. You can have “Monthly / Yearly” for restaurants and “Basic / Premium” for hotels, for example.
What happens to packages I don’t assign to any toggle?
They will be hidden on the frontend. Always make sure every package is assigned to at least one toggle group.
Can I have just one toggle?
No. The toggle UI requires at least 2 groups to render. With only one group, there’s nothing to switch between, so the plugin does not display the toggle and all packages remain visible as normal.
Does it affect the “Switch Package” flow too?
Yes. The plugin activates on any page where MyListing’s listing type or listing ID URL parameters are present, which includes both the “Add Listing” and “Switch Package” flows.
Does the plugin affect site performance?
Minimal impact. The plugin loads a lightweight CSS file and outputs a small inline script only on pages with the relevant URL parameters. No database queries are made on the frontend beyond reading the plugin settings.
Can I assign a package to multiple toggle groups?
Yes. A package can appear in more than one toggle group if needed.
Troubleshooting
Toggles Not Appearing on the Add Listing Page
| Cause | Solution |
|---|---|
| Toggles not enabled | Check the “Enabled?” checkbox for the relevant listing type on the settings page. |
| Fewer than 2 toggle groups | You need at least 2 toggle groups configured with valid packages for the UI to render. |
| Packages don’t exist in DOM | The plugin validates that assigned packages exist on the page. If a WooCommerce product has been deleted, the toggle group may have no valid packages and gets filtered out. |
| Settings not saved | Make sure you clicked “Save Changes” after configuring your toggles. |
Some Packages Are Missing / Hidden
| Cause | Solution |
|---|---|
| Package not assigned to any toggle | Any package not included in at least one toggle group is hidden. Go to the settings page and ensure every package is assigned to a toggle. |
| WooCommerce product deleted | If the WooCommerce product for a package was deleted, the plugin can’t find it. Update your toggle configuration to remove the deleted package reference. |
Wrong Toggle Is Pre-Selected
| Cause | Solution |
|---|---|
| Multiple defaults checked | Only one toggle should have “Use as default toggle” checked. If multiple are checked, the last one takes effect. |
| No default set | If no default is set, the first toggle in the list is used automatically. Check the “Use as default toggle” box on your preferred toggle. |
Slider Animation Looks Wrong
| Cause | Solution |
|---|---|
| More than 6 toggles | The CSS slider only supports up to 6 toggle options. Reduce the number of toggle groups to 6 or fewer. |
“MyListing Theme Not Detected” Error
The MyListing theme must be installed and active. Go to Appearance → Themes to verify.
Settings Page Not Appearing
| Cause | Solution |
|---|---|
| MyListing not active | Install and activate the MyListing theme first. |
| Insufficient permissions | Only users with the manage_options capability (typically Administrators) can access the settings page. |
| Plugin not activated | Verify the plugin is active in Plugins → Installed Plugins. |
For further support, visit codicts.com or contact us at support@codicts.com.