[jbergen]

Sure. Here they are:

(1) Home Top (widget) - Tag Line:

You'll need to write a new CSS rule like this:

.textwidget h3 {
    text-shadow: 1px 1px 1px #000;
}

But I would recommend giving that element a unique CSS id in case you end up with another occurrence of .textwidget h3.

(2) Home Middle (widget) – “Our work”
(3) Home Bottom (widget) ; “Recent Articles”

For both of these, it will be:

style.css, line 772

.widget-title {
    color: #333;
    font-size: 16px;
    margin-bottom: 16px;
    text-transform: uppercase;
    text-shadow: 1px 1px 1px #000;
}

In case you're wondering how I found these, I used my browser's developer tools. You basically right-click on an element and select "Inspect Element." Carrie Dils has a nice video tutorial on her site of how to do this.

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi Donald,

You'll want to add the text-shadow property to each of the sections you listed. You can tweak this, but I would start with something like:

text-shadow: 0px 1px 3px #000;

Below is code that would change the site title and home-top widget. The other areas you want to change would be similar - just find the appropriate selector. And be sure to add your this code to a new custom CSS file - not directly to the child theme's style.css file.

style.css file, line 932

.site-title a {
    color: #FFF;
    text-shadow: 0px 1px 3px #000;
}

style.css, line 1278

.home-top .widget-title {
    color: #FFF;
    font-size: 60px;
    line-height: 1;
    text-shadow: 0px 1px 3px #000;
}

I hope that helps!
Jamie

---

Jamie @ Ladebug Studios

[jbergen]

The HTML markup you want to use is the unordered list (ul). This link shows how to structure an unordered list.

I'll also mention that you can change the style of the bullets using the list-style-type property as described here.

By the way, I wasn't actually able to see the text in home section 3 because both the text and background were set to white.

Hope that helps!

---

Jamie @ Ladebug Studios

[jbergen]

I definitely agree that it's not a good practice to add code directly to the theme. Take a look at the video link I posted in Reply #120672 if you do want to add any custom CSS code. That way, it won't go away when you update the theme.

---

Jamie @ Ladebug Studios

[jbergen]

The slider looks good! Do you mean reducing the white space above and below your logo? If so, change the min-height on .header-image .site-title a like so:

style.css, line 1288

.header-image .site-title a {
    min-height: 100px;
    width: 100%;
}

---

Jamie @ Ladebug Studios

[jbergen]

The settings you put in the admin panel for the slider are fine, but I think you also need to add the max-width: 920px to your CSS. I'm guessing the code I found to fix the slider width is in the CSS file for the Genesis Responsive Slider plugin. What you can do is create a custom CSS file to which you can add my line of code to change the slider max-width to 920px.

This is a video tutorial that explains how to make that custom CSS file: http://youtu.be/EOhH4oSvKn8?t=2m20s

Then you can just add this to your new custom CSS file:

#genesis-responsive-slider {
    max-width: 920px;
}

If that doesn't work, you may have to add !important like so:

#genesis-responsive-slider {
    max-width: 920px !important;
}

Let me know if that works!

---

Jamie @ Ladebug Studios

[jbergen]

Regarding the slider, it looks like it's set to 960 x 396px. Your images seem to be 920px wide. However, all you need to do to get your images centered is to add this line to your CSS file to reduce the slider's width:

max-width: 920px;

So your CSS will look like this:

/* Genesis Slider
------------------------------------------------------------ */

#genesis-responsive-slider {
    background-color: #FFF;
    border: 10px solid #EEE;
    margin: 0px auto;
    padding: 10px;
    position: relative;
    max-width: 920px;
}

Make sure to add it outside of the theme so that it doesn't get overwritten when you update the theme.

Also, your custom favicon shows up in my browser, but I would recommend to include a larger version (32x32px) in your .ico file so it will look more crisp on high-res (retina) displays. I wrote a blog post about how to do that here: http://www.ladebugstudios.com/make-favicon-wordpressgenesis-site/.

---

Jamie @ Ladebug Studios

[Author]

Posts