• 

  appdevtr33

  Participant

  July 6, 2018 8:55 am

  Hi,
  I could change the hader background and paddings (top and bottom).
  I want a different mobile header background on the mobile screen. But mobile header background is
  using the picture I use for the big screen header backgorund. I couldn’t.
  In summary, what I want to do is;
  I want to use different images in the mobile hader background (480×200) and the normal header background (1902×200) and give them different paddings.
  Thanks for now.

  Site URL: hidden

  

  Content is visible for topic creator and
  support staff only.

  #196197 copied to clipboard

  Like
  

  Rose Tyler

  Support staff

  July 6, 2018 10:17 am

  Hello,

  Header padding can be changed in Theme Options > General > Header Settings.
  To change bg image on mobile you can add this css code in Theme Options > Styling > Custom css > Custom css for mobile:

  @media (max-width: 992px) { 
  header.header.main-header.header-bg-block {
      background-image: url(url of your image);
      background-size: cover;
      padding-top: 20px;
      padding-bottom: 20px;
  }
  }

  Also, you can disable “Header overlap” for Home page if this is not required http://prntscr.com/k382k8

  Regards

  #196213 copied to clipboard

  Like
Viewing 2 results
1 through 2 (of 2 total)