Page Header is different for iPhone & Android

Home Forums Zakra Free Page Header is different for iPhone & Android

This topic contains 8 replies, has 2 voices, and was last updated by  Ashish 4 months, 4 weeks ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #1403704

    peskinphotography
    Participant

    Hello,

    I noticed today while developing two websites that on mobile, the page headers look like they should on Android, but on iPhone, it just takes the top left corner of the picture and not showing the entire picture. Is this a setting or something I can correct for iPhone?

    #1403742

    Ashish
    Moderator

    Hi @peskinphotography
    Can you provide your site URL so that we could understand the issue properly and provide an appropriate solution?

    Regards,
    ThemeGrill Support Team.

    #1403750

    peskinphotography
    Participant

    Leia.peskinphotography.com is the URL. On all page except for the homepage, the page header looks the same as it does on desktop for Android. It shows the entire picture with all the clouds. On iPhone, it appears like a very zoomed in section of the clouds, but you cannot even tell it is clouds it is so zoomed in.

    #1403773

    Ashish
    Moderator

    Hi @peskinphotography
    Since there’s less space available in iPhone, it’s not possible to show the background image like in desktop devices. However, you can add following CSS inside Appearance > Customize > Additional CSS to make the cloud visible in your case:

    @media screen and (max-width: 480px) {
        .tg-page-header {
            background-position: right center;
            background-attachment: unset;
        }
    }

    Let us know if this doesn’t work for you. 🙂

    Thanks.

    #1404100

    peskinphotography
    Participant

    Also I am really confused. i am using Elementor to build the pages, and I create sections in Elementor, or edit something, and in Elementor it shows it exactly how I want to, but it is completely different on the live website.

    At the bottom of the homepage, I created services with button links. They are centered in nice looking boxes in her font and colors, and pink boxes, but on the live website, it is all messed up, different font, small green boxes. On her about page, and the headers should be pink, which they show in Elementor, but on the live version, they show in Dark Grey. Why would this happen??

    #1404098

    peskinphotography
    Participant

    This code worked, thank you!

    I moved this website domain to leialewisfitness.com and after the move there is 1 thing I cannot figure out. Only on the Homepage, it is showing above the picture “FRONT PAGE.” This is behind white background. It appears like it is the page header (without my page header background that is uploaded and works on all the other pages). I toggled the show page header in the edit page for only the front page on/off, and both time it is still showing.

    How can I remove this text “Front Page’ for only on the homepage?

    thank you!

    #1404110

    Ashish
    Moderator

    @peskinphotography
    If you’re using Elementor to design the homepage, please try changing page template other than Default Template. I recommend you to use Page Builder template which will fix another live issue you mentioned. The section containing FRONT PAGE is not a page header so changing page setting won’t affect that. Also, please make sure that you have the latest Zakra theme.

    View post on imgur.com

    Thanks.

    #1404203

    peskinphotography
    Participant

    Thanks Ashish. changing from default template did get rid of the “Front Page” area on the homepage. I am super confused about what is going on now though with the entire website. Every time I make changes in Elementor, these changes are not getting applied, and in many cases the fonts, layout, and colors are all completely wrong. How is this happening?

    When I first set up this domain, I selected a different theme (Astra). After reviewing it, but before ever starting on the theme build, I changed to Zakra. I then built the website on a different domain. I moved the database and wordpress files to the new domain, leialewisfitness.com, and since then there are SO MANY WEIRD things happening. Pictures are not showing up. As mentioned, elementor is not working properly. All the plugins and theme are updated.

    Any idea what is going on?

    #1404214

    Ashish
    Moderator

    @peskinphotography
    For the Elementor changes not being applied, while checking your site, it seems you’ve not set Page Builder page template for other pages than the homepage. Please follow the above-mentioned process for fixing the issue for all pages. It should work. 🙂

    For images not appearing issue, do they appear on Elementor edit page? Or is it not appearing on front despite it appearing on Elementor edit page? Please let us know about this so that we could know about the issue in detail. If the images are not coming in the edit page, the migration might not go well. Also, provide the link of the page where the images are not loading.

    Thanks.

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

You must be logged in to reply to this topic.