Serenity Theme – how to create a new widget?

[Tamaralas]

Hi everyone.

I would like to replace the slider area on the home page of the Serenity theme to make it a text area. The problem with simply adding a text widget is that the background color takes on the background color of the theme, as you can see here: http://usafitnesscenter.net

I have tried changing the background color of the slider wrapper. I have also tried moving the slider to above content rather than below header. (I used the code that was posted about a year ago, but the solution was not correct in that it removed the slider area altogether.)

I'm fairly new to WP, so I need a pretty basic (as in beginner level) explanation. Similarly, I'm not sure I'm using the correct labels, so please let me know if you need clarification.

Thank you in advance for any help.

http://usafitnesscenter.net

[AnitaC]

Instead of adding another new widget area, you just need to add some styling. Your widget ID is Text-36. So you target that specifically, so add this to the bottom of your style sheet.

#text-36 {
    background-color: #FFFFFF;
    border: 10px solid #EEEEEE;
    height: 250px;
    margin: 0 auto;
    padding: 10px;
    width: 900px;
}

Keep in mind, if you remove that text widget or add something different - you will need to change the "text-36" ID to whatever the new ID is for the new element.

---

Need help with customization or troubleshooting? Reach out to me.

[Tamaralas]

Hi Anitac,

Thank you for your reply. I entered your code and got an error, so I experimented to see if part of it would work and it did. Will you see what happened at http://usafitnesscenter.net ? Maybe #text-36 is just that first bit of text that says:

USA Fitness Center of Southeastern Massachusetts
A full service health facility with two convenient locations

since it's the only portion that shows the white background.

It's odd, yes? The area is set up like a widget - I can see it as a widget area and add a text widget to it - but it doesn't act like one.

Thank you again. I appreciate you thinking about this.

[AnitaC]

What type of error did you receive? Did you place it in the Style.css file? That's where it should have gone.

---

Need help with customization or troubleshooting? Reach out to me.

[Tamaralas]

Anitac,

You are correct. When I went back to duplicate the error, it worked perfectly! Looks like the error was mine. Thank you for your help. If you don't mind, how did you know the widget was called text-36?

[Author]

Posts