Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
  • #780951

    Ok, I got the site looking pretty good on a computer. When I view it on an iPhone or iPad though, the homepage comes out fine, but the other 3 pages (Shop, About, Contact) have the top header picture missing, the one that the menu overlays when you view it on a computer. On the iPhone those images don’t show up at all, and on an iPad they look like they are positioned way up top off the screen and you can only barely see the bottom of the image on the screen.

    FYI I have the header images on all 3 pages as a background image inside a color section (I got this from Kriesi’s tutorial video on YouTube). For the Section Layout settings I have Custom Height in Pixel set to 600px, default padding and display a simple 1px top border and no border styling. For the Section Background settings I have Section Colors set to Main Content, with the 1400×600 background image inserted. I have it set to Parallax, Top Center, and Scale to Fit.

    Any ideas? I really need to get this site up and running so any help is greatly appreciated.


    Hey likegluelikecrew,

    I was about to take a look at your website, but got connection timeout. Is your website working or you moved it somewhere?

    Best regards,


    Once again Victoria, the site seems to be working for everyone else, maybe troubleshoot a bit on your end, thanks!



    Thanks for that, the site is loading on my end. Though I can’t see any problems with it, I check the contact page and it looks good on my end. Could you post a screenshot highlighting the problem please?

    Best regards,


    Hi Rikard, I just checked the site on my iPhone and my girlfriend’s iPhone and the same problem seems to be happening. Everything looks great except the header photos (the large blue tint ones across the top of the page when you view on a computer) aren’t showing up on mobile devices. The home page is fine with the slider, but the top header static mages on the Shop, About and Contact pages aren’t showing up.


    I was just checking it again on my iphone and I noticed if I turn the phone sideways to landscape, the header pictures will come in halfway but are covered by the menu. When I scroll with the phone sideways, the menu doesn’t get smaller like it does on the computer. Could this be part of the problem? Does the glassy header thing with the shrinking menu not work on mobile devices?

    When the phone is not sideways but in portrait, I still don’t see the header images at all.



    May you provide us some screenshots about your problem? This way is easier to identify your problem faster.

    Best regards,
    John Torvik


    Ok, here are the screenshots, I made a page for them. The first screenshot is how the header displays correctly on a computer. The second one is how it displays on an iPhone, with the header image not showing up. The third is the same page on an iphone, just scrolled down a bit to show that the pic doesn’t show up even at the bottom where the page actually starts. The 4th screenshot is when I hold my iPhone sideways, in landscape as opposed to portrait, and the header pic shows up but covered by the menu with the transparent and glassy header not working. The shrinking menu doesn’t work either on scroll on the iphone.


    Hi likegluelikecrew,

    Best regards,



    Mind posting us your backend credentials so we can take a look at your site/page settings? At the moment its hard to tell if this is a bug or caused by something else…



    Sure, here it is, thanks!



    The problem is actually the way you set up the site and images. I am afraid that with the way the theme works this is problematic, since scale image to show the full image and parallax does not play well together. I would do it with a fullslide element with a single image. I set up the about page to work that way so you get an idea of how you could accomplish it for other pages as well.

    Best regards,


    Ok, just got back from visiting my mom, I’ll try it on the other pages as well, thanks.

    It looks good on a computer, but when viewing it on a mobile device, the slider image gets really cut off on the sides. I’d imagine that a good majority of my audience will be looking at the site on their phone or tablet. Is there any way to set it so the slider shrinks down to the size of the iPhone screen so it displays the whole image instead of cutting off?



    you need to work with media queries to achieve what you want. Try this inside Quick CSS field:

    @media only screen and (max-width: 767px) {
    .active-slide {
    background-size: 158% 100% !important;
    background-position: 60% 25% !important;

    and adjust the values as needed.

    Best regards,

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.