Area Width

  • Author
    Posts
  • #108966

    lisagordonphotography
    Member
    Original poster

    Is there a way to make the content area a bit smaller, or a way to make my photos appear larger? My photos are all 1200 px wide when I upload them, but they seem to get lost in the content area (white area). Is there a way to shrink the white area (therefore increasing the size of the black area around it.

    Thank you so very much!

    Lisa Gordon

    The blog I need help with is: asketchbookofmoments.com

    #109126

    lelandf
    Theme Author

    Hi Lisa,

    Thanks so much for using the Spatial theme!

    Your site is private so I just requested access to it so I can take a better look.

    This sounds like something that can be solved with Custom CSS, but I’d need to take a look to confirm.

    Regards,
    Leland

    #109177

    lisagordonphotography
    Member
    Original poster

    Access given, and thank you!!!

    #109180

    lelandf
    Theme Author

    You’re welcome!

    I uploaded a mockup of what this could look like.

    It narrows the width of the site wrapper (the white background area where all the site content lives). Would something like that work? Would you only want this effect on single posts, like this? Or should the site wrapper be narrowed site wide, including the homepage?

    #109193

    lisagordonphotography
    Member
    Original poster

    Leland
    That looks great! Would want it sitewide. Thank you so very much!!
    Lisa.

    #109202

    lelandf
    Theme Author

    Please try out the following CSS and let me know what you think:

    /* Remove Menu Button */
    .site .menu-toggle {
    	display: none;
    }
    
    /* Narrow Site Wrapper */
    .site .site-inner {
        margin-left: auto;
        margin-right: auto;
        max-width: 700px;
    }
    
    /* Make blog entries full-width earlier to account for narrower site wrapper */
    @media (max-width: 1000px) {
    	.masonry .hentry {
    		width: 100%;
    		position: static !important;
    	}
    
    	.masonry {
    		height: auto !important;
    	}
    }

    Also, I noticed you weren’t using the menu but the menu button still appears. This shouldn’t happen, and I will release an update that takes care of this for others with the same circumstances, but in the meantime, I took the liberty of adding some bonus code to remove the menu button.

    If and when you add a menu, the CSS code that adjusts the site wrapper width will need a few adjustments. Feel free to check back here should you need additional assistance regarding that.

    #109203

    lisagordonphotography
    Member
    Original poster

    It is absolutely PERFECT!!
    Just what I wanted.
    Thank you SO much for being so helpful and kind to me.

    Lisa.

    #109204

    lelandf
    Theme Author

    You’re very welcome!

    I’ll go ahead and mark this topic as resolved, but feel free to start another thread in this forum if you have any other questions about the Spatial theme.

The topic ‘Area Width’ is closed to new replies.