en WordPress.com Forums › CSS Customization

Increase photo size in Sight slider

  • Author
    Posts
  • #1145965

    usfwsnortheastblog
    Member

    Hello! I was just testing the Sight theme and am wondering if you can change the slider image size (I was able to edit the container to be larger).

    For example, I found this code that worked to decrease the size: `.featured-thumbnail {
    float: left;
    margin: 0 2.5em 2.5em 0;
    width: 10%;
    }`

    Is there anything I can do like this that increases the slider photo size?
    I would like to make the featured photos larger on the home page feed (not the slider photos).

    Thanks!

    The blog I need help with is usfwsnortheasttest.wordpress.com.

    #1146230

    designsimply
    Staff

    Well, you can try to stretch images, but featured images are a set size determined by a theme’s PHP code (not CSS) and so if you try to make them bigger than what the theme has set, the images can end up looking a little pixelated or blurry. Sometimes the quality offset is acceptable.

    I’m not 100% sure which images you’re referring to though. Would you please provide a link to the WordPress.com blog you’re working on and point out a specific image?

    #1146234

    usfwsnortheastblog
    Member

    Hi there! The blog is usfwsnortheast.wordpress.com. Thanks for your help! I’m referring to the images in the slider.

    #1146235

    designsimply
    Staff

    I came up with an example that actually stretches the theme width by 100px but doesn’t affect the slider images:

    .site {
	max-width: 1075px;

}
.site-header a.header-link {
	width: 100%;
	background: url('YOUR_IMAGE_URL') no-repeat;
}
.main-navigation {
	width: 100%;
}
.featured-wrapper,
.featured-nav-wrapper {
	width: 100%;
	max-width: none;
}

    Replace YOUR_IMAGE_URL with a link to an image that matches the max-width value you choose for “.site”, which is 1075px in the example above.

    And then if you also want to stretch the slider images, add this:

    .featured-thumbnail img {
	width: 700px;
	max-width: none;
}

    I live near the Adirondacks, and I love the mission of the http://usfwsnortheast.wordpress.com/ site!

  • Author
    Posts

The topic ‘Increase photo size in Sight slider’ is closed to new replies.