Bootstrap Tabs PHP code blocking active tab change - Wordpress

Question

I'm working on a navigation menu for my wordpress template, i'm using bootstrap 3 tabs in the header, but when i call function get_permalink( $page_name_id ) for <a href =""> tags in the <li> elements tabs getting stuck, but when I remove php code tabs are working.

My question is how I can get this tabs changing when I click on them and PHP code could return link of selected page?

Here is code from header :

<ul class="nav nav-tabs" id="myTab" style = "font-size:12px;">
    <li class="active tab"><a href = "<?php echo wt_get_ID_by_page_name('home'); ?>" data-toggle="tab" >Home</a></li>
    <li class="tab"><a href = "<?php echo wt_get_ID_by_page_name('about'); ?>" data-toggle="tab" >About</a></li>
    <li class="tab"><a href = "<?php echo wt_get_ID_by_page_name('products'); ?>" data-toggle="tab" >Products</a></li>
    <li class="tab"><a href = "<?php echo wt_get_ID_by_page_name('contact'); ?>" data-toggle="tab" >Contact</a></li>
</ul>

function wt_get_ID_by_page_name it's hard coded function get_permalink by page_name_id, it returns just permalink by page name.

here is code :

function wt_get_ID_by_page_name($page_name)
{
    global $wpdb;
    $page_name_id = $wpdb->get_var("SELECT ID FROM $wpdb->posts WHERE post_name = '".$page_name."'");
    return $permalink = get_permalink( $page_name_id );
}

score 0 · Answer 1 · answered Feb 24 '14 at 22:46

So, if you need PHP to select the active tab, you need to do some checking and decide whether or not to put the active class into the LI, similar (but not necessarily exactly) like the following:

$url = $_SERVER['REQUEST_URI']; ?>

<li class='tab<?php echo $url == echo wt_get_ID_by_page_name('home') 
    ? ' active' : '' ?>'>...

If I misunderstood your question, let me know.

Bootstrap Tabs PHP code blocking active tab change - Wordpress

1 Answers1