title: Filtering a Query by custom field first letter - Wordpress
body: <p>I'm working on a directory staff listing. I went to a custom solution because plugins for this purpose were too complex or too simple for what I was looking for.
  So I created this custom post type "staff" with custom taxonomies attached as well to it(Science, Mathematics, Administration, etc) so I have a query where I get all those posts listed in a table, my code looks as follows.</p>
  
  <pre><code>&lt;table class="directorytable"&gt;
     &lt;thead&gt;
        &lt;th class="first-th"&gt;Portrait&lt;/th&gt;
        &lt;th&gt;Name&lt;/th&gt;
        &lt;th&gt;Position&lt;/th&gt;
        &lt;th&gt;Phone&lt;/th&gt;
        &lt;th style="width:60px !important;text-align:center;"&gt;Email&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;/th&gt;
        &lt;th style="width:60px !important;text-align:center;"&gt;Website&amp;nbsp;&amp;nbsp;&lt;/th&gt;
        &lt;th style="width:60px !important;text-align:center;"&gt;Details&amp;nbsp;&amp;nbsp;&lt;/th&gt;  
     &lt;/thead&gt;
  &lt;?php query_posts(array('post_type'=&gt;'staff','orderby'=&gt;'meta_value','meta_key'=&gt;'staff_last_name','order'=&gt;'asc'))?&gt;
  &lt;?php while(have_posts()): the_post();?&gt;
  
  &lt;tr&gt;
      &lt;td class="first-td"&gt;&lt;a rel="lightbox" href="&lt;?php the_permalink(); ?&gt;"/&gt;&lt;img src="&lt;?php the_field('staff_portrait');?&gt;" style="border-radius:2px; width:35px;"/&gt;&lt;/a&gt;&lt;/td&gt;
  &lt;td&gt;&lt;a rel="lightbox[1]" href="&lt;?php the_permalink();?&gt;"&gt;&lt;?php the_field('staff_name');?&gt; &lt;?php the_field('staff_last_name');?&gt;&lt;/a&gt; &lt;/td&gt;
  &lt;td&gt;&lt;?php the_field('staff_position'); ?&gt;&lt;/td&gt;
  &lt;td&gt;&lt;?php the_field('staff_phone');?&gt; | &lt;strong&gt;Ext: &lt;/strong&gt;&lt;?php the_field('staff_extension')?&gt;&lt;/td&gt;
  &lt;td style="width:60px; text-align:center;"&gt;&lt;a href="mailto:&lt;?php the_field('staff_email');?&gt;"&gt;&lt;img src="/images/directory/mail.png"/&gt;&lt;/a&gt;&lt;/td&gt;
  &lt;td style="width:60px; text-align:center;"&gt;&lt;?php if(get_post_meta($post-&gt;ID,'staff_website', true)){?&gt;&lt;a target="_blank" href="&lt;?php the_field('staff_website');?&gt;"&gt;&lt;img src="/images/directory/document-globe.png"/&gt;&lt;/a&gt;&lt;?php } else {?&gt;&lt;?php echo '';?&gt;&lt;?php } ?&gt;&lt;/td&gt;
  &lt;td style="width:60px; text-align:center;"&gt;&lt;a rel="lightbox[2]" href="&lt;?php the_permalink();?&gt;"&gt;&lt;img src="/images/directory/magnifier-zoom.png"/&gt;&lt;/a&gt;&lt;/td&gt;
  &lt;/tr&gt;   
  &lt;?php endwhile; ?&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>So this list is working very nicely, but my client requested me to add an alphabet index. So I will need a range a-z listed before results and then on clicking, show only the posts that their "staff_last_name" custom field (I'm using ACF) begins with the chosen letter.</p>
  
  <p>I have tried with some plugins like AZIndex, WP-Snap, etc, but none of those worked for me.</p>
  
  <p>I'd appreciate any recommendation / solution for this matter.</p>