• 0

DMS 2 Reduce Height of Page Header


Question

16 answers to this question

  • 0

Posted · Report post

OK, if you want to dynamically generate your Page title, then you should replace the MediaBox with PLNextBox and add the following code:

 

the_title( '<h2>', '</h2>' );

 

Then check the following options - https://cloudup.com/ccJDjytDiqv

 

Along with the following inline styling - https://cloudup.com/c-Kx7SfKqGj

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi,

The height of the header is the same size of the image you used for the background so maybe going with a image that wasn't as big will make the header smaller. 

2 people like this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Sorry, that does not work.

 

Could someone please help.

 

Thanks

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

When you say that does not work, could you give us some more information regarding this and a link to your site please?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

http://www.birchwoodfx.com/birchwoodfx/

 

Changing the height of the image does not reduce the height of of the page header. I would like it to be 100px and currently it's about 170px

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

When you adjust the height of the header, the position of your title will remain the same, so code to adjust that included
 
/*Adjust height of header*/
#pageheaderuc9rewp {
  height: 100px;
}
/*vetical position of text content*/
#pageheaderuc9rewp .pl-area-pad.fix .pl-ph-container .pl-content {
  padding: 26px 0;
}
 
Current height default min is 172px. You might like this as a Chrome extension https://chrome.google.com/webstore/detail/page-ruler/jlpkojjdgbllmedoapgfodplfhcbnbpn

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi,

The height of the header is the same size of the image you used for the background so maybe going with a image that wasn't as big will make the header smaller. 

If you just use a background colour (ie not image height) it defaults to 172px

 

Question... Should I always use the Americanism 'color', as that is used in code, or stick to using correct English 'colour' LOL 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Richard,

 

The PageHeader section uses a specific height, changing it or overriding it, will cause some styling issues. If you want to have a section be a specific height, what I would do is, use the Canvas section upload your image there and set the height to 100pixels, remember the option only requires the numeric value so input 100 and not 100px.

 

Then add a MediaBox and add the following HTML <h2>Terms & Conditions</h2>

 

As you can see, I have both sections in my screenshot below, the top section is the Pageheader section which has a height of 172px and the one below it, is the Canvas/MediaBox sections which has a height of 100 pixels.

 

https://cloudup.com/ceNL8fDnZ-U

1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Ok, thanks Danny.

 

You solution would mean that I would have to change the title of every page manually correct?

 

R

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi GetMeWebDesign thanks for the info but this too has not worked :(

 

e.g. http://www.birchwoodfx.com/terms-conditions/

 

Is there anyone who can resolve this on the pagelines team?

 

Thanks

Richard

Sorry was targeting that specific PageHeader and assumed you had used it in the header regime so it would be site wide. Danny is more correct than I am, but you still wanted to target the way I suggested, then add further id's separated but commas ie: 

 

/*Adjust height of header*/
#pageheaderuc9rewp, #pageheader********  {
  height: 100px;
}
/*vetical position of text content*/
#pageheaderuc9rewp, #pageheader******** {
 .pl-area-pad.fix .pl-ph-container .pl-content {
    padding: 26px 0;
  }
}
1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Using Danny's method, you could save it as a custom section. Add to the pages you want it, and unlock it (the padlock in the section editor navbar, top left) so that you could replace the text between the <h2></h2>, much in the way that you change the text now for each page, but within the PageHeader Title 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

That works! Thanks Danny :D

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

No problem.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Danny PLNextBox is restricted to club members. Is there anyway to do this without it?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now