• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Resize Responsive Slider

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › General Discussion › Resize Responsive Slider

This topic is: not resolved

Tagged: resize slider, responsive slider, wrap settings

  • This topic has 14 replies, 2 voices, and was last updated 9 years, 10 months ago by adm.
Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • May 17, 2013 at 5:12 pm #41445
    adm
    Member

    I know how to reduce the image size, but need to reduce the wrap. When I adjust the wrap, it affects the entire site. How can I adjust the wrap (or white area) around just the slider on the home page.

    Thanks!

    http://198.143.132.50/~eckert2/wp/
    May 17, 2013 at 8:31 pm #41460
    bmaven
    Member

    Hi there,

    Have you tried using

    `.home #content {
    max-width: 600px;
    }`

    ?


    Blogging growth strategist & revenue coach at The Blog Maven, fearless leader of 3 preschoolers…tweeting it up @theblogmaven

    May 17, 2013 at 9:09 pm #41466
    adm
    Member

    That works, needs some css work, but won't this affect all of the home page content? I havn't added any of the widgets yet, but don't want to restrict that to the same size as the slider. Also, what would this snippet do to affect responsiveness?

     

    Thanks!

    May 17, 2013 at 9:16 pm #41467
    bmaven
    Member

    Yes, it would affect all of the home page content - I didn't know there was more coming. ๐Ÿ™‚ Your best bet is to create widgetized areas on the home page so that you can target the individual widget areas. E.g., a "Home Featured" widget area at the top to contain your slider and other widget areas below. Several child themes have examples of this. And then you could put the background on just the Home Featured area instead of the whole content column.

    Jeni


    Blogging growth strategist & revenue coach at The Blog Maven, fearless leader of 3 preschoolers…tweeting it up @theblogmaven

    May 17, 2013 at 9:22 pm #41468
    adm
    Member

    Im using outreach, so there are widget areas to include the home featured, etc. And I know how to manipulate those fields, but that still leaves me with the wrap issue that I have yet to resolveย  :/

    V

    May 17, 2013 at 9:31 pm #41469
    bmaven
    Member

    I looked at the Outreach child theme, and it looks like it's structured so that the Content section is completely separate from those bottom widget areas. They're inside a separate div ID called #home-sections. I think you should try adding everything to the page (including the images for the bottom) and see if you can just target the slider through the .home #content.

    Jeni


    Blogging growth strategist & revenue coach at The Blog Maven, fearless leader of 3 preschoolers…tweeting it up @theblogmaven

    May 17, 2013 at 10:08 pm #41470
    adm
    Member

    That works. Thanks! Know how I can center the slider without distorting the responsiveness?

    V

    May 18, 2013 at 6:05 am #41481
    bmaven
    Member

    Sure:

    `.home #content {
    float: none;
    }`


    Blogging growth strategist & revenue coach at The Blog Maven, fearless leader of 3 preschoolers…tweeting it up @theblogmaven

    May 18, 2013 at 7:01 am #41486
    adm
    Member

    It's still floating left with that line.

    May 18, 2013 at 7:22 am #41489
    bmaven
    Member

    Undo that last change, then try adding this to line 183:

    `.home #content {
    display: block;
    margin: 0 auto;
    }`


    Blogging growth strategist & revenue coach at The Blog Maven, fearless leader of 3 preschoolers…tweeting it up @theblogmaven

    May 18, 2013 at 7:41 am #41494
    adm
    Member

    nope ๐Ÿ™

    I had tried the margin line before but it didn't change anything.

    May 18, 2013 at 7:48 am #41496
    bmaven
    Member

    On line #638 you have a float:left that is cancelling out that line. You can either try placing your .home #content code below that line, or add a float: none !important; to your .home #content. The first method is preferred.


    Blogging growth strategist & revenue coach at The Blog Maven, fearless leader of 3 preschoolers…tweeting it up @theblogmaven

    May 18, 2013 at 8:00 am #41497
    adm
    Member

    which float: left is that?

     

    May 18, 2013 at 8:08 am #41499
    bmaven
    Member

    After your last changes, it's now line #636:

    `#content {
    background-color: #FFFFFF;
    float: left;
    padding: 30px 40px;
    width: 450px;
    }`

    Place this below that line:

    `.home #content {
    display: block;
    margin: 0 auto;
    float: none;
    }`


    Blogging growth strategist & revenue coach at The Blog Maven, fearless leader of 3 preschoolers…tweeting it up @theblogmaven

    May 18, 2013 at 8:32 am #41504
    adm
    Member

    Great! Not done a full responsive test, but good on an iphone ๐Ÿ™‚

    Thanks so much! You rock ๐Ÿ™‚ Happy Saturday!

    V

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • The forum ‘General Discussion’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble