Toggle Bar Text

  • danbailan

    #8100

    Is there a way to change the text on the toggle bar text according to what page/widget in the slide panel you are on.

    I am using custom menus in the slide panel widget with a dynamic widget plug-in and this style works perfectly for my site, meaning I can have different menus for different areas of the site. I can change the color of the toggle bar using css according to the pages, but would love to able to also change the text as you move through the site – in effect to give it the same name as the custom menu..

    Thanking you in advance for any help.

    Admin

    Syahir Hakim

    #40335

    Something like this will work (code goes into GM Neo’s child theme’s functions.php file):

    /**
    * Customise toggle bar text per different areas of site
    */
    function my_custom_toggle_bar_text(){
    global $gmneo_settings;

    if ( is_category( 'bla-bla' ) ) { // Your conditional here to target specific areas in your site
    $gmneo_settings['slide_panel_bar_text'] = 'Your custom toggle bar text for this area';
    }
    }
    add_action( 'template_redirect', 'my_custom_toggle_bar_text' );

    danbailan

    #40336

    Many thanks for this

    Just starting to implement it now, it looks like it is working perfectly. Thank you.

    One weird thing, however, that I have noticed:-

    It stops the graphics-based fallback for icon fonts usage for non-supported browsers (e.g. IE9 Mobile and older) from appearing. This is only on the toggle text bar and not on the select menu AND it only happens on the pages where I apply the conditional function. So on the homepage where I am using options selected as per the gmneo general and colors, the icon is there (arrow and 3 bars). Weird.

    This is the code I am using and this will increase.

    <?php
    /**
    * Customise toggle bar text per different areas of site
    */
    function my_custom_toggle_bar_text(){
    global $gmneo_settings;

    if ( is_page( '68' ) ) { // Your conditional here to target specific areas in your site
    $gmneo_settings['slide_panel_bar_text'] = 'Koh Chang';
    }
    if ( is_page(array('3520','196','713','3526','691','693','496','363','3447','6111',)) ) { // Your conditional here to target specific areas in your site
    $gmneo_settings['slide_panel_bar_text'] = 'Explore (Koh Chang)';
    }
    if ( is_page(array('3523','3435')) ) { // Your conditional here to target specific areas in your site
    $gmneo_settings['slide_panel_bar_text'] = 'Sleep (Koh Chang)';
    }
    }
    add_action( 'template_redirect', 'my_custom_toggle_bar_text' );
    ?>

    Thanks

    Admin

    Syahir Hakim

    #40338

    Can you provide a link to one of the pages where this is happening?

    danbailan

    #40339

    The homepage is fine explorekohchang.com.

    The first page where i change the text and the subsequent others where I apply the conditional, explorekohchang.com/the-koh-chang-archipelago/koh-chang/ have the symbols missing.

    This seems to only be in non-supported browsers.

    Many thanks.

    Admin

    Syahir Hakim

    #40340

    You have this code in your GM Neo’s child theme:

    .page-id-68 .side-panel-toggle, .page-id-196 .side-panel-toggle, .page-id-230 .side-panel-toggle, .page-id-274 .side-panel-toggle, .page-id-353 .side-panel-toggle, .page-id-357 .side-panel-toggle, .page-id-363 .side-panel-toggle, .page-id-496 .side-panel-toggle, .page-id-691 .side-panel-toggle, .page-id-693 .side-panel-toggle, .page-id-697 .side-panel-toggle, .page-id-713 .side-panel-toggle, .page-id-3425 .side-panel-toggle, .page-id-3435 .side-panel-toggle, .page-id-3447 .side-panel-toggle, .page-id-3450 .side-panel-toggle, .page-id-3455 .side-panel-toggle, .page-id-3520 .side-panel-toggle, .page-id-3523 .side-panel-toggle, .page-id-3526 .side-panel-toggle, .page-id-3529 .side-panel-toggle, .page-id-3546 .side-panel-toggle, .page-id-3549 .side-panel-toggle, .page-id-3552 .side-panel-toggle, .page-id-3555 .side-panel-toggle, .page-id-3558 .side-panel-toggle, .page-id-3561 .side-panel-toggle, .page-id-3564 .side-panel-toggle, .page-id-3568 .side-panel-toggle, .page-id-3571 .side-panel-toggle, .page-id-3574 .side-panel-toggle, .page-id-3577 .side-panel-toggle, .page-id-3580 .side-panel-toggle, .page-id-3582 .side-panel-toggle, .page-id-3583 .side-panel-toggle, .page-id-3589 .side-panel-toggle, .page-id-3592 .side-panel-toggle, .page-id-3595 .side-panel-toggle, .page-id-3601 .side-panel-toggle, .page-id-3598 .side-panel-toggle, .page-id-5256 .side-panel-toggle, .page-id-5561 .side-panel-toggle, .page-id-5374 .side-panel-toggle, .page-id-5398 .side-panel-toggle, .page-id-5400 .side-panel-toggle, .page-id-5405 .side-panel-toggle, .page-id-5407 .side-panel-toggle, .page-id-5412 .side-panel-toggle, .page-id-5422 .side-panel-toggle, .page-id-5424 .side-panel-toggle, .page-id-5436 .side-panel-toggle, .page-id-5777 .side-panel-toggle, .page-id-5939 .side-panel-toggle, .page-id-5959 .side-panel-toggle, .page-id-6111 .side-panel-toggle, .page-id-6114 .side-panel-toggle, .page-id-6254 .side-panel-toggle, .page-id-6256 .side-panel-toggle, .page-id-6284 .side-panel-toggle, .page-id-6702 .side-panel-toggle, .page-id-6744 .side-panel-toggle, .page-id-6943 .side-panel-toggle, .page-id-7235 .side-panel-toggle, .page-id-7377 .side-panel-toggle, .page-id-9062 .side-panel-toggle, .page-id-9098 .side-panel-toggle, .page-id-9644 h3.section-title, .page-id-9674 .side-panel-toggle, .page-id-9715 .side-panel-toggle, .page-id-13314 .side-panel-toggle, .page-id-13398 .side-panel-toggle {
    background: none repeat scroll 0 0 #769144;
    }

    Use this instead:

    background-color: #769144;

    danbailan

    #40341

    Thanks, Syahir.

    Simple when you know how – I have come across the different behaviours for css with background/background color before, but would not have thought here.

    Perfect. Thank you.

    Admin

    Syahir Hakim

    #40342

    You’re welcome. Marking this thread as resolved then (you can also do this yourself next time).

    danbailan

    #40343

    Hi Syahir,

    I am using genericons font again on a <h> tag on various pages, but have looked and looked at how to put in the fallback for IE9 and older but to no avail. It is not urgent but any hints would be much appreciated.

    An example page is here towards the bottom – related travel pages is the <h>.

    Air | Travel | Koh Chang

    Many thanks for any guidance.

    Admin

    Syahir Hakim

    #40344

    Unfortunately there is no easy solution to this. You would need to use an image instead of genericon for it to be displayed in IE9. Simple enough solution, but will quickly get very tedious if you use Genericons in lots of places.

Viewing 10 posts - 1 through 10 (of 11 total)

You must be logged in to reply to this topic.