Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Different Image for Mobile Screen - Please help




I know the subject has been beaten to death and I've read all the posts about how to do this however I still cannot figure out how to add a different image to the background of my mobile website landing screen.  I just need the image at the top in the first section...with the coffee beans to be replaced by an image that will take up the entire viewport vertically when it cuts over to mobile

My page is in development now and has not been published.  What the best way to share with you so you may assist?


Ive attached a photos with the sections names from a chrome extension

Screen Shot 2020-09-09 at 4.24.07 AM.png

Link to post
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Posted Images

4 answers to this question

Recommended Posts

  • 0

Add to Home > Design > Custom CSS

/* First section banner mobile */
@media screen and (max-width:767px) {
#page section:first-child .section-background img {
    visibility: hidden;
#page section:first-child .section-background {
    background-image: url(https://cdn.pixabay.com/photo/2020/09/02/15/14/flower-5538547__340.jpg);
    background-size: cover;
    background-repeat: no-repeat;


You can send your question to my email to get detail answer. / How to Setup Password & Share URL

--- Happy New Year

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...