A-Z index list of tags

http://codex.wordpress.org/Function_Reference/get_tags

might be your best bet.

Michael Fields

(@mfields)

This does exactly what you asked for. Just copy the code into a new file and save it as “t-tags.php” in your current themes directory. You will then need to log into WordPress, create a new page and apply the “Tags” Template to it. You may also need to change the html under “OUTPUT” to match your theme. Please don’t change anything under “Process” unless it makes sense to you 🙂

<?php
/*
Template Name: Tags
*/

	/* Process
	================================================= */
	$list = '';
	$tags = get_terms( 'post_tag' );
	$groups = array();
	if( $tags && is_array( $tags ) ) {
		foreach( $tags as $tag ) {
			$first_letter = strtoupper( $tag->name[0] );
			$groups[ $first_letter ][] = $tag;
		}
		if( !empty( $groups ) ) {
			foreach( $groups as $letter => $tags ) {
				$list .= "\n\t" . '<h2>' . apply_filters( 'the_title', $letter ) . '</h2>';
				$list .= "\n\t" . '<ul>';
				foreach( $tags as $tag ) {
					$url = attribute_escape( get_tag_link( $tag->term_id ) );
					$count = intval( $tag->count );
					$name = apply_filters( 'the_title', $tag->name );
					$list .= "\n\t\t" . '<li><a href="' . $url . '">' . $name . '</a> (' . $count . ')</li>';
					}
				$list .= "\n\t" . '</li>';
			}
		}
	}else $list .= "\n\t" . '<p>Sorry, but no tags were found</p>';

	/* OUTPUT
	============================= */
	get_header();
	?>
	<div id="container">
	<div id="main">
	<?php print $list; ?>
	</div>
	</div><!-- end main -->
	<?php
	get_sidebar();
	get_footer();
	?>

Thread Starter

(@baturica)

a great solution. Thank you very much. How do I make a separate page for each letter?

Thread Starter

(@baturica)

Was very simple. But another problem appeared. Turkish characters do not work. For example, ç, ı, ş

<?php
$tags = get_tags( array('name__like' => "ç", 'order' => 'ASC') );
foreach ( (array) $tags as $tag ) {
echo '<li><a href="' . get_tag_link ($tag->term_id) . '" rel="tag">' . $tag->name . ' </a></li>';
}
?>

Thread Starter

(@baturica)

Soryy! utf8 is no problem. Turkish character works very well

Thread Starter

(@baturica)

Was like a stylish 🙂

<ul>
<?php
$tags = get_tags( array('name__like' => "ç", 'order' => 'ASC') );
foreach ( (array) $tags as $tag ) {
echo '<li><a href="' . get_tag_link( $tag->term_id ) . '" title="' . sprintf( __( "View all posts in %s" ), $tag->name ) . '" ' . '>' . $tag->name.'</a></li>';
}
?>
</ul>

CodePoet

(@design_dolphin)

14 years, 8 months ago

Thank you for posting the code.

I wanted to add an interactive table of contents of tags to a sidebar. The code below adds a row of letters to the top of the index based on the tags that are present. The index letters link to each other. The tag names are linked as tags (so if you use for example a tag.php template file, then the links will open there.)

Example:

A B C D E F

A
Aardvark
Apple
etc…

Validation

The code is W3C validated, and also written for the visually impaired (as far as I know, please correct me if I am wrong). You will have to edit the heading (h4, h5) tags to fit the theme you are using, in order to keep the heading tags aligned in your theme.

Version
Wordpress 2.8
(You might be able to use it for earlier versions, not sure)

Code:

<?php

     $list = '';
	$tags = get_terms('post_tag' );
	$groups = array();
	if( $tags && is_array( $tags ) ) {
		foreach( $tags as $tag ) {
			$first_letter = strtoupper( $tag->name[0] );
			$groups[ $first_letter ][] = $tag;
		}
			if( !empty( $groups ) ) {{
          	$index_row .='<ul class="topindex">';
         foreach ($groups as $letter => $tags) {
           	$index_row .= '<li><h4><a href="#' . $letter . '" title="' . $letter . '">' . apply_filters( 'the_title', $letter ) . '</a></h4></li>';
		}
				$index_row .='</ul><br class="clear" />';} 

				 $list .= '<ul class="index">';
			 foreach( $groups as $letter => $tags ) {
            $list .= '<li><a name="' . $letter . '"></a><h5><a href="#tags_top" title="back to top">' . apply_filters( 'the_title', $letter ) . '</a></h5>';
				$list .= '<ul class="links">';
				foreach( $tags as $tag ) {
               $url = attribute_escape( get_tag_link( $tag->term_id ) );
					$name = apply_filters( 'the_title', $tag->name );
               $list .= '<li><a title="' . $name . '" href="' . $url . '">' . $name . '</a></li>';

	} 		 $list .= '</ul></li>';
			} 	$list .= '</ul>';
		}
	}else $list .= '<p>Sorry, but no tags were found</p>';

	?>
<a name="tags_top"></a>
<?php print $index_row; ?>
<?php print $list; ?>

Code for RSS feeds:

This is almost exactly the same thing except it creates feed links (for a rss feed tab):

<?php

     $list = '';
	$tags = get_terms('post_tag' );
	$groups = array();
	if( $tags && is_array( $tags ) ) {
		foreach( $tags as $tag ) {
			$first_letter = strtoupper( $tag->name[0] );
			$groups[ $first_letter ][] = $tag;
		}
			if( !empty( $groups ) ) {{
          	$index_row_rss .='<ul class="topindex">';
         foreach ($groups as $letter => $tags) {
           	$index_row_rss .= '<li><h4><a href="#' . $letter . '" title="' . $letter . '">' . apply_filters( 'the_title', $letter ) . '</a></h4></li>';
		}
				$index_row_rss .='</ul><br class="clear" />';} 

				 $list .= '<ul class="index">';
			 foreach( $groups as $letter => $tags ) {
            $list .= '<li><a name="' . $letter . '"></a><h5><a href="#tags_top" title="back to top">' . apply_filters( 'the_title', $letter ) . '</a></h5>';
				$list .= '<ul class="links">';
				foreach( $tags as $tag ) {
               $url = attribute_escape( get_tag_link( $tag->term_id ) );
					$name = apply_filters( 'the_title', $tag->name );
               $list .= '<li><a title="' . $name . '" href="' . $url . '/feed">' . $name . '</a></li>';

	} 		 $list .= '</ul></li>';
			} 	$list .= '</ul>';
		}
	}else $list .= '<p>Sorry, but no tags were found</p>';

	?>
<a name="tags_top"></a>
<?php print $index_row_rss; ?>
<?php print $list; ?>

CSS

This aligns the top row of letters into a horizontal line.

ul.topindex, .topindex li {display:inline;float:left;padding-right:5px}

Corrections/ improvements

Please feel to improve or correct where needed or wished for. Style as needed/ wanted.

hifa

(@hifa)

14 years, 6 months ago

Hi, I have created custom taxonomies with Yoast’s Simple taxonomies plugin
http://yoast.com/wordpress/simple-taxonomies/
. So how do I display those custom taxonomies in alphabetically order do you know ?
maybe following link also would be helpful
http://justintadlock.com/archives/2009/06/04/using-custom-taxonomies-to-create-a-movie-database

I’m not php expert, so I don’t know the way

Michael Fields

(@mfields)

14 years, 6 months ago

@hifa – You should be able to use one of the above pieces of code, but you will want to change this line $tags = get_terms('post_tag' ); to accept your custom taxonomy. Hypothetically, if you change ‘post_tag’ to the value of the “Label” you entered for your custom taxonomy, it should work.

gcarson

(@gcarson)

Hi.. trying to figure something out. What would be the code to see if it starts with a number? i tried ‘name__like’ => “num” or “number” but it didn’t seem to work. Any thoughts?

CodePoet

(@design_dolphin)

@hifa
Thank you for pointing me to that new feature. 🙂 Looks great. Lots of potential.

@mfields
From what I can figure out you are correct. Although it should be possible to fill the custom taxonomy name in automatically, haven’t figured that out, yet.

In order to direct the tag link in the TOC (Table of Contents) to taxonomy.php I had to rewrite the code. Otherwise the link will link to the tag.php template. This means in theory that if you have two custom taxonomies with two tags with the same name they would point to the same url.

Code:

<?php
	$list = '';
	$tags = get_terms('your_custom_taxonomy');
	$groups = array();

	if( $tags && is_array( $tags ) ) {
		foreach( $tags as $tag ) {
			$first_letter = strtoupper( $tag->name[0] );
			$groups[ $first_letter ][] = $tag;
		}

		if( !empty( $groups ) ) {
				{
				$index_row .='<ul class="topindex">';
				foreach ($groups as $letter => $tags) {
					$index_row .= '<li><h4><a              rel="nofollow" href="#' . $letter . '-folder" title="' . $letter . ' folder">' . apply_filters( 'the_title', $letter ) . '</a></h4></li>';
				}

				$index_row .='</ul><br class="clear">';
			}

			$list .= '<ul class="index">';
			foreach( $groups as $letter => $tags ) {
				$list .= '<li><a name="' . $letter . '-folder"></a><h5><a rel="nofollow" href="#tags_top" title="Back to index">' . apply_filters( 'the_title', $letter ) . '</a></h5>';
				$list .= '<ul class="links">';
				foreach( $tags as $tag ) {
					$url = attribute_escape(get_bloginfo('url') . '/' . $tag->taxonomy . '/' . $tag->slug);
					$name = apply_filters( 'the_title', $tag->name );
					$list .= '<li class="cat-item"><a rel="nofollow" title="' . $name . ' folder" href="' . $custom_taxonomy_parent . $url . '">' . $name . '</a></li>';
				}

				$list .= '</ul></li>';
			}

			$list .= '</ul>';
		}

	} else $list .= '<p>Sorry, but no tags were found</p>';
	?>
<a name="tags_top"></a>
<?php  print $index_row; ?>
<?php  print $list; ?>

Also ran the code since the previous code snippet through automatic WCAG 2.0 and section 507 tests. And the code passes. It should still pass, but please check to be sure. Improvements are definitely welcome

This is a beta code snippet, as I am still trying to understand the whole custom taxonomies, so there might be better ways to do it.

tugbucket

(@tugbucket)

http://wordpress.org/extend/plugins/multi-column-tag-map/

you might take a look at that as well. It might fit your needs.

CodePoet

(@design_dolphin)

My bad. Just noticed that in the previous code snippet I posted the following line has the variable $custom_taxonomy_parent which is not being used:

$list .= '<li class="cat-item"><a rel="nofollow" title="' . $name . ' folder" href="' . $custom_taxonomy_parent . $url . '">' . $name . '</a></li>';

This is the corrected code snippet:

<?php
	$list = '';
	$tags = get_terms('your_custom_taxonomy');
	$groups = array();

	if( $tags && is_array( $tags ) ) {
		foreach( $tags as $tag ) {
			$first_letter = strtoupper( $tag->name[0] );
			$groups[ $first_letter ][] = $tag;
		}

		if( !empty( $groups ) ) {
				{
				$index_row .='<ul class="topindex">';
				foreach ($groups as $letter => $tags) {
					$index_row .= '<li><h4><a              rel="nofollow" href="#' . $letter . '-folder" title="' . $letter . ' folder">' . apply_filters( 'the_title', $letter ) . '</a></h4></li>';
				}

				$index_row .='</ul><br class="clear">';
			}

			$list .= '<ul class="index">';
			foreach( $groups as $letter => $tags ) {
				$list .= '<li><a name="' . $letter . '-folder"></a><h5><a rel="nofollow" href="#tags_top" title="Back to index">' . apply_filters( 'the_title', $letter ) . '</a></h5>';
				$list .= '<ul class="links">';
				foreach( $tags as $tag ) {
					$url = attribute_escape(get_bloginfo('url') . '/' . $tag->taxonomy . '/' . $tag->slug);
					$name = apply_filters( 'the_title', $tag->name );
					$list .= '<li class="cat-item"><a rel="nofollow" title="' . $name . ' folder" href="' . $url . '">' . $name . '</a></li>';
				}

				$list .= '</ul></li>';
			}

			$list .= '</ul>';
		}

	} else $list .= '<p>Sorry, but no tags were found</p>';
	?>
<a name="tags_top"></a>
<?php  print $index_row; ?>
<?php  print $list; ?>

Please note that this is still a beta code snippet.

styzer

(@styzer)

This sounds like what I need…

I use a template called Arclite 2.02, on WP 2.8.6.

I am creating a website that would give artists their own page, and blog, with a media player for their music. I want the artists pages to automatically be ordered alphabetically for search and browsing convenience.

So far, I’ve not been able to visualize any of the process of creating a tag.php page or any other such codes/plugin. It would be great to find step by step instructions, I’m a bit limited in that area.

I thought if I could tag pages (mydomain.com/lastname-firstname), then it could sort alphabetically. But tags seem to only apply to posts. Same with categories.

I copy/pasted the code by design-dolphin and created a t-tag.php file. I uploaded it in my template folder via FTP. I went to create a page but could not find any “tags” template.

What am I missing?

Cheers!

Andre

p.s. The site is: http://www.soakingplanet.com

All content on the first page here is basically copy/pasted from another of my sites. I want this new site to be the artists site instead.

If you look on the menu, my name is there. That would be an artist name, leading to an artist page. But that would make it impossible for a menu to make sense with over 50 artists. Help!

henri

(@riri23)