[Support request] offset for columns in footer

Home Forums Support [Support request] offset for columns in footer

Home Forums Support offset for columns in footer

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
  • #1007214

    I’d like to add an extra 6th widget to the footer, is this possible?

    I’d then like to add a css offset so that its position is on a second row from the original 5 widget columns, but it is offset by 1 column so that it sits directly under widget column 2

    Are there column offsets for the grid system in GP?

    Customer Support

    Hi there,

    quick question where does this 6th offset column appear when in a single column on mobile? Will be the last in the stack or after the 2nd widget?


    Last in stack preferably (no offsets)

    Customer Support

    Trying to avoid registering a whole new footer widget area.
    Couple of choices:

    1. This plugin, 3rd party developed for GP to add another row of widgets to the footer.
    2. You use only one widget area and stack all of your widgets in a column (ie. mobile order) then we look at some CSS to make them into layout you’re looking for.

    Let us know if you need help with the latter.


    Tricky one.
    The layout I’m trying to get is
    Can you tell me how I can specify mobile-grid-50 on widgets?

    Customer Support

    If each of your Widget areas are to only contain 1 widget then you can just stack all widgets in one Widget area, set the Layout to only display one and then use some CSS Grid like this:

    .footer-widget-1 {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: (1fr)[6];
        grid-template-columns: repeat(6, 1fr);
        -ms-grid-rows: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
    .footer-widget-1:before {
        display: none;
    .footer-widget-1 aside:first-child {
        -ms-grid-column-span: 2;
        grid-column: span 2;
        -ms-grid-row-span: 2;
        grid-row: span 2;

    Note: The Customizer > Additional CSS will throw errors at this code, you can just ignore them and check the warning box to save.

    If that works for you then i can assist with the tablet / mobile layout. An image of that would be handy.


    ok thanks, i’ll give this a go and get back to you

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.