Dani Llewellyn

The plugin doesn’t provide any way to display only partial listings. You can potentially modify the template, or use javascript to hide the “other” letters. Perhaps some javascript like this will work, though it’s untested?

function hide_azlisting_sections() {
    if ( typeof window.location.hash !== "undefined" ) {
        const elements = document.getElementsByClassName( 'letter-section' );
        for ( const element of elements ) {
            element.style.display = 'none';
        }

        const active_letter = document.getElementById( window.location.hash.substring( 1 ) );
        active_letter.style.display = 'initial';
    }
}

if (document.readyState === "loading") {
    document.addEventListener( 'DOMContentLoaded', hide_azlisting_sections);
} else {
    hide_azlisting_sections();
}

Hi @coolerhase59,

From the image it looks like you have some CSS rules that are causing the listing elements to float: left, which results in them stacking weirdly. This CSS will be either from your theme or another plugin. Try using the health-check plugin to turn off other plugins and test against a “twenty*” theme such as twentyseventeen. Once you isolate where the CSS is coming from we can think about whether it is feasible to remove or override the rogue styles.

While PHP notice messages are not necessarily indicative of a problem I’d still like to understand the reason for it. There should be a bit more to the message before the path to class-a-z-listing-widget.php, which should tell us a bit more about why it is notifying us.

I’m adding a bit of margin to the bottom of each entry to provide vertical separation in the next version.

The a-z-listing.php template is specific to my plugin, so renaming an existing page template won’t work correctly (or at all). If you need a custom page template and you need to customise the output from my plugin, then you will need two template files: one for your page to wrap around the plugin, and the other to customise the plugin output (it is this second one that is called a-z-listing.php).

After updating to 2.0.* you should re-save your widget settings to ensure that it is correctly referencing the page you want links to point at. I recommend selecting a random page from the widget configuration and then re-selecting the correct page before hitting save. This will ensure that any wonkiness should be eliminated. If it still doesn’t point at the page once you’ve done that I’ll need to take another look.

Thanks for picking this up, @yashitamittal11 🙂

That code should indeed change the letters to the colour #2e0819. Also, there are two other colours that might need adjusting: the border and the background. These can be added to the CSS that Yashitamittal11 posted (a complete example including that code is below):

.az-letters ul.az-links li,
.a-z-listing-widget .az-letters ul.az-links li,
.a-z-listing-widget.widget .az-letters ul.az-links li {
    background-color: #000000; /* example only */
    border-color: #ff0000; /* another example only */
}
.az-letters ul.az-links li a,
.a-z-listing-widget .az-letters ul.az-links li a,
.a-z-listing-widget.widget .az-letters ul.az-links li a {
    color: #2e0819; /* the colour you suggested */
}

Feel free to play with the colours to adapt the style to your theme. Provided that your CSS is loaded in the HTML page below the CSS that the plugin ships then your code will override the plugin. 🙂

I’ll add some clarification to explain the relationship between taxonomy and category in the readme.txt for the next version, which will also update the plugin entry on WordPress.org.