How do I hide/show certain elements/divs if URL contains a specific string?

Question

I have a large set of pages (page1/) that need to show a certain navigation bar and a second large set of pages (page2/) that need to show a different navigation bar in its place.

I have tried various jQuery to identify if the URL contains a certain word and, if it does, show the corresponding navigation bar - but with no success.

Below is the jQuery I've tried.

<script>
if(strpos($url ,'page1/') !== FALSE) {
echo '#page1-navigation-bar';
}
if(strpos($url ,'page2/') !== FALSE){
echo '#page2-navigation-bar';
}
</script>

This has no effect and I'm not sure whether this is because the coding is wrong, I've inputted it in the wrong place, I need to do something else as well as this coding or a combination of everything plus more.

Also not sure if this will hide one when showing the other?

Please help by stating any code needed and where exactly this needs inputting.

Thanks, Michael

Just use `` tags. https://stackoverflow.com/questions/19953483/php-end-tag — Adam, Jan 28 '19 at 13:33
@Adam Thanks Adam, but I'd already tried that in functions.php and it has no effect. Any thoughts as to where I'm going wrong? — Michael Elliott, Jan 28 '19 at 14:13
If you're inside of functions.php, you most likely will not need to add the opening and closing php tags. Simply insert your above code minus the ` — Adam, Jan 28 '19 at 14:16
@Adam Thanks, I had formatted it correctly but still nothing. I have, in CSS, #page1-navigation-bar {display: none;} and just require it to be shown when the URL contains "page1/" — Michael Elliott, Jan 28 '19 at 14:32

score 0 · Answer 1 · answered Jan 28 '19 at 16:28

0

Maybe try like this in PHP:

<?php 

$page = array("page1/" /*, "page2/", "page3/", "all other pages" */ );    
if(in_array(strpos($url, $page))

{echo '#page1-navigation-bar';}

        else

{echo '#page2-navigation-bar';}

?>

answered Jan 28 '19 at 16:28

WebSon

501
4
11

thanks so much for your answer. However, I'm receiving the following error from it: "Parse error: syntax error, unexpected 'echo' (T_ECHO)" Any ideas? Thanks – Michael Elliott Jan 28 '19 at 18:44

score 0 · Answer 2 · answered Jan 28 '19 at 16:59

There are a couple ways you can go about this. You can do as WebSon has suggested but with a different approach, you can do it via page templates, or you can do it with custom post metas. Now note, while you're doing something with "ID's," I suggest you change the navigation displayed using wp_nav_menu().

One method with a suggested conditional, instead of ID's.

<?php

$first_array = [ 'page1', 'page3', 'page5' ];
$second_array = [ 'page2', 'page4', 'page6' ];
$wp_nav_args = [ //your default args ];

if ( is_page($first_array ) ) {
 // Change the entire array or parts of it.
 $wp_nav_args = [];
}
elseif ( is_page($second_array) ) {
 // Change the entire array or parts of it.
 $wp_nav_args = [];
}

wp_nav_menu($wp_nav_args);

Page Templates

<?php

$wp_nav_args = [ //your default args ];

if ( is_page_template('template-menu-a') ) {
 // Change the entire array or parts of it.
 $wp_nav_args = [];
}
elseif ( is_page_template('template-menu-b') {
 // Change the entire array or parts of it.
 $wp_nav_args = [];
}

wp_nav_menu($wp_nav_args);

More complicated way, which doesn't include templates, yet is extendable.

Just wanted to share this way, as you can use this for a few other things as well, by creating custom post metas. This example shows a checkbox in the Update/Publish box.

<?php 

function add_custom_meta_field() {

    $post_id = get_the_ID();

    if ( get_post_type( $post_id ) !== 'page' ) {
        return;
    }

    $value = get_post_meta( $post_id, '_navigation_b', true );
    ?>
    <div class="misc-pub-section misc-pub-section-last">
        <input type="checkbox" value="1" <?php checked( $value, true, true ); ?> name="_navigation_b" id="_navigation_b" /><label for="_navigation_b"><?php _e( 'Add To Your Calendar Icons', 'navy' ); ?></label>
    </div>
    <?php
}

add_action( 'post_submitbox_misc_actions', 'add_custom_meta_field' );


function save_custom_meta_field() {

    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
        return;
    }

    if ( ! current_user_can( 'edit_post', $post_id ) ) {
        return;
    }
    if ( isset( $_POST['_navigation_b'] ) ) {
        update_post_meta( $post_id, '_navigation_b', $_POST['_navigation_b'] );
    } else {
        delete_post_meta( $post_id, '_navigation_b' );
    }
}
add_action( 'save_post', 'save_custom_meta_field' );

How do I hide/show certain elements/divs if URL contains a specific string?

2 Answers2

One method with a suggested conditional, instead of ID's.

Page Templates

More complicated way, which doesn't include templates, yet is extendable.