MBT A-Z Listings Documentation

1. Installation

1. Download the MBT A-Z Listings plugin zip file
2. Log in to your WordPress admin panel
3. Navigate to Plugins → Add New
4. Click the Upload Plugin button at the top of the page
5. Click Choose File and select the plugin zip file
6. Click Install Now
7. After installation completes, click Activate Plugin
8. The plugin is now installed and activated

Whilst still in the plugins page, you can access the plugin’s settings directly from the plugin list by clicking the Settings link that appears under the plugin name, or follow the guidance provided in the next section.

2. Admin Configuration

After installation, you need to configure the plugin. Navigate to Settings → MBT A-Z Listings in your WordPress admin panel.

2.1. General Settings

This section allows you to configure the core functionality of the plugin:

1. Post Type: Select which post type MBT A-Z listings should use.
   You can choose from any available public post types including:
   • Posts
   • Pages
   • Custom post types (like Services, Jobs, etc.)
2. Support Numbers: Enable this option to include a “#” button in the A-Z list on the front-end – for posts that include the hash ‘letter’.
3. Default Letter: Choose which letter should be active by default when a user first views the page that the MBT A-Z listings shortcode is embedded in. Only letters that have associated posts will be available for selection.

2.2. Appearance Settings

This section allows you to customize the visual appearance of MBT AZ listings alphabet list:

1. Active State: Set colors for letters that have associated posts and can be clicked
   • Text Color
   • Background Color
   • Border Color
2. Inactive State: Set colors for letters that don’t have any associated posts
   • Text Color
   • Background Color
   • Border Color
3. Current State: Set colors for the currently selected letter
   • Text Color
   • Background Color
   • Border Color
4. Hover State: Set colors for when a user hovers over an active letter
   • Text Color
   • Background Color
   • Border Color
5. Button Padding: Set the padding for buttons to control their size. You can use any valid CSS unit (px, em, rem, etc.)

3. Using the Shortcode

To display the A-Z listing on any page or post, simply add the following shortcode:

[mbt_az_listings]

*NOTE: if you are embedding MBT AZ Listings, via a block – use the
shortcode block.

You can place this shortcode in:

• The content area of a page or post using the WordPress editor
• A text widget
• A template file using the WordPress do_shortcode() function:
  
  <?php echo do_shortcode('
  • A
  • B
  • C
  • D
  • E
  • F
  • G
  • H
  • I
  • J
  • K
  • L
  • M
  • N
  • O
  • P
  • Q
  • R
  • S
  • T
  • U
  • V
  • W
  • X
  • Y
  • Z
  '); ?>

When the shortcode is added, it will generate:

1. An alphabetical menu with all letters A through Z (plus “#” if enabled)
2. A results container that displays posts for the currently selected letter

4. Assigning Letters to Posts

For the A-Z listing to work correctly, you need to assign letters to your posts or custom post types. The plugin creates a “Letter” taxonomy for this purpose.

To assign a letter to a post:

1. Edit the post or custom post type entry.
2. Look for the “Letters” taxonomy box in the sidebar (similar to Categories).
3. Select the appropriate letter for the post (based on its first letter).
4. For posts that begin with numbers, enter hash if you’ve enabled number support.
5. Update or publish the post.

Important: Only letters with assigned posts will be active in the A-Z listing.

5. Styling and Customisation

While the plugin provides appearance settings for button colors and padding, you can further customize the MBT AZ Listings using CSS. The plugin uses the following CSS IDs and classes:

• #mbt-az-listings-menu: The container for the A-Z buttons
• #mbt-post-results: The container for post results
• .alphabet-link: All letter buttons
• .active: Letter buttons that have posts assigned
• .inactive: Letter buttons that don’t have posts assigned
• .current: The currently selected letter button

You can add custom CSS to your theme or through a custom CSS plugin to override these styles.

6. Mobile Responsiveness

The A-Z listing is designed to be responsive on mobile devices. On smaller screens, the letter buttons will adapt to fit the available space with a scrollable horizontal menu. This ensures the A-Z listing remains usable on smartphones and tablets.

7. Troubleshooting

No letters are active in the A-Z menu

• Verify you’ve assigned letters to posts through the “Letters” taxonomy
• Check that you’ve selected the correct post type in the plugin settings

The “#” button doesn’t appear

• Ensure you’ve enabled “Support Numbers” in the settings
• Assign at least one post to the hash letter taxonomy

Posts don’t show up when clicking a letter

• Verify the posts are published (not drafts)
• Check that the posts are properly assigned to the letter taxonomy
• Ensure your theme doesn’t have CSS that might hide the results

Changes to appearance settings don’t take effect

• Clear your browser cache
• Try disabling caching plugins temporarily

8. Support

For help and support with MBT A-Z Listings, please contact me.