Viewing 22 posts - 1 through 22 (of 22 total)
  • Author
    Posts
  • #1178709

    Dear Kriesi Team,

    after a recent software update from Apple for Tablets (iPadOS 13.3), background images in a color section are no longer displayed correctly. The images appear oversized, i.e. only a section of the image is displayed over the entire area.

    Websites are displayed correctly on Macbook or iMac.

    I work with the Enfold theme and currently have this problem on all my websites.

    How can I solve the problem?

    Thanks for a quick response.

    #1179522

    Hey Sabine,

    Please have a look at the following article:

    If you need further assistance please let us know.
    Best regards,
    Victoria

    #1179771

    Dear Victoria,

    thank you very much for the support.

    Unfortunately I am a layman and don’t know where to file the corresponding changes. I tried it under “Design>> Customizer >> Additional CSS” and under Theme Options “General Styling >> Quick CSS”. Both did not work.

    Where exactly can I find the place to fix the problem? ”
    >>To fix this problem, add the following below the existing media queries in Parallax Pro’s style.css

    Thanks for a reply!

    Many greetings also Hamburg
    Sabine

    #1181091

    Hi,

    Unfortunately, it would require quite some time and customization of the theme to achieve this, so I am sorry to tell you that this is not covered by our support. However, if it’s really important for you to get this done, you can always hire a freelancer to do the job for you :)

    Best regards,
    Basilis

    #1181682

    Lieber Basilis,
    hab Dank für Deine Antwort. Ich schreibe nun auf Deutsch zurück, weil ich mich vermutlich in Englisch nicht richtig ausgedrückt habe.
    Wenn ich das Problem richtig verstanden habe, dann wird auf ApplePRO das grafische Stilelement “Farbffeld” (hinterlegt mit einem Bild) nicht korrekt angezeigt. Um das zu beheben, muss man einen CSS Code einfügen. (>>To fix this problem, add the following below the existing media queries in Parallax Pro’s style.css)

    Meine Frage ist, an welcher Stelle ich es im Theme oder im Farbfeld einfügen muss, um die Richtigkeit der Anzeige zu gewährleisten, da ich meine Seiten eigenständig bearbeiten können muss und es mir nichts nutzt, wenn ich das Problem nicht verstehe. Ich kann zwar die bestehenden vier Websites von einem Freelancer korrigieren lassen, würde aber bei jeder Umgestaltung und Neugestaltung der Website das immer gleich Problem produzieren und müsste immer von einem Freelancer korrigieren lassen, was fehlerhaft dargestellt wird. Oder ich müsste es grundsätzlich lassen, mit Farbfeldern zu arbeiten, was das Theme nutzlos für mich macht. Das wäre sehr schade.

    Denn das heißt ja für alle zukünftigen Seitengestaltungen, dass – wenn ich mit dem grafischen Stilmittel “Farbfeld” arbeite – es von ApplePRO in der Darstellung immer falsch bzw. verzerrt dargestellt wird (was ich prinzipiell ziemlich unglücklich finde, aber das ist ein anderes Thema).

    Konkret meine Bitte:
    – Bitte lasst mich wissen, wo genau ich den CSS Code ändern muss. Das kann gern beispielhaft sein, um es dann auf all meine Seiten anwenden zu können. (>>To fix this problem, add the following below the existing media queries in Parallax Pro’s style.css) Damit ermöglicht Ihr mir, bei der Gestaltung von neuen Seiten (mit Farbfeldern) von Anbeginn den CSS Code hinzuzufügen, um die Webseiten korrekt dargestellt zu wissen.
    – Wenn möglich, lasst mich auch wissen, welche Einstellung für die Arbeit mit “Farbfeldern” für Apple unproblematisch sind und welche nicht akzeptiert werden von ApplePRO.

    Sollten diese Informationen nicht unter Euren Support fallen sondern kostenpflichtig sein, will ich das ja auch gern bezahlen. Aber ich bitte um Verständnis, dass ich das Problem verstehen muss, um weiter eigenständig mit Eurem Theme arbeiten zu können.

    Mit sonnigen Grüßen aus Hamburg
    Sabine

    #1182166

    Hi,

    Can you please write for us in English?

    Best regards,
    Basilis

    #1182178

    Dear Basilis,
    thank you for your answer. I probably did not express myself properly in English. I will try again:
    If I have understood the problem correctly, then the graphical style element “color field” (backed with a picture) is not displayed correctly on ApplePRO. To fix this, I have to insert a CSS code. (>>To fix this problem, add the following below the existing media queries in Parallax Pro’s style.css)

    My question is where to insert it in the theme or in the color field to ensure that the display is correct, since I need to be able to edit my pages on my own and it does not help me if I do not understand the problem. Although I can have the existing four websites corrected by a freelancer, every time I redesign the website, I would always produce the same problem and would always have to have a freelancer to fix what is displayed incorrectly. Or I would basically have to stop working with color fields, which makes the theme useless for me. That would be a great pity.

    Because for all future page designs this means that – when I work with the graphical stylistic device “color field” – ApplePRO always displays it incorrectly or distorted (which I find rather unfortunate in principle, but that’s another matter).

    Concretely my request:
    – Please let me know where exactly I need to change the CSS code. This can be exemplary, so I can apply it to all my pages. (>>To fix this problem, add the following below the existing media queries in Parallax Pro’s style.css) This will allow me to add the CSS code from the beginning when designing new pages (with color fields), so that I know that the web pages are displayed correctly.
    – If possible, please let me know which settings for working with “Color Fields” are unproblematic for ApplePRO and which are not accepted by ApplePRO.

    If this information is not covered by your support but is subject to a charge, I will gladly pay for it. But please understand that I have to understand the problem to be able to continue working with your theme independently.

    With sunny greetings from Hamburg
    Sabine

    #1185269

    Hi Sabine,

    We are sorry for the late reply!

    Please edit your Color Section elements where you are experiencing this issue, and give them a custom CSS class under Advanced > Developer Settings – https://imgur.com/a/xmfaS4q and then add following code to Quick CSS field in Enfold theme options > General Styling

    @media only screen 
      and (min-width: 1024px) 
      and (max-height: 1366px) 
      and (orientation: landscape) 
      and (-webkit-min-device-pixel-ratio: 1.5) {
        .ipad-pro-fix {
            background-attachment: scroll !important;
        }
    }

    If you are experiencing this issue on all of your Color Section elements, you can use the code as following as well

    @media only screen 
      and (min-width: 1024px) 
      and (max-height: 1366px) 
      and (orientation: landscape) 
      and (-webkit-min-device-pixel-ratio: 1.5) {
        .avia-section {
            background-attachment: scroll !important;
        }
    }

    We are going to look further into the issue. If you could share a screenshot showing the issue, that would greatly help us. You can upload your screenshots on imgur.com or Dropbox public folder and attach the links here :)

    Best regards,
    Yigit

    #1185447

    Hello Yigit,

    Thank you very much for your help! I have adapted my pages according to your instructions. The general code didn’t work, but with the entry of the CSS code “ipad-pro-fix” in the color sections the display on the iPad pro now works at least for the broadside. If I put the iPad upright, the problem unfortunately remains.
    Here are the pages in the before and after editing https://imgur.com/a/zqKuxV4. You can see when you turn the iPad pro from landscape to portrait that the old problem is back.
    I would be grateful if this could be solved as well.

    Best regards,
    Sabine

    #1185594

    Hi Sabine,

    Unfortunately I do not have an iPad Pro, therefore i am not able to test on actual device but could you please try changing custom CSS to following one

    @media only screen 
      and (min-width: 1024px) 
      and (max-height: 1366px) {
        .ipad-pro-fix {
            background-attachment: scroll !important;
        }
    }

    Orientation was defined as landscape in previous code, maybe that is why portrait mode did not work. Could you please try this one and let us know? :)

    Best regards,
    Yigit

    #1185659

    Hi Yigit,
    I changed the CSS code, but unfortunately it does not fix the problem. In “Portrait” mode the error remains. Thanks a lot for taking care of it!

    Best regards,

    Sabine

    #1185664

    Hey,

    Are you using 10.5 inch version or 12.9 inch version of iPad Pro? If 10.5, updating the code to following should help

    @media only screen 
      and (min-width: 834px) 
      and (max-height: 1366px) {
        .ipad-pro-fix {
            background-attachment: scroll !important;
        }
    }

    Regards,
    Yigit

    #1185685

    Hi Yigit,

    I have the little iPad Pro. Your code works when I enter the following size:

    @media only screen
    and (min-width: 767px)
    and (max-height: 1366px) {
    .ipad-pro-fix {
    background-attachment: scroll !important;
    }
    }

    Do I need additional CSS code for the big iPadPro? Or does the code cover both sizes? (I’ll be at a friend’s house tonight and can check it out)

    Many thanks
    Sabine

    #1185705

    Hi Sabine,

    Perfect! I do not think it should be necessary but if you have a chance, please check. I took the dimensions from Safari’s responsive mode and it shows iPad Pro’s landscape size as 1366px. If it does not work, you may need to increase the value in following line

    and (max-height: 1366px) {

    Best regards,
    Yigit

    #1205781

    Hi, Yigit,

    on my magazine page, the column for Custom CSS class in the color section has disappeared. On my other three pages it is still visible. How can I make it visible again?

    I need it urgently to use this ipad-pro-fix code. Otherwise all my images will be displayed incorrectly on the iPad.

    Thanks for a quick help.

    Farb-Sektion ohne CSS

    #1206297

    Hi Lueder,

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    • This reply was modified 4 years, 7 months ago by Victoria.
    #1210664
    This reply has been marked as private.
    #1210703

    Hi Sabine,

    Thanks for the logins!

    Could you please switch user role to administrator? :)

    Best regards,
    Yigit

    #1210718

    Hi Yigit,

    I’ve done that. Thanks for your help!

    One more question:
    Normally I can see two arrows in the header of the post image that lead to the next post page. This function is not available on mobile phones. Does it need an extra code to make it visible on a mobile phone screen?

    Best regards,
    Sabine

    #1210763

    Hi,

    “Hide template builder developer options” was enabled in Enfold theme options > Layout Builder tab. I simply enabled it.

    Also, I adjusted your custom CSS code in Quick CSS field and added this code to display post navigation on mobile – https://kriesi.at/documentation/enfold/portfolio-grid/#prev–next-arrows-on-mobile

    Please review your website :)

    Best regards,
    Yigit

    #1212525

    Thank you so much!!!

    Best regards,
    Sabine

    #1212581

    Hi,

    You are welcome, Sabine! Let us know if you have any other questions or issues :)

    Best regards,
    Yigit

Viewing 22 posts - 1 through 22 (of 22 total)
  • The topic ‘Problems after a recent software update from Apple for tablets (iPadO’ is closed to new replies.