I Want to change the widgets size because it doesnt look good

I am facing a problem in my theme , it doesnt show the widgets correctly
and the content gets out of the box of the widget
i think because of the size
can someone tell how to fix this problem because i dont know anything about coding ?
this image clarify the problem

Any help will be appreciated

Hi Cassano10. Welcome to the forums. :slight_smile:

We will need to see your page to be able to help. Can you post a link?

This is the page URL : http://arabjailbreak.com/
You can see the last widget in the left corner
I hope there is a fix for this problem

It’s hard to work with iframes like this. You could try changing the widths in your HTML:


<ins style="display:inline-table;border:none;height:250px;margin:0;padding:0;position:relative;visibility:visible;width:[COLOR="#FF0000"]300px[/COLOR]">
    <ins id="aswift_0_anchor" style="display:block;border:none;height:250px;margin:0;padding:0;position:relative;visibility:visible;width:[COLOR="#FF0000"]300px[/COLOR]">
        <iframe allowtransparency="true" frameborder="0" height="250" hspace="0" marginwidth="0" marginheight="0" onload="var i=this.id,s=window.google_iframe_oncopy,H=s&amp;&amp;s.handlers,h=H&amp;&amp;H[i],w=this.contentWindow,d;try{d=w.document}catch(e){}if(h&amp;&amp;d&amp;&amp;(!d.body||!d.body.firstChild)){if(h.call){i+='.call';setTimeout(h,0)}else if(h.match){i+='.nav';w.location.replace(h)}s.log&amp;&amp;s.log.push(i)}" scrolling="no" vspace="0" width="[COLOR="#FF0000"]300[/COLOR]" id="aswift_0" name="aswift_0" style="left:0;position:absolute;top:0;"></iframe></ins></ins>

That 300 figure is too wide, so see if you can access it and make it something like 280.

Edit:

Victorinox has a much better suggestion below. :slight_smile:

I can’t see the Facebook widget on the page, possibly due to some blocking my end, but the Google one can be aligned within the boundaries of the .textwidget container with this CSS added to style.css:

.textwidget ins {
    display: block !important;
    margin: 0 auto !important;
}

Thanks Everyone here for helping me
I appreciate your help Victorinox
Now adsense widget appears correctly

I have just two other problems
1- I just added the facebook box widget and it is not fitting the border of the widget is there a solution for this one ?
2- Can I make google adsense appear without a widget behind of it … I mean only the image of the advertisement without the widget ?

And Thanks in advance for everyone here

You could modify Victorinox’s code above to this:


.textwidget ins[COLOR="#FF0000"], .textwidget iframe[/COLOR] {
    display: block !important;
    margin: 0 auto !important;
}

Can I make google adsense appear without a widget behind of it … I mean only the image of the advertisement without the widget ?

Which bit is the widget?

I think this image clarifies what I mean http://yfrog.com/emadsenseborderp

I want to make the advertisement only appear .
Is that possible ?
if it is , I hope someone can guide me how to do that ?
Thanks everyone here .
I really liked this forum who has a lot of helpful people

This is a bit crude, but you could change

<div class="widget">

to something like

<div style="margin-bottom: 15px;">

for that element. Obviously it would be better to add a class instead of a style and put the actual style in your style sheet. The above is just for example purposes.

I am sorry
I am an expert in coding , I am just a blogger
Can you tell me what file or what place I need to change it to ( <div style=“margin-bottom: 15px;”> ) ?

Do you have access to your HTML?

Yes, I have
And by the way I only want the adsense widget appear without a border not all widgets ?

Yep, so just edit the HTML of the particular widget concerned, as I showed above. The widget is contained inside a

<div class=“widget”>

Just remove the class=“widget” for that div. You will also want some bottom margin, which you can add in as I showed.

Where do I find the HTML of the particular widget ?

It’s hard to say exactly, because you are using wordPress, which stores bits and pieces of your templates in various places. There’s probably a file in your theme files for the sidebar, which is where I’d be looking. :slight_smile:

I found sidebar.php file
it has these codes

            &lt;div id="leftContent"&gt;
                	&lt;div id="smallwidgets"&gt;
                    	&lt;div id="smallwidgetsRight"&gt;
                        &lt;?php if ( !function_exists('dynamic_sidebar')|| !dynamic_sidebar(&#1589;&#1594;&#1610;&#1585;&#1600;&#1610;&#1605;&#1610;&#1606;) ) : ?&gt;
                                &lt;div class="no-widgets"&gt;
                                &lt;/div&gt;
                            &lt;?php endif; ?&gt;	
                        &lt;/div&gt;&lt;!--End smallwidgetsRight --&gt;
                        &lt;div id="smallwidgetsleft"&gt;
                        	&lt;?php if ( !function_exists('dynamic_sidebar')|| !dynamic_sidebar(&#1589;&#1594;&#1610;&#1585;&#1600;&#1610;&#1587;&#1575;&#1585;) ) : ?&gt;
                                &lt;div class="no-widgets"&gt;
                                &lt;/div&gt;
                            &lt;?php endif; ?&gt;
                        &lt;/div&gt;&lt;!--End smallwidgetsleft --&gt;
                    &lt;/div&gt;&lt;!--End smallwidgets --&gt;
                	&lt;?php include TEMPLATEPATH.'/templates/social.side.php';?&gt;
                    &lt;div id="widgets"&gt;
                        &lt;?php if ( !function_exists('dynamic_sidebar')|| !dynamic_sidebar(&#1603;&#1576;&#1610;&#1585;) ) : ?&gt;
                                &lt;div class="no-widgets"&gt;
                                &lt;/div&gt;
                            &lt;?php endif; ?&gt;
                    &lt;/div&gt;&lt;!--End Widgets--&gt;
        &lt;/div&gt;&lt;!--End left Content --&gt;

So what should I change to make the adsense widget appear without border ?

Ah poop, I dunno. WP sucks. I’ll move this to the WP forum for you. Hopefully someone over there will know where to edit this code. :slight_smile:

OK Thanks a lot for helping me you and Victorinox
I hope someone in WP forum can help me

I couldn’t get the page to load in, but maybe you could get away with using a different selector?

eg. instead of

.widget {

something like

div#smallwidgetsRight+div.widget {

I am sorry , I couldn’t get it because I dont know anything about coding

Could you tell me what file I need to edit ?
I will understand If you tell me where to go and file to edit