Swank Theme: Slider and Favicon

[jskeris]

Hey!

Here's my site:
http://www.jodiskeris.com/

How big should the images be in the slider? I can't seem to get them centered quite right.

How can I get my favicon to show? I've already replaced the default with mine but it still shows the default's.

Thanks!

http://www.jodiskeris.com/

[Porter]

I'm not sure about your slider, but your favicon is working correctly for me (the stylized "J"). Favicons are heavily cached, and it's a pain to get them to show on your own setup due to the original one being cached. Trying doing Shift + F5, see if that clears it for you. Either way, it's working, so don't worry about it too much 🙂

---

Buy me a beer? | Try DigitalOcean VPS Hosting

[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

[jskeris]

Great! Thanks!

[jskeris]

Yes! That worked! Thank you!

Next question 🙂

How do I get rid of some of that padding down above/below my header?

Thanks!!

[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]

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]

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

[jskeris]

You are all awesome. Thank you so much for all this info! Incredibly helpful! Woohoo!

[Author]

Posts