Copy the following JavaScript into notepad and save it as a .txt file.
function qs(paramName) { var args = document.location.search.substring(1).split("&"); for(j = 0; j < args.length; j++) { nameValues = args[j].split("="); if(nameValues[0] == paramName) return nameValues[1]; } return null; } var filterField = "FL"; var filterValuesDelimiter = " | "; var filterValues = new Array ("0-9","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"); var selectedValueStyle = "font-weight: bold;"; var filterDivStyle = "margin: 5px; font-size: 15px;"; var filterLinks = new Array(); for (var i = 0; i < filterValues.length; i++) { filterLinks.push('<a>' + filterValues[i] + '</a>'); } document.write(' <div>' + filterLinks.join (filterValuesDelimiter) + ' | ' + '<a>' + 'All</a>' + '</div> ');
Upload this text doc to the Site Assets library.
Create a calculated column on the library you want to filter and name it “FL”. Add this to the Formula field:
=IF(ISNUMBER(INT(LEFT(Title,1))),"0-9",LEFT(Title,1))
Add a Content Editor web part to the page and open up the settings. In the Content Link field, paste the URL for the text file you uploaded earlier.
Click Apply to confirm that the filter shows up correctly on the page. Also make sure you change the Chrome Type under Appearance to “None”.
Save the page and test the filter.