0

I'm having a little trouble trying to style three widget areas in a footer area of a Wordpress Theme. I have attempted using a simple 'Text Widget' and recently just installed a plugin called 'Call to Action Widget' by 'Charlie Strickler'.

With both options, I am struggling finding the class which needs to be styled or trying to inherit a current style (e.g for the button).

Here is a mock-up I made earlier: http://postimg.org/image/pp3mateun/

Any suggestions?

Tom25
  • 135
  • 3
  • 9
  • Can you be a little more specific?! We need more information... What is the link for it or provide us a bit of code, what are you trying to do and where, etc etc... – Chun Aug 11 '14 at 16:19
  • Its impossible to give advice without a link to your code. You can write css, and write code in a "text widget" by adding a div tag. You can easily create a button like this: http://jsfiddle.net/bevL4a13/ – AndrewH Aug 11 '14 at 16:24
  • @Chun, my apologies; so you would recommend to just style the area with in a text widget? The three widgets I wish to style are ID's .section#text-2, .section#text-3 and .section#text-4. I'm finding it hard to explain, so I will have a play around. Thanks guys! – Tom25 Aug 11 '14 at 17:02
  • @Tom25 When you preview the page you can inspect element by right click on the part you want to inspect. See what id/class are effecting the footer (I think you figured that part out). Find the tag in wordpress editor (can ctrl+f and search for the name) and change some of the css. You can create a class for the text (to make it the size and color you want) and I already linked an example for the button. If you publish the page for us to see we can better help you on what to edit. – AndrewH Aug 11 '14 at 17:54
  • @AndrewH Perfect! Yes, this is how I was trying to find the class, as the class(s) did not exist. I needed to add them to the stylesheet like so: 'section#text-3 { background-color: #1a1919; } section#text-3 .h4.widget-title.widgettitle { color: #fff; } ' See Screenshot of Widgets in browser: http://postimg.org/image/4y1sne8w7/ I have also applied a heading tag in the title and called the button class within the text widget: '' If you can see from the screenshot and the CSS above, I can't style the widget title correctly... – Tom25 Aug 11 '14 at 21:50
  • @AndrewH Plus, I'm a bit unsure how to add another style for the button... – Tom25 Aug 11 '14 at 21:53
  • @AndrewH Ignore the past two comments, I have styled the widget. How can you target one element to all text widgets? (i.e here's the style for the button within the text widget: 'section#text-3 input#subbutton { width:200px; }'), how can I also apply the same style to 'section#text-4'... If it's a case of copying and pasting the same code over and over, it seems a little unclean to me. – Tom25 Aug 12 '14 at 13:30
  • @AndrewH It's widget.widget_text... Thank you for your help – Tom25 Aug 12 '14 at 13:38

0 Answers0