Front Page Widget Area Size Editing on Sela Theme

  • Resolved muditametta

    (@muditametta)


    8 years, 7 months ago

    Hi everyone,

    Thanks so much for all the help so far, I have been needing a LOT of it – but I am determined to figure this thing out ?? I am building my site locally, so unfortunately I don’t have a link I can provide. If there is anything else I can put up here that will help please let me know.

    Right now I am trying to edit my widget space. I wan’t the widgets to go right to the edge of the page like my featured image. There is also a large gap between to two widgets – I have them both in Footer Area 1. I may run into a problem with this as I don’t need all my widgets to be full size, just my instagram widget! I have attached a picture to show what I mean.

    I want to remove the blank white space on either side, and move the widget up closer to the one above it.

    https://tinypic.com/r/4i24o8/9

    Thanks!

    Megan

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hi Megan,

    Did you get the CSS from this thread to work in the end? I ask because the CSS provided there should remove the white border surrounding your footer.

    You can remove the space beneath each widget in your footer with the following custom CSS:

    .footer-widget-area .widget {
    margin-bottom: 1em;
}

    Increase/decrease the value of margin-bottom to your liking. It’s worth noting that increments/decrements of .1 are enough to have an effect e.g. 0.9em, 0.8em.

    The custom CSS should be added to either the editor of your custom CSS plugin or your child theme’s style.css file.

    Let me know how that goes!

    Thread Starter muditametta

    (@muditametta)

    Hi Siobhan,

    Thanks for all your help! I wasn’t able to get this code to work either, I’m sure its because of my error in copying the style.css from the parent. I need to figure that out first. Is that css for the main front page widgets or the ones in the footer? It’s the ones on the main front page I’m trying to move closer together ??

    Thread Starter muditametta

    (@muditametta)

    My mistake, I wrote that they were in the footer area! I meant to say they are both in the front page area one! Sorry about that!

    Hi Megan,

    Thank you for clarifying! In that case, we would replace .footer-widget-area with .front-widget-area to target the front page widgets:

    .front-widget-area .widget {
    margin-bottom: 1em;
}

    If you’re curious: I’m using my browser’s built in inspector tools to find how the theme targets specific widget areas with CSS. We have some good tutorials to guide you on how to use your own browser’s tools in a similar way:

    https://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/

    Let me know how you get on sorting your child theme’s style.css file out or if there are any questions I can help out with along the way.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Front Page Widget Area Size Editing on Sela Theme’ is closed to new replies.