Tagged: , , ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • March 16, 2013 at 3:49 am #5236
    CFarone
    Member

    In my CATCH FOREST site I want to have each widget appear in its own “box” as they do in the sidebar on the CATCH BOX theme.

    I have already created a child theme and customized the CSS to add the boxes, however the problem now is that because of the way the ID and Class tags are listed my custom CSS also adds the CSS to the “header right” social media widget – which I don’t want.

    When I look at the sidebar widgets using Firebug, I see that each widget has individual aside IDs of “text-(number)”. Doing an experiment I created CSS for each individual ID=text-(number) and the boxes did appear in the sidebar area correctly and the CSS did NOT effect the social media widget.

    However, I don’t want to have to add CSS for each individual widget – this would not be easy for the site owner in the future. The site owner needs to be able to just add widgets as needed and they appear with the cohesive look.

    So is there a way to edit the widget class (or ID) so that ANY widget (excluding the social media widget) that is created will appear with my custom box CSS?

    Thank you for your assistance. Your support is greatly appreciated.

    March 17, 2013 at 9:47 pm #5291
    Sakin
    Keymaster

    @CFarone: We don’t have Catch Forest Theme. Can you send me your Site URL? Also you don’t need to build child theme to customize the css. You can just add in “Custom CSS” box in your Theme Options panel.

    Let me know what you need to customize and then I can send you the proper way to add in the css.

    March 18, 2013 at 12:17 am #5313
    CFarone
    Member

    I’m sorry – I didn’t mean Catch Forest – the site is CATCH EVEREST.

    March 18, 2013 at 12:26 am #5315
    Sakin
    Keymaster

    @CFarone: This is not box theme that is why it is not there. Catch Everest is simple theme without boxed. But if you want to add in then, you can try adding in the following CSS in “Custom CSS” box in theme options panel.
    #secondary .widget { background-color: #fafafa; border: 1px solid #e6e6e6; padding: 20px; padding: 2rem; }

    March 21, 2013 at 12:03 am #5495
    CFarone
    Member

    Thank you, Sakin…that CSS worked perfectly.

    I really appreciate your assistance.

    June 19, 2013 at 9:52 am #10724
    Adventus
    Member

    Hi, I have the opposite request – I’d like to remove the borders around text widgets in the right sidebar of Catch Everest Pro AND reduce the padding around the widgets (seems like the div tags may be causing the gappage).

    Thanks

    June 19, 2013 at 1:22 pm #10728
    Sakin
    Keymaster

    @Adventus: Can you send me your site URL. As there shouldn’t be any border in Catch Everest Pro theme sidebar widgets.

    January 8, 2016 at 1:28 am #82405
    Into Explorer
    Member

    Hi Im using catch base. I want to have each widget in its own box. I’ve tried

    #secondary .widget { background-color: #fafafa; border: 1px solid #e6e6e6; padding: 20px; padding: 2rem; }

    In the CSS but it didnt work?

    Thanks

    January 8, 2016 at 11:13 am #82429
    Sakin
    Keymaster

    @into-explorer: This post in for Catch Everest Theme. For Catch Base theme, you need to use http://catchthemes.com/support-forum/forum/catch-base-free/

    For Catch Base sidebar widget, you need to use:
    .sidebar-primary .widget { background-color: #fafafa; border: 1px solid #e6e6e6; padding: 20px; }

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Adding boxes around individual widgets’ is closed to new replies.