Home Forums HashOne Nav bar not fixed on pages other than the home page

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #3250
    MrMarqua
    Participant

    Hi there. How to i take the menu style that is present on the home page through to all the additional web pages i create using this theme.

    It seems on the home, the nav is an animated Fixed menu with opacity (rgba) but on other pages it scrolls away when the user scrolls down the page.

    How can i maintain the style of the home page nav through to the rest of the site.

    thanks

    #3266
    Hash
    Keymaster

    Hi,

    The theme is designed in the way that it is now. If you want to change any thing apart from it then it requires change in code.

    So to change the navbar style, it requires change in code in multiple places and it would be difficult to explain over here.

    Thanks

    #3297
    MrMarqua
    Participant

    Thanks for getting back to me.
    I am going to try work a solution to attach position:fixed to one of the other classes and hope it doesnt cause conflicts.

    Or try talk the client out of this change…

    Have an awesome day forward
    p

    #3353
    MrMarqua
    Participant

    Hi there, ok so my client is insisting on navigation consistancy on their site, which makes logical sense.
    I will need to make the menu position fixed across all pages. Please can you explain to me which php files i need to add a class too.
    I know you said in your reply above that its a long process, but please can i get some help on this.

    #3565
    Hash
    Keymaster

    You need to edit and add CSS in style.css to make the menu sticky across all pages.

    #4663
    paoloz
    Participant

    Hi MrMarqua there are just a couple of files to edit. Better do this in a child theme though. In the js folder, hashone-custom.js file, you need to add the classes of the pages where there’s not the sticky effect.
    In the window.scroll function, change the following line from this:
    $('.page-template-home-template #hs-masthead, .home.blog #hs-masthead')
    to this
    $('.page-template-default #hs-masthead, .page-template-home-template #hs-masthead, .home.blog #hs-masthead, .blog #hs-masthead')

    Then, do the same on the style.css of the theme, adding
    .page-template-default and .blog to the three sections of #masthead starting at line 1152.

       .page-template-default #hs-masthead,
       .blog #hs-masthead,

    and

       .page-template-default #hs-masthead.fadeInDown,
       .blog #hs-masthead.fadeInDown,

    and

       .page-template-default #hs-masthead.hs-black.fadeInDown,
       .blog #hs-masthead.hs-white.fadeInDown,

    In this last block, I changed to hs-black (instead of white) for readability, as the menu’s text is white.

    Hope this helps.
    Paolo
    P.S. How did I do it? inspected elements and TextWrangler.

    #4674
    deragoth
    Participant

    thx dude, great job!

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.
Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!Merry Christmas & Happy New Year!!
CHRISTMAS SALE ! 🎁🎁 Enjoy 30% OFF 🔖 Use Coupon CodeHOLIDAY at checkout.