add .current menu class for single posts
Javascript
window.addEventListener('DOMContentLoaded', function () {
var url = window.location.pathname;
var urlRegExp = new RegExp(url.replace(/\/$/, ""));
// media active
var isSinglePost = document.body.classList.contains('single-post');
var isSingleCaseStudy = document.body.classList.contains('single-case-studies');
if (isSinglePost) {
var mediaItem = document.querySelector('#menu-item-2888');
if (mediaItem) {
mediaItem.classList.add('current-menu-item');
}
}
if (isSingleCaseStudy) {
var mediaItem = document.querySelector('#menu-item-44');
if (mediaItem) {
mediaItem.classList.add('current-menu-item');
}
}
});
or functions.php
function add_current_menu_item_class() {
$classes = '';
if (is_singular('post')) {
$classes = 'current-menu-item';
$menu_item_id = 2888;
}
if (is_singular('case-studies')) {
$classes = 'current-menu-item';
$menu_item_id = 44;
}
?>
<script>
document.addEventListener('DOMContentLoaded', function() {
var mediaItem = document.querySelector('#menu-item-<?php echo $menu_item_id; ?>');
if (mediaItem) {
mediaItem.classList.add('<?php echo $classes; ?>');
}
});
</script>
<?php
}
add_action('wp_footer', 'add_current_menu_item_class');