Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Sidebars & Widgets »

Customize text widget's margins individually


  #1  
Old Nov 29, 2011, 01:55 AM
maralian
 
18 posts · Nov 2011
Atahualpa rocks!!! One question: I want to change the margins but only on certain text widgets in my sidebar. I know there is an option in:

ΑΤΟ > Sidebars & Widgets > Style widgets > Widget Container but that does the job for all of them.

I want to experiment only with three of my text widget's margins... How do I do that?

Thanks in advance

Last edited by maralian; Nov 29, 2011 at 01:59 AM.
  #2  
Old Nov 29, 2011, 04:23 AM
juggledad's Avatar
juggledad
 
23,574 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
you need to look at the source of a generated page. Then you can examine the widgets and see if there is a ID="..." with the widget. Using that in your CSS Selector, you can then craft some css for each widget specifically
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Nov 29, 2011, 05:27 AM
maralian
 
18 posts · Nov 2011
I think I got what you mean.

One of my widget's code looks like this:

<div id="text-3" class="widget widget_text"> <div class="textwidget"><div class="textwidget"><a title ...... ></div></a>

Where and what code should I put, in order to make top and bottom margins 15px for example

Last edited by maralian; Nov 30, 2011 at 01:28 AM.
  #4  
Old Nov 29, 2011, 05:38 AM
juggledad's Avatar
juggledad
 
23,574 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
this is where you need to start learning CSS

CSS is made up of a SELECTOR and some RULES - the more specific a selector the narrower the focus of where the rules are applied. You have seen a 'wide' selector when you gave the widgets a margin in the theme options, it applied it to all widgets. You can use the ID to make your selector very strict and it will only apply to this widget.

a great reference for CSS is http://w3schools.com/css

Once you code your selector and rules you can put them in the CSS Inserts option of the theme (ato->Add HTML/CSS Inserts->CSS Inserts)
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Nov 29, 2011, 08:25 AM
maralian
 
18 posts · Nov 2011
Let me see if I got this thing right because CSS is totally new for me...

The id of my widget is "text-3"

now for the selector and the rules it should be something like this {margin-top:15px;} ????

so the CSS in ATO->Add HTML/CSS Inserts->CSS Inserts will be

text-3 {margin-top:15px;}
  #6  
Old Nov 29, 2011, 09:14 AM
juggledad's Avatar
juggledad
 
23,574 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
You need a pound sign to identify the ID
HTML Code:
#text-3 {margin-top:15px;}
note this will only effect the TOP margin
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old Nov 29, 2011, 09:35 AM
maralian
 
18 posts · Nov 2011
I canít thank you enough...!

I really appreciate that you didn't give me a straight answer but helped me to find out how to solve this and probably other similar issues by myself with just your guidance...

That old Chinese Proverb is so true...!
  #8  
Old Dec 22, 2011, 09:27 AM
worthwhileluxury
 
10 posts · Dec 2011
Quote:
Originally Posted by juggledad
You need a pound sign to identify the ID
HTML Code:
#text-3 {margin-top:15px;}
note this will only effect the TOP margin
Hi there, I'm looking at all your replies and I have tried all sorts of variations but I just can't do it.
I have a block quote in the right-inner sidebar and I have used the # Identifier and tried all sorts of things you say here but it just won't work.
The block quote appears like a long thin little block and doesn't fill the sidebar from left to right.
It seems as though there is padding.
Can you help? Do you look at my site? http://wisemanconcept.com
  #9  
Old Dec 22, 2011, 09:36 AM
worthwhileluxury
 
10 posts · Dec 2011
Is there such a thing?
It is the testimonial plugin which puts the the testimonial excerpt into a 'block quote' on the front page. If I reduce the padding to 0 it brings the text closer to the block quote border but it doesn't move the block quote border closer to the side-bar edges so I can't imagine that it would work.
I'll give it a try.
  #10  
Old Dec 22, 2011, 09:37 AM
lmilesw's Avatar
lmilesw
 
10,174 posts · Jul 2009
Central New York State USA
Quote:
Originally Posted by worthwhileluxury
Hi there, I'm looking at all your replies and I have tried all sorts of variations but I just can't do it.
I have a block quote in the right-inner sidebar and I have used the # Identifier and tried all sorts of things you say here but it just won't work.
The block quote appears like a long thin little block and doesn't fill the sidebar from left to right.
It seems as though there is padding.
Can you help? Do you look at my site? http://wisemanconcept.com
Take a look in the blockquote section of the theme options.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #11  
Old Dec 22, 2011, 09:47 AM
worthwhileluxury
 
10 posts · Dec 2011
tried negative. doesn't work.
  #12  
Old Dec 22, 2011, 09:56 AM
worthwhileluxury
 
10 posts · Dec 2011
I have tried everything in the theme options. Changed padding to 0 everywhere. Nothing works.
Is it the widget? I have CSS identifying the testimonial blockquote and I have inserted that in the blockquote CSS but still nothing.
Surely there must be a way to fix this. Any suggestion? Do I go to the widget designer?
  #13  
Old Dec 22, 2011, 10:12 AM
juggledad's Avatar
juggledad
 
23,574 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Swimflyfast2 - ill check it when I get home, out doing Xmas errands

Worthwhileluxery - you are doing what is known as hi-jacking a thread. Now there are two issues and you are taking advise ment for the other issue. Please open a new thread and state your issue.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #14  
Old Dec 22, 2011, 10:19 AM
worthwhileluxury
 
10 posts · Dec 2011
Gosh thanks for letting me know. I had no idea. I am new at this. Will do.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Adding CSS to Customize Context Using WordPress Text Widget JerryArns Sidebars & Widgets 1 Jan 3, 2011 08:13 PM
Customize text template as setting in ATO>>Sidebars & Widgets>>Style Widget bigliettaio Sidebars & Widgets 4 Jan 17, 2010 03:18 PM
Question about margins lmilesw Header configuration & styling 0 Dec 1, 2009 11:14 AM
How to add margins when not using a logo? Ashjoielee Atahualpa 3 Wordpress theme 1 Mar 30, 2009 09:18 AM


All times are GMT -6. The time now is 03:43 AM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.