Forum Replies Created
-
Posts
-
Hi Mike,
I appreciate the effort in trying to get this resolved and understand the issues with integration into Enfold and WordPress.
I will continue along the path of using both WordPress and specific Html pages to achieve the desired need for this app.
I will contact PWA developers and see how it could be integrated.
All the best.
MarcMorning Mike,
Thank you for your response.
I have created a test page in WordPress for the following 3 options which you can access here:
https://mobi.henleyair.tv/hangarcam/ but you would need to do F11 to see it in mobile view.I have tried each of the 3 suggestions above and will respond to issues as such here below:
Option 1:
See link for emulated mobile device output https://mobi.henleyair.tv/html/Enfold_01Dec2024-01.png
As you rightfully say, this option stretches the image to fit within the confines of the whole mobile screen. Obviously, it is distorted.Option 2:
See link for emulated mobile device output https://mobi.henleyair.tv/html/Enfold_01Dec2024-02.png
I get the same output as in Option 1 with a stretched image.Option 3:
See link for emulated mobile device output https://mobi.henleyair.tv/html/Enfold_01Dec2024-03.png
This output has the best result so far out of the 3 options.
However, as you have said, the code for this option fixes the webcam image in the centre of the screen. Also, it fits the webcam image to a height larger than the screen size which means you have to scroll up and down to see it.In Option 3 the code needs to allow for the webcam image to scroll left and right so that the user can see the whole image. So to start with it should be fixed to align left on the screen.
I would like to suggest that you open up the site mobi.henleyair.tv on your mobile device and use “Add to Home Screen” (iOS) or “Save App” (Android) on your mobile device. This will then let the site operate as a Progressive Web App on your device. Then select any of the webcam images and click on that. You will then see that the webcam image displays at the full height of the mobile device screen, but you can then swipe right and left to see the rest of the webcam image.
This is the exact same effect I am trying to achieve through Enfold and WordPress so that I can do away with the HTML pages that do this effect.
Hope this feedback helps.
Marc
Thank you Nikko,
That works.
Where would I be able then to format the font style? Would that be done somewhere under Enfold > Theme Options > Advanced Styling?
Thanks,
MdF
Morning Rikard,
Thank you for your reply. That fix does work.
However, following this through, I think that providing a CSS solution to someone like me that does not understand CSS at all, I feel that the fix should rather be provided within the programming structure of Enfold. By this I mean, Enfold has worked amazingly well for me because it is so simple to use. It is intuitive and does very elegantly what I have paid for.
I do not want to have to include CSS in any form in my web design. In this regard, I delved a bit further into Enfold after I posted here yesterday and I found that there is a solution to this in the normal options of Enfold. I went to General Styling > Main Content > and then cleared the Border Colours option.
This solved my initial problem but it has created a secondary problem as follows:
Clearing the Border Colours option has now also removed the two horizontal lines on either side of the icon which I added as a Separator below each main heading. I have left the site like this so you can see what it is currently showing.
I then thought that this is actually not a problem as I could go in to the properties of the Separator and add my own colour. This does indeed work.
However, if I could make a suggestion going forward. Maybe the horizontal lines in the Separator could be defined as Lines and not Borders, then they will remain with their default colour option as set in the theme. I would then not have to go in and edit the Separator line colours.
I hope the above description makes sense. If not, please let me know and I will try and decribe the second issue better.
Thanks,
Marc
