Jump to content
Sign in to follow this  
Keith Vaugh

Home Page (landing page) Full width headers, content, rollovers etc...

Recommended Posts

Keith Vaugh+    14
Keith Vaugh

Hi Folks

 

Trying to create a home page similar to what is attached. I think what I will have to do is customise the depth of the header (on this page only?) and I want the header, content area, footer etc... to stretch left to right of the browser. I have identified these pieces of custom code (haven't implemented them yet) that seem to do some of what I need. 

 

 

//***CHANGING THE BACKGROUND COLOUR IN HEADER AND CONTENT SECTION OF SITE***//
#site .section-branding .texture {
max-width: 100%;
background: #575757;
}
 
 
#site .section-branding .content {
background-color: #575757;
}
 
#site .texture {
max-width: 100%;
background: #757575;
}
 
 
#site .content {
background-color: #757575;
}
 
Ideally I like the image in the header background to change as the mouse would roll over the boxes (one of the three boxes). 
 
The easy route would be to go to a developer for the coding, but I'd prefer to do it myself.
 
Can anyone offer any advise, directions or suggestions.
 
Many thanks in advance.
Keith 

Share this post


Link to post
Share on other sites
Keith Vaugh+    14
Keith Vaugh

Would the boxes also change on rollover or only the background image?

Hi Catrina, good to hear from you again.

Not the boxes would not change. Ideally they would be a link to another page.

Share this post


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

Hi Keith

 

There's a section available in the store which will help you with the background image slider, check out http://www.pagelines.com/store/sections/wicker/

 

If you're coding this yourself then you'll be able to set a static background using css, looking at your example image you'll need to make sure your site is set to full width sections to enable the background images/colors to reach the edge of the page.

 

Unfortunately I can't see a way to get the background image to change by hovering over the buttons using css, you'd need to use javascript I think to get something like that to work. But the wicker section will allow you to set those images in a slideshow which revolves in the background.


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
Keith Vaugh+    14
Keith Vaugh

Thanks James

 

Was looking into the wicker image slider but was unsure if it'd meet my needs. Have the full width sections enabled. Will continue on the quest. (not set on the design yet just conceptualising)

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Hi,

 

Unfortunately, this is not possible out of the box with PageLines Framework and would probably require a custom section or code. The best course of action would be to contact one of our pros and see if they're able to assist.

 

http://www.pagelines.com/pros/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
Keith Vaugh+    14
Keith Vaugh

Thanks for the reply danny, but as I stated above, would prefer to do myself - That way I get to learn a little. 

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

You could attempt to create your own section, but we wouldn't be able to assist you with this. If you're willing to give this an attempt, you could apply to join the developer community - http://developer.pagelines.com/

 

If your application is successful you would be able to discuss your custom section with other PageLines community developers, who will be able to give you advice and feedback.


Please search our forums, before posting!

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

Sign in to follow this  

×