A-Z Hyperlink

  • So my website looks like this: https://www.animefade.com/anime-list/ — as you can see, each category is listed A-Z, neatly. However, there is no clear way, other than scrolling, to go to the letter I want. I found a website that has what I want: https://www.animerelief.com/animelist.php — As you can see, they have the list of categories the same way as I. However, above that, they have #-Z — which lets someone who wants to go to that letter, click the letter, and be automatically taken down to it.

    So I’m asking: How do I do that with WordPress?

Viewing 1 replies (of 1 total)

  • You can use anchor tags to do this.

    Create your A – Z index by collecting all the unique first letters of your posts into an array. Change the $sql query string to match your needs:

    <?php $sql = "
SELECT DISTINCT UPPER(SUBSTR(post_title,1,1)) AS first_letter
FROM $wpdb->posts
WHERE post_type = 'post'
AND post_status = 'publish'
AND post_date <= NOW()
ORDER BY first_letter ASC
";
$letters = $wpdb->get_col($sql);
?>
<div class="alpha-index">
<?php foreach($letters as $letter) {
  echo "<a class=\"alphalist\" href=\"#$letter\">$letter</a> ";
} ?>
</div>

    Then at the proper place in your loop, create an anchor tag for each letter. Set the variable $this_char to the first letter of the title and output your anchor tag like this:

    echo "<p><a name='$this_char'></p>";
Viewing 1 replies (of 1 total)
  • The topic ‘A-Z Hyperlink’ is closed to new replies.

Tags