Jump to content

Archived

This topic is now archived and is closed to further replies.

sblentlinger

Hooks in fixed Navbar display off screen when the browser is resized or in mobile display

Recommended Posts

sblentlinger    0
sblentlinger

Hi, I am trying to use hooks in Pagelines DMS to offset a 'Login' link, a 'Sign Up' button, and a 'Contact' text on the Fixed Navbar.  It looks fine when the browser is at least the width of the full website:

 

[attachment=1878:Screen Shot 2014-01-03 at 2.05.00 PM.png]

 

However, when resizing the browser or viewing my site on mobile it seems to create a new section off the page for the hooks:

[attachment=1879:Screen Shot 2014-01-03 at 2.05.12 PM.png]

 

My website is currently on a staging server, and can be accessed at payline.staging.wpengine.com 

 

I would ideally like to have these items still appear on the Navbar.  Can you please help identify the issue and direct me towards a resolution?

 

Thanks!

Share this post


Link to post
Share on other sites
James B    436
James B

Hi there, 

 

Looking in firebug it seems that each element adding in the hooks has been given absolute position and inline css styling. I would say it would be easier to group everything inside one div container and give it a class name, then you'll be able to control that whole unit as one object rather than each element independently. 

 

When the mobile browser layout kicks in, the container with the menu and the logo goes 100% width, with the logo floating on the left and the menu floating on the right. So your section will need to be set to stack underneath this. Absolute positioning and the fact the branding container goes full width is stopping the items from flowing with the rest of the page. 


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
sblentlinger    0
sblentlinger

Thanks for the speedy reply, will try this!

Share this post


Link to post
Share on other sites

  • Similar Content

    • Grant Turck
      By Grant Turck+
      Navbar Broken on All Devices When Not Logged Into Wordpress. See screenshots attached from mobile. What is causing this issue and how do I fix? Site is venicepride [dot] org.


    • Grant Turck
      By Grant Turck+
      What file do I need to add code to in my pl-framework-pagelines child theme to insert script after opening body tag on every page?
      Can you someone provide me with the code also?
    • PierreFF
      By PierreFF+
      Hello, 
      I have an issue with NavPro on mobile when the link of the menue is on the same page. 
      Here is my website: http://foundersofthefuture.co
      The isssue comes from the fact that in my menue most of the items send somewhere else on the same page using anchor link (eg. #container_u788888). 
      This works well on desktop but on mobile, nothing happens when clicking on the link. One of the link of the menue of the homepage "France" sends to another page of the website and this one works well even on mobile. 
      I am using the Pagelines framework theme and also used a wordpress plugin (jQuery Smooth Scroll) for smooth scrolling . 
      Thanks in advance for your help and let me know if I need to provide more information. 
      Best,
      Pierre
    • tristanrodgers
      By tristanrodgers+
      Hi there!
      I'd love to have some social media buttons in my navbar like my online-shop has!
      http://mc1r-magazine.com/
      Can someone explain me how to create them? I tried a lot but don't know how to realize them...
      Greetings from Germany,
      Tristan
    • jeomiland
      By jeomiland+
      Hi guys. Just now trying out Platform 5. I like the reletive simplcity of the new interface but there are things I'm used to in DMS that I'm not seeing yet in 5. Is there a good manual, documentation, video series about some of the basics?
      In particular, I've got a simple navigation menu, created the standard way in WP menus section with several top level parents, then 3-4 children menu items below a couple parent items. Have them moved to the right to create the standard parent-child relationship but all I see on the page is the parent level items - no dropdown!. So I changed themes from Platform5 to the standard 2015 default theme and now I see absolutely no menu at top, except for the mobile (hamburger?) icon.
      In DMS, one had Navi and Navbar, etc sections and each would work differently and give different results. How do you work the menu system in 5? And how get different results ?
      thanks
×