, LLC.

Highlight Current WordPress  Post

I came across a dilemma recently. I wanted to highlight the WordPress post that is currently shown in my sidebar menu. I couldn’t find a sound solution for this, so here’s what I came up with. Using JavaScript and jQuery 1.2.3 I was able to highlight the current post in the WordPress navigation, or sidebar by dynamically adding the class “current” to the anchor tag.

JavaScript / jQuery

$(document).ready(function() {
	// Your base URL
	var baseUrl = "";
	// You need to target your sidebar here, change #secondaryContent to your sidebar identifier (id)
	$("#secondaryContent a").each(function(){
		var href = $(this).attr('href').replace(baseUrl,'');
		if (href == document.location.pathname) {


#secondaryContent .current
	background:url(images/current-link.gif) 0 4px no-repeat;


First include your copy of jQuery within the HEAD section of the document. Next include the above snippet of JavaScript in your document. Let the script do the rest.


Be sure to modify the baseUrl variable, making it equal to your domain name. Without this the script will NOT function.

Related links

Meet the Author

Kevin Leary, WordPress Consultant

I'm a freelance web developer and WordPress consultant in Boston, MA with 16 years of experience building websites and applications. View a portfolio of my work or request an estimate for your next project.