Jump to content


Photo
- - - - -

Full Width div before content

full width div

  • Please log in to reply
4 replies to this topic

#1 meyson

meyson

    Member

  • Members
  • 11 posts
  • Country: Country Flag

Posted 18 January 2013 - 12:53 PM

Hi, 
I am trying to make a full width div (for holding a slider) just before the content div - it will be the only element that has a full width. 
It is not difficult to make it with page.php copy, but in the pagelines only predefined presets are used, and i cannot follow the order. 
Can you breafly explain how to do it?
Thanks.



#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 16923 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 18 January 2013 - 01:16 PM

Hi,

 

In order to add a full width area to house a slider, you will first need to set your layout to Full Width sections. Then the easiest method to adding a slider would be to use a ContentBox and if the slider you wish to add allows you to implement the slider via shortcode, add the sliders shortcode to the ContentBox.

 

You can then style the Contentbox giving it a background color/image etc...

 

If your slider doesn't allow you to add via a shortcode then you will probably need to use a hook. I recommend you review our Action Map documentation, so that you can find the correct hook location. - 

Please Login or Register to see this Hidden Content

 

Another method would be to use the Hooker plugin, which allows you to add hooks fast and easy. - 

Please Login or Register to see this Hidden Content



#3 meyson

meyson

    Member

  • Members
  • 11 posts
  • Country: Country Flag

Posted 18 January 2013 - 02:27 PM

thanks fpr reaction. i added a box, and i see the section as below: 
"Custom CSS class 

Add a custom CSS class to this set of boxes.
Add custom css class to these boxes"

but how do i add a css file to this box i have?



#4 meyson

meyson

    Member

  • Members
  • 11 posts
  • Country: Country Flag

Posted 18 January 2013 - 02:38 PM

i mean how to add a styling to this certain box as you said? (to make it full-width)



#5 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 18 January 2013 - 03:53 PM

The custom CSS class adds an "identifier" to the set of boxes so the CSS code (which is placed in Site Options > Custom Code > LESS/CSS) can detect what styling should be applied to that set of boxes.

 

For example, let's say BLOGBOX is the custom class given to that boxes. This means that in the CSS code, the styling for a background color added to that box set would be something like this (but not exactly like this):

Please Login or Register to see this Hidden Content

 

Are you trying to make one box full width or an entire box set full width?