Changing widget/sidebar size in Agency Pro

Community Forums Forums Design Tips and Tricks Changing widget/sidebar size in Agency Pro

This topic is: resolved

This topic contains 4 replies, has 3 voices, and was last updated by  raffa 1 year, 9 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #81708


    I’ve upgraded my theme and tore down my site and am currently working on downsizing my widgets on my primary side bar. The titles and the images are drowned in these huge boxes. The ‘old’ Agency theme allowed you to simply edit the size. Agency Pro may too but I cannot find where on the style sheet to do it. I added a temporary widget for anyone in here who can help me to see. It is titled Blog and has a Sepia colored image on in it. As you will see the widget is huge. I don’t want to have to enlarge an image past the thumbnail size of 150 x 150 (box stays huge anyway so this doesn’t even matter). When I use text on the widgets and no image, it is the same deal. A very wide and very long box. (disregard the mailchimp widget, that was imported via the mailchimp plugin and auto formatted) I have tried changing the width under widgets and sidebar and wrap individually and nothing changes.
    Can someone please advise? I’m banging my head on day four of this. I did submit a ticket but the response said they won’t provide me code to make the changes and to come to the forum and ask here.


    Are you trying to change the padding around the sidebar or do you wish to decrease the sidebar to accommodate the 150×150 image? Do you only want the width of the one widget changed? I cannot determine what exactly it is you want.



    I want to decrease the size of all the widgets in the sidebar not specifically to accommodate the example widget I have displayed with the 150 x 150 image. That’s just posted for you to see how huge the widget boxes are with an item put on them. I want the boxes to be smaller width and height wise. Thank you in advance!



    Look for this:

    .sidebar-primary {
        float: right;
        width: 360px;

    Change the width to a lower number that you like.

    Then go here:

    .content {
        float: right;
        width: 740px;

    Change the width to say 780px.

    Play around with these until you get it the way you want it.

    If you want to decrease the white padding, look for this:

    .sidebar .widget {
        background-color: #FFFFFF;
        border-radius: 3px;
        margin-bottom: 4rem;
        padding: 4rem;

    Decrease the padding from 4rem to maybe 2 or 3.



    hello Anitac
    how about if it was a specific widget?

    #id .sidebar .widget ?
    i can’t seem to get it…i am using news pro

    your help would be appreciated

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.