• Hi there,

    thanks again for this great theme.
    At the moment I want to integrate some Google AdSense Content. Unfortunately their rectangual ads are 300px wide or a lot smaller. So I would love to resize the widet are to at least 300px.
    So far I tried modifying the style.css file.
    Changing values here:

    .site-main .widget-area{
    	float: right;
        overflow: hidden;
    	width: 25%;

    only resulted in bad looking ways. Values bigger than 30% made the whole widget area disappear (probably because the content is fixed to 1000px and the widgets to 700px max?!)

    I spent some time figuring it out in the trial and error way. But even if i will continue and find one solution I am afraid that it will look bad on an iPad or some other browser or just with one different setting.

    Can you please tell me the elegant way to get the widgetarea so I can fit a 300px Google AdSense Ad into it? I left all other settings to default of the Untitled theme.
    Thanks
    Kind regards
    Jens

Viewing 10 replies - 16 through 25 (of 25 total)
  • Thread Starter yenzb

    (@yenzb)

    AWESOME!!!

    Thank you so much! This worked out great!
    Sorry but all these things developed while tweaking the page and the original topic was how to resize the widget area.
    Is there an elegant way to get a 300px widget area while keeping the rest of the spacing looking as great as it does? I have the child-theme with the custom style.css and functions.php.
    It would be great if all of the content would be extended a little to the left and a little to the right. While I tried to edit some of the style.css the spacing between the recent posts and the widget area got smaller which looked bad.

    Thank you! Thank you! Thank you!
    Jens

    Thank you so much! This worked out great!

    Great, glad to hear you got the language files working!

    Is there an elegant way to get a 300px widget area while keeping the rest of the spacing looking as great as it does?

    Making those sorts of changes in a responsive theme is actually a little tricky, especially overriding media queries in a child theme.

    The secondary column (sidebar) is currently set to 25% of the overall page width, which is 1000px. That works out to 250px.

    Two thoughts:

    1) Have you tried placing a 300px Google ad in the sidebar to see if it is automatically shrunk down a little to fit the space?

    2) If #1 doesn’t work, try reducing the width of the left column and increasing the width of the sidebar a bit, but perhaps only at larger screen sizes:

    @media screen and (min-width: 1000px) {
    	.content-area {
         	max-width: 600px;
    	}
    
    	.site-main .widget-area {
         	float: right;
         	overflow: hidden;
         	width: 300px;
    	}
    }

    If you go the second route, I’d suggest testing your site at different screen sizes and on different devices to be sure it still looks as you’d expect.

    Thread Starter yenzb

    (@yenzb)

    Hi!

    Thanks again!
    I tried the second way and while it looked good on the main page within one post there was a problem. The text looked scrammed and the width of the pictures wasn’t 700px but 600px.

    And since WordPress 3.9 the spacing between the paragraphs within the post and the space between the pictures has increased a lot. How can I change this parameter?

    Thanks!
    Kind regards
    Jens

    The text looked scrammed and the width of the pictures wasn’t 700px but 600px.

    Without being able to see this myself since you didn’t provide a link, my guess would be that removing and re-inserting the problem image might solve the issue. You could try that as a troubleshooting step.

    while it looked good on the main page within one post there was a problem

    Was the problem only with one specific post on the single post view? Which one? Can you include specifics such as the title of the post with the problem and a link to where I can see the problem happening?

    And since WordPress 3.9 the spacing between the paragraphs within the post and the space between the pictures has increased a lot. How can I change this parameter?

    It would help to know more information about how you are creating content. For example, if you write directly into the WordPress editor without copying and pasting from another source, does the problem go away?

    In 3.9, the way content is pasted from programs like Word changed. There is not a way to change that parameter back, and it’s a general WordPress issue unrelated to the theme. I can try to help guide you to a solution that works for you going forward though. To do that, let’s look at a specific example. Can you please include a link to a post where the spacing isn’t good that we can look at together and maybe also a link to a post from the past where the spacing is what you want?

    I also am having problems fitting the ads in the sidebar. I don’t care the size of the sidebar just as long as the ads fit in their space nicely and aren’t cropped or overlapped. Recommendations?

    This is my site: https://www.proyectogtg.com/

    Thanks,
    Brooke

    Hi Brooke972 – would you mind please starting a new thread since this one is already very long and quite focussed on helping another person? Folks will be able to help you more easily in your own thread. Thanks!

    I don’t care the size of the sidebar just as long as the ads fit in their space nicely and aren’t cropped or overlapped.

    It won’t really be possible to help unless you tell us the dimensions of the ads you want the sidebar to be able to fit, otherwise it’s a guessing game. ??

    Apologies Brooke972 – I see that you already started another thread here: https://www.ads-software.com/support/topic/adsense-ads-not-fitting-in-the-side-bar

    Let’s continue the discussion over there. The reason I’d pointed you to this thread was so that you could try some of my suggestions I gave this user, not so that you could post here as well. I’m very sorry I wasn’t clearer. ??

    @yenzb, if you still need help, please include a link to a post on your site where we can see the spacing problem in action.

    Hello, I have a question and found this may be as better place than any to post it.

    When I hover over my images the color dims and gets a little transparent which I like but it also shows a paperclip icon in the center which doesn’t look good. Any advice as to how I may be able to get rid of the paper clip?

    sacredpath

    (@sacredpath)

    Automattic Happiness Engineer

    @may, this thread is in the Untitled theme support forum, and you are using a different theme, in the future it would be best to ask either the theme author, or ask in the general Themes and Templates forum here.

    I took a look at your site and you can use the following CSS to hide the link icon when you hover images.

    .overlay .thumb-info i {
        display: none;
    }

Viewing 10 replies - 16 through 25 (of 25 total)
  • The topic ‘How to resize Widget Area’ is closed to new replies.