StudioPress

Forum navigation

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

Agency Pro different background on mobile

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.

Community Forums › Forums › Archived Forums › General Discussion › Agency Pro different background on mobile

This topic is: resolved

Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • April 16, 2014 at 11:31 am #100707
    indigobird
    Participant

    I'm working with the Agency Pro child theme and it looks excellent on my laptop. However, the background image looks all wrong on a mobile because it crops in all the wrong places. Is it possible to define a different background (just plain colour would be fine) for mobile devices?

    April 16, 2014 at 11:43 am #100714
    Lauren @ OnceCoupled
    Member

    This would be done with CSS media queries. Your stylesheet already has some, so you need to find the minimum width at which you want your background to display, then remove it for all smaller screens.

    Best,
    Lauren

    We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com

    April 16, 2014 at 11:50 am #100719
    indigobird
    Participant

    See that is what I'd normally do. But it just isn't working for me! I'll see if I can find a different photo.

    April 16, 2014 at 12:02 pm #100722
    indigobird
    Participant

    Sorry long day - to explain what I mean in more detail, I can get a different colour to show on a mobile, but that isn't quite what I'm trying to do. There is a colour defined in css, but also the background image from appearance-->background. I'd like to not show the appearance-->background image on a mobile.

    April 16, 2014 at 12:12 pm #100725
    indigobird
    Participant

    All sorted!
    body.custom-background {
    background-image: none;
    }

    Sorry for talking to myself so much! Thanks for your help Lauren.

    April 16, 2014 at 12:58 pm #100731
    Lauren @ OnceCoupled
    Member

    Good work on that; happy to help. 🙂

    We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Agency Pro different background on mobile’ is closed to new replies.