Jump to content

Archived

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

nikki4558

Header Section

Recommended Posts

nikki4558

Hi! I recently got my site set up and it looks great on a desktop. The problem I"m having is on a mobile device. The header is not being scaled correctly (it's full size, while everything else is fit to the screen). I think the problem occurred when I added a clickable header through the header.php file. The header shows up fine on the site, but the header section is now missing from the pagelines editor. This section is also what seems to be causing the problem with the mobile view (everything else scales, but the header).  Does anyone know how to add the header section back to the site via the editor? Or is there another fix to this?

 

My site is www.deepestoceanblue.com

 

Thanks!

 

Nikki

Share this post


Link to post
Share on other sites
Danny

Hi Nikki,

 

Unfortunately, we do not provide support to users who have made changes to the core code. These changes are the cause of your non-responsive header too.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
nikki4558

Hi Danny,

 

Is there a way for me to get back to the original template? I've removed the header code, changed templates, deactivated and reactivated the theme, nothing seems to work. I just want the header section back at the top so I can edit it within the pagelines editor. 

 

Thanks for your help!

Share this post


Link to post
Share on other sites
Danny

If you have removed your changes then the header area should be back to normal. If this isn't the case, I recommend you download a fresh copy of DMS and extract the zip. Then upload the header.php file and overwrite the one you currently have.

This should resolve your issue.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
nikki4558

That worked! Thank you!!! Now that I know what NOT to do, what is the correct way to add code to the header section?

Share this post


Link to post
Share on other sites
Jake

Hi nikki4558 - Now that you've got things back to normal, your next step is to activate a child theme (sometimes called a base theme) which will allow you to start playing with things like the header without editing the core files themselves. Check out http://docs.pagelines.com/customize/base-child-theme for more information.


Have you searched the forums yet or checked out the DMS user docs?

PageLines geek, blogging at MyUntangledLife.com

Share this post


Link to post
Share on other sites
Danny

You will want to use hooks. However, if all you want to to do is add HTML, you should probably use the MediaBox section.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
nikki4558

Thanks so much for your help!! I'll look into the child theme and media box suggestions.

Share this post


Link to post
Share on other sites
nikki4558

Ok, one more question. I started from scratch and set up the site using only the pagelines editor (and used media boxes to add the header). I thought that would fix the mobile view problem I was having. Unfortunately, it didn't. Is there a way to fix it so that the website appears the same on desktop and mobile versions?

Share this post


Link to post
Share on other sites
Jake

Hi nikki4558 - DMS is designed by default to be responsive so there's not really a way to "turn it off" and make your website appear exactly as it does on the desktop version. There are, however, some things you can do to manipulate the way things render on different devices and browsers so perhaps you want to investigate those a bit? Check out http://docs.pagelines.com/tutorials/browser-specific-css and http://docs.pagelines.com/tutorials/html-css-utilities for more information. 


Have you searched the forums yet or checked out the DMS user docs?

PageLines geek, blogging at MyUntangledLife.com

Share this post


Link to post
Share on other sites
nikki4558

Ok, I think I phrased that incorrectly. I would like the site to look the same on both the desktop and mobile, but understand that may not be possible.

 

However, I was under the impression (and as you said) the theme itself should be responsive, so I'm not sure why it's not working. I added a screen shot of the site from an iphone. The header and ad at the top are full size, while everything else is scaled. Is there a way to fix it where everything is scaled the same?  Also, when you click on the menu, a black box pops up, but it is hidden behind the header, so most of the choices are not available. 

 

Thank you again for your help!! I've almost got it where I want it :)

 

 

photo.png

Share this post


Link to post
Share on other sites
Jake

Hi nikki4558 - Gotcha, my apologies for misunderstanding. OK, it's definitely not a normal mobile view you're experiencing so we've got to track down whatever is causing the site to look wonky! Chrome tools shows an error  Uncaught SyntaxError: Unexpected token < and it's possible that's the culprit. Could you start disabling plugins except for the DMS Pro Tools and if that helps with the mobile view, turn them back on one at a time and test until you've narrowed it down?


Have you searched the forums yet or checked out the DMS user docs?

PageLines geek, blogging at MyUntangledLife.com

Share this post


Link to post
Share on other sites
nikki4558

No problem. I wasn't explaining it as well as I should have. I disabled all of the plugins except for DMS Pro Tools, but the site still looks the same. 

Share this post


Link to post
Share on other sites
Jake

nikki4558 - This is a weird one! I think perhaps it's the ad in the header that's causing this. Is that a custom code in there? Could you try removing any and all customizations you've got going on and see if that does the trick? It has to be something custom in your site somewhere as I'm not able to re-create the issue on any test sites.


Have you searched the forums yet or checked out the DMS user docs?

PageLines geek, blogging at MyUntangledLife.com

Share this post


Link to post
Share on other sites
nikki4558

I took the ad out completely and it's still the same. It was just google analytics and google ads. It shouldn't be custom at all. Weird! Do you think it could be the header itself?

Share this post


Link to post
Share on other sites
nikki4558

I just removed the header also. It seems to be fine now, and the menu works too. Now I just need to figure out how to add the header without screwing it up. 

Share this post


Link to post
Share on other sites
nikki4558

I fixed the header. I added max before width in the code and that seemed to make it scalable. The ads are still not working though. I tried adding a max width on those too, but it didn't work. 

Share this post


Link to post
Share on other sites
Jake

Hello nikki4558 - I'm glad you've solve the header but concerned why you had to add a max-width - it should scale by default. Did you end up going with the media box? As for the ads themselves, I'm not sure if/how they act responsively. You could try to hide them from mobile view?


Have you searched the forums yet or checked out the DMS user docs?

PageLines geek, blogging at MyUntangledLife.com

Share this post


Link to post
Share on other sites
nikki4558

Hi @Jake- I did use a media box. It's now scalable in mobile view, but not clickable (I have it image mapped). When you click on it in mobile view it acts as one image and only takes you to the home page. I didn't know I could hide the ads from mobile view. Is there an easy way to do that?

 

Thanks again for all your help!

Share this post


Link to post
Share on other sites
Danny

How are you adding the ads to your page, if you're using HTML in a MediaBox you can wrap the ads code with the following:

 

<div class="hidden-phone">
Add Code here

</div>

 

This will hide the add on mobile devices.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
brookdalecenter

Hi, 

 

I have a question about headers in Pagelines that might not be directly related to the conversation in this thread but I figured it was close enough. I accidently removed the header section from my Pagelines website. How do I bring it back so I can have the fixed navigation as well as the header navigation appear on all my pages. Please help! My website is www.brookdale.org.

 

Thanks,

Share this post


Link to post
Share on other sites
James B

Hi there, if you delete the section in the header area then this is actually a section area you're deleting, not the actual header. If you go to add a new section look for the section area icon and drag that back up to the top of the page and it will populate the header again. I've recorded the process of deleting the header and re-adding so you can see what I mean. Checkout http://screencast.com/t/ilgwXn7K8Qa


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

  • Similar Content

    • sakkthi subramaniyam
      By sakkthi subramaniyam
      Working on a very old site which has  pagelines framework theme. I need section plugin. so i can install postpins section. I have lost backup copy.
      Thank you.
    • Paul
      By Paul+
      I was surprised to see I had no menu today - out of the blue - its actually moved to the bottom of the page!  After hours of fiddling and disabling every single plugin, leaving just plagelines the issue is still present.  See video for a basic text box - I moved it into the head and it jumps to the bottom and shows just above the footer but below the main content.  I have a temp fix by placing the menu into the first row on the main content but it does mean other than my home page, all other pages have no menu.  A quick fix is very urgent for this bug.
      https://thelaptopfixers.com
       
       
    • russe-intensif
      By russe-intensif+
      Hi team,
      checking my site today, i'm surprised to see my MegaNav all in bottom of the pages, while it's in header.
      After getting to change it in couple of pages onto Template part (too time consuming !), i'm desperate and ask you for help :-)
      apprendre-le-russe-avec-ania.fr
      Thank you in advance !

    • elementalkites
      By elementalkites+
      Good evening. I am attempting to use the Impulse section on a page I am working on (https://dev.elementalkites.com). The tool seems to have the ability to overlay a logo on top of the slider images but in my case it isn't working, even though I have added the logo file and given it a height to display at. I have attached a screenshot for reference. Any help would be appreciated.
       
       
    • jojoking
      By jojoking+
      I have to admit to being baffled.
      I'm trying to embed a video (from my WP media library) within a WP post using the videobox section shortcode.
      The shortcode section popup only allows two items to be configured - the section type, in this case videobox - and a unique id. There's no URL or other parameters such as autoplay or loop which are available within the Pagelines editor.
      Whatever I put in the unique ID makes no difference to what is shown which seems to be a default video with stars or white noise on a black background.
      I assume I need to define this ID somewhere else, or maybe WP has done it for me?
      HELP!
       
      PS This is the page source generated when a shortcode is added within the WP post editor
      <!-- VideoBox | Section --> <section id="videobox_1675853156" class="pl-sn pl-col-sm-12 pl-col-sm-offset-0 pl-sn-videobox" data-object="PL_VideoBox" data-clone="1675853156" data-level="0"><div class="pl-sn-wrap"><div class="pl-sn-pad fix" data-bind="pledit: true" > <div class="video-highlight"><h3 class="video-title" data-bind="pltext: vb_title"></h3></div> <div class="pl-video-box" data-bind="plcallback: { vb_autoplay: vb_autoplay(), vb_loop: vb_loop(), vb_controls: vb_controls(), vb_video: vb_video()}" data-callback="videobox"> <video id="280414138" autoplay loop > <source src="https://www.handinhandmanchester.org.uk/wp-content/plugins/pl-section-videobox/default.mp4?r=280414138" type="video/mp4" /> No browser html5 video. </video> <script> jQuery('#280414138')[0].load(); </script> </div> </div></div></section> </div>  
      If I add a videobox section using the Pagelines page editor the page source generated includes my video:
      <!-- VideoBox | Section --> <section id="videobox_udvu4uz" class="pl-sn pl-col-sm-12 pl-col-sm-offset-0 pl-sn-videobox" data-object="PL_VideoBox" data-clone="udvu4uz" data-level="0"><div class="pl-sn-wrap"><div class="pl-sn-pad fix" data-bind="pledit: true" > <div class="video-highlight"><h3 class="video-title" data-bind="pltext: vb_title"></h3></div> <div class="pl-video-box" data-bind="plcallback: { vb_autoplay: vb_autoplay(), vb_loop: vb_loop(), vb_controls: vb_controls(), vb_video: vb_video()}" data-callback="videobox"> <video id="429558737" autoplay loop > <source src="https://www.handinhandmanchester.org.uk/wp-content/uploads/2017/04/HIHWelcome.mp4?r=429558737" type="video/mp4" /> No browser html5 video. </video> <script> jQuery('#429558737')[0].load(); </script> </div> </div></div></section>  
×