Front page widgets

[CyclingAcrossAmericaParticipant]

How do you setup widgets to sit side-by-side, similar to the footer widgets?  I want to put them on my front page at the link below.

I currently have three widgets on the front page but they are stacking on top of each other instead of side-by-side.

http://www.cyclingacrossamerica.com/

• This topic was modified 9 years, 10 months ago by  CyclingAcrossAmerica.

[CyclingAcrossAmericaParticipant]

I created a temporary work-around by adding a 3-column table with the icons and text but would still prefer to have three widgets side-by-side so they will stack responsively.

[ThomasKeymaster]

This will require a few different steps. The first is to add new widget areas using the ‘Widgets’ option from the drop-down menu on the Skin Editor page. After adding the new widget areas, give each of them a unique class name.

Once you have the new widget areas with custom class names, you can add custom CSS to create a width (should be around 30% or so) for each widget area, in your case, the CSS from the 3-column footer widgets will work.

Also be sure to add the CSS for responsiveness to the ‘@media’ section of the Criss Cross skin CSS file.

Let me know if this makes sense or if you need further instruction.

[Author]

Posts