Viewing 24 posts - 1 through 24 (of 24 total)
  • Author
    Posts
  • #284717

    Hey!

    I’m trying to disable the sticky/fixed & shrinking header (which I have applied via child theme options) for a single page. I know I can apply it via CSS, just not sure which class(es) to target.

    I’m assume it starts something like #top .page-id-xxxx #header_main .... but cannot get it to work.

    The header on the page I am trying to target is transparent as well (if that makes a difference).

    Thanks!

    – Cameron

    #284742

    Hi!

    Try with this:

    .page-id-xxx #header {
        position: static !important;
    }
    

    Cheers!
    Josue

    #285244

    Josue,

    Thanks for getting back to me.

    While this keeps the header in position, it kills the transparency effect (header background turns white) and the logo shrinks (as it would normally).

    As I start to scroll the first section (which lays under the navigation in header transparency mode) turns slowly white (some sort of animation set).

    How it looks without your code applied: http://s18.postimg.org/bxj7j74p5/Assessment_Product_Pricing_Thinkgate_2.jpg

    Top of page with your code applied: http://s23.postimg.org/3pxwgeakr/Assessment_Product_Pricing_Thinkgate_3.jpg

    #285398

    Try changing it to:

    .page-id-xxx #header {
        position: absolute !important;
    }
    #285402

    So that kept the navigation at the top (not sticky) but still shrunk the logo and adjusted the menu items. How can I get those to be completely stationary?

    Thanks,

    Cameron

    #285413

    Add this too:

    .page-id-xxx #header .logo img, .page-id-xxx #header_main .container, .page-id-xxx .main_menu > ul:first-child > li > a{
        height: 88px !important;
        line-height: 88px !important;
        max-height: 88px !important;
    }
    

    Regards,
    Josue

    #286270
    This reply has been marked as private.
    #286419

    Hi Cameron,

    Discard my previous suggestions, try adding this at the very end of your theme functions.php file instead:

    function add_custom_script(){
    if(is_page(9516)){
    ?>
    <script>
    jQuery(window).load(function(){
    	 jQuery('html').removeClass('html_header_sticky');      
    });
    </script>
    <?php
    }
    }
    add_action('wp_footer', 'add_custom_script');

    Regards,
    Josue

    #286421

    Added to my child theme’s functions.php file and it worked!

    Thanks for all of your help, Josue!

    – Cameron

    #286424

    You are welcome Cameron, always glad to help :)

    Regards,
    Josue

    #811578

    Hi Josue,

    This function works great thanks ! Unfortunetly I wanted to hide the sticky header to let some space to my secondary fullwidth menu but there is a transparent space above and I don’t know how to remove it ?

    When you arrive on the page it’s normal :
    screenshot of the page witou scrolling

    but when you scroll down the header disapear but not the space :
    screenshot of the page when you scroll down

    Thanks a lot,
    Clement

    #812926

    Hi Clement,

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    #813001

    Hi Victoria,

    Yes of course, I give you an acces in the private content section.

    Thanks a lot.

    Clement

    #813067

    Hi Clement,

    How are you hiding the sticky header, it’s still checked in your theme options, unckeck it there and see if that helps. The submenu thinks the header is still there.

    Best regards,
    Victoria

    #813071

    Hi Victoria,

    As I want to disable sticky header to specific pages I use the function gived by Josue above :

    function add_custom_script(){
    if(is_page(XXXX)){
    ?>
    <script>
    jQuery(window).load(function(){
    	 jQuery('html').removeClass('html_header_sticky');      
    });
    </script>
    <?php
    }
    }
    add_action('wp_footer', 'add_custom_script');

    And the fact that the sticky header is disable but the submenu think it’s still here is exactly my problem :)

    Thanks,
    Clement

    #813124

    Hi Clement,

    So you will take it from here? Or you still need our help?

    Best regards,
    Victoria

    #813125

    I need your help to fix the fact that the submenu believe the sticky header is still in place. I want it to realize that the sticky header is not there anymore.

    #813432

    Hi Blue_Bear,

    You need to uncheck the sticky header in the theme options and see if that will work for you.

    Best regards,
    Victoria

    #813438

    It’s not the solution cause when I do that the sticky header is disable on all my website and I want to do that just for 2 pages.

    • This reply was modified 7 years, 5 months ago by Blue_Bear.
    #813911

    Hi Blue_Bear,

    Can you give me the links to those 2 pages where the header needs not to be sticky?

    Best regards,
    Victoria

    #813919

    Yes of course i put them in private section.

    #815595

    Hi,

    The problem is that you might remove / hide it, but it is not actually been disabled.
    It is just been removed as an element, but the rest of the options are still there with any CSS classes.
    What you need to do is not as simple, I would suggest to consider hire a freelancer developer to help you with the issue properly

    Best regards,
    Basilis

    #815649

    I find a solution !!! *Yeah* It’s not perfect but do the job.

    I remove the function and I just add this CSS :

    .page-id-XX .header-scrolled {
    display:none!important;
    }

    So no need to hire a freelancer :)

    Anyway, thanks Victoria and Basilis for your help.

    Best regards,
    Clement

    #815743

    Hi Clement,

    Great, glad you found a solution and thanks for sharing it :-)

    Best regards,
    Rikard

Viewing 24 posts - 1 through 24 (of 24 total)
  • You must be logged in to reply to this topic.