This is the code I get from here, but I don’t remember the exact page, and this is my working page of letter B on my website (using the same code as you see below)
<?php
/*
Template Name: Locali per lettera
A WordPress template to list page titles by first letter.
You should modify the CSS to suit your theme and place it in its proper file.
Be sure to set the $posts_per_row and $posts_per_page variables.
*/
$posts_per_row = 3;
$posts_per_page = -1;
$pageURL = 'http';
$post_type="post";
if ($_SERVER["HTTPS"] == "on") {$pageURL .= "s";}
$pageURL .= "://";
if ($_SERVER["SERVER_PORT"] != "80") {
$pageURL .= $_SERVER["SERVER_NAME"].":".$_SERVER["SERVER_PORT"].$_SERVER["REQUEST_URI"];
} else {
$pageURL .= $_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"];
}
$letters = $wpdb->get_col(
"SELECT DISTINCT LEFT(post_title,1) AS first_letter FROM $wpdb->posts
WHERE post_type="$post_type" AND post_status="publish"
ORDER BY first_letter ASC"
);
$first_letter = ($_GET['first_letter']) ? $_GET['first_letter'] : $letters[0];
?>
<?php get_header(); ?>
<style type="text/css">
.letter-group { width: 100%; border-top: 1px solid #444; }
.navigation { text-align: center; padding:5px; margin: 0 10px;}
.letter { display:inline; color:#DDD;text-align: center; padding: 2px; border-top: 1px solid #48465B; border-left: 1px solid #48465B; background: #18181C; margin: 0 1px;}
.letter a{ color:#DDD;}
.letter-cell { width: 5%; color:red; font-weight:bold; height: 2em; text-align: center; padding-top: 8px; margin-bottom: 8px; border-top: 1px solid #48465B; background: #18181C; float: left; }
.row-cells { width: 94%; float: right; }
.title-cell { width: 33%; float: left; overflow: hidden; margin-bottom: 8px; }
.alignleft {
float: left;
margin-left: 25px;
}
.alignright {
float: right;
margin-right: 25px;
}
.clear { clear: both; }
div#a-z .padder {
border-right: none;
margin-right: none;
padding: 20px 40px;
}
</style>
<div id="main-background">
<div id="main-column">
<br />
<h2><?php the_title(); ?></h2>
<div class="margin-top"></div>
<div id="a-z">
<?php
$mam_global_where = " AND LEFT(post_title,1) = '$first_letter' ";
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array (
'posts_per_page' => $posts_per_page,
'post_type' => $post_type,
'orderby' => 'title',
'order' => 'ASC',
'paged' => $paged,
'caller_get_posts' => 1
);
query_posts($args);
$mam_global_where=""; // Turn off filter
if ( have_posts() ) {
$in_this_row = 0;
while ( have_posts() ) {
the_post();
$first_letter = strtoupper(substr(apply_filters('the_title',$post->post_title),0,1));
if ($first_letter != $curr_letter) {
if (++$post_count > 1) {
end_prev_letter();
}
start_new_letter($first_letter);
$curr_letter = $first_letter;
}
if (++$in_this_row > $posts_per_row) {
end_prev_row();
start_new_row();
++$in_this_row; // Account for this first post
} ?>
<div class="title-cell"><a href="https://wordpress.stackexchange.com/questions/105633/<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"> <?php the_title(); ?></a></div>
<?php }
end_prev_letter();
?>
<div class="navigation">
<?php
foreach ($letters as $letter) {
$url = add_query_arg('first_letter',$letter,$pageURL);
echo "<div class="letter">";
echo "<a href="$url" title="Starting letter $letter" > $letter </a>";
echo "</div>";
}
?>
</div>
<?php } else {
echo "<h2>Sorry, no posts were found!</h2>";
}
?>
</div><!-- End id='a-z' -->
</div><!-- End class="margin-top -->
</div><!-- End id="rightcolumn' -->
<?php
function end_prev_letter() {
end_prev_row();
echo "</div><!-- End of letter-group -->\n";
echo "<div class="clear"></div>\n";
}
function start_new_letter($letter) {
echo "<div class="letter-group">\n";
echo "\t<div class="letter-cell">$letter</div>\n";
start_new_row($letter);
}
function end_prev_row() {
echo "\t</div><!-- End row-cells -->\n";
}
function start_new_row() {
global $in_this_row;
$in_this_row = 0;
echo "\t<div class="row-cells">\n";
}
?>