Front Page Sidebar Areas

The front page sidebars section of the customizer will help you configure the available sidebar positions in the front page template. Unfortunately WordPress does not have the capability to create sub-panels to help separate additional sections, so I had to squeeze everything into this one section (tab). I decided to group together similar settings, but to give you an example of a sidebar section, here is a screenshot from the live demo:

fp sidebar sc

Sidebar Section Settings

I’ve included a screenshot above where I used the Content Top Sidebars 1, 2, and 3.

  • Show Widget Sidebars – Enable or disable sidebar sections
    fp setting ctop
  • Make the sidebar sections fluid – If you want full width instead of boxed layout
    fp setting ctop fluid
  • Sidebar content alignment – If you want your widget content to be centered
    fp ctop center
  • Sidebar section ID’s – If you plan to use one-page scrolling
    fp setting ctop id
  • Sidebar section padding – top and bottom spacing
    fp setting ctop padding
  • Sidebar section background colour – Adding background colour – However, for content styling, you will need to use custom CSS for this because it greatly depends on what kind of widget content you plan to show. Content can include links, borders, media, text content, and much more.
    fp setting ctop bg

You do not need to use all the sidebar sections, but here is the list of sidebars you can utilize.

Sidebar Sections

  • Nivo Slider
  • Banner (with and without overlay)
  • Top 1, 2, 3, and 4
  • Content Top 1, 2, 3, and 4
  • Content Bottom 1, 2, 3, and 4
  • Bottom 1, 2, 3, and 4
  • Footer

When using sidebar groups, such as the Top 1, 2, 3, and 4 positions, you do not need to use all 4. For example, the live demo site is using the “Top 1” position for the Intro text at the top of the page (just below the header image).

Sidebar Section Layout

Here is a screenshot of the sidebar layout in relation to other sections within the front page template that you can use for a reference…the light grey areas are the sidebars:

fp sidebars