-
Posts
-
Hi there,
I am using the church theme and noticed on the mobile that the title is stuck right under the background picture. On the pc it is fine. I thought maybe just put a whitespace above the title but I got many pages. Is there another way? See here for example.
Thank you!Hey Vasilis,
I can’t see anything like that on my end, could you post a screenshot of the problem please? Also let us know in which browser and device you are seeing it on.
Best regards,
RikardHi Rikard,
it is https://drive.google.com/open?id=1_H-Q3r-H_tY_e4MFFk8-9NfS8q_RmkJm.
I am checking on both goggle chrome and Samsung Internet.
Thank you!
Hi samvasgr,
We cannot see the screenshot, please upload it to a service like https://imgur.com/upload and give us the link here.
If you need further assistance please let us know.
Best regards,
Victoriacan you see if below is ok?
hereHi samvasgr,
Thank you, yes I can see the screenshot now.
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (max-width: 767px) { .responsive #top .flex_column_table { margin-top: 20px !important; } }If you need further assistance please let us know.
Best regards,
VictoriaThank you for your response Victoria.
It worked however I find that the space is a bit too big. I changed it to 10px and 5px but it still looks the margin is too big and does nto seem to be changing.Hi samvasgr,
https://cl.ly/e55f55699b9f Looks fine on my end, can you share a screenshot of how you see it now?
Best regards,
VictoriaIt is more or less the same… I was wondering if it is possible to reduce the whitespace over the titel… see here
if not it is also ok…Hi samvasgr,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (max-width: 767px) { .responsive #top #wrap_all #av_section_2 .flex_column { padding-top: 10px !important; } }If you need further assistance please let us know.
Best regards,
VictoriaHi Vict;oria,
I tried it on both quick css and costum.css and it shows whenever i refresh it show the title for 1 sec and then it seems that the image is oberlapping the title and i cannot see the title anymore.Thank you!
Hi,
Thank you for the update.
We can’t reproduce the issue on our end. The image doesn’t overlap or cover the title. Can you provide a screenshot of the issue? You can use loom to create a screen record.
Best regards,
IsmaelFrom what I can see by by signing up it is for laptop only? The issue is on the mobile.. Is there something for mobile phones?
Thank you!Hi,
Thank you for the update.
You can create a screenshot from your mobile phone and upload it to imgur or dropbox, then post the link here. Again, we couldn’t reproduce the same issue on our end. Where are you testing it?
Best regards,
IsmaelHi Ismael,
please find attached image. I am using Samsung Internet and Google Chrome on my mobile… When looking at it in the end it does not look so bad, as the title I was using is the same as the one in front of the title. If it could be fixed though would be good, otherwise i might hide the Special Heading element with the title in the mobile version without putting any code…..Thank you!
Hi,
Thank you for the screenshot.
This css code should adjust the stack order of the color section containing the heading, making sure it is above the first section.
.page-id-656 #av_section_2 { z-index: 9999; position: relative; overflow: visible; }Please add it in the Quick CSS field or the child theme’s style.css file. And don’t forget to toggle the Performance > File Compression settings after adding the code. If it’s still not working, please post the login details in the private field so that we can check the issue further.
Best regards,
IsmaelCa you please tell me with the file compression?
I got CSS file merging and compression & Javascript file merging and compression as enalbedNo it is still the same issue. On some pages the special heading is overlapped by the image. It is more obvious on some pages like https://aimonas.gr/το-χωριό-aΐμονας/ιστορικά-γεγονότα-του-αΐμονα/β-παγκόσμιος-πόλεμος/ where there is a title is hidden and the subheading text is stuck under the image.
Posting login details in private area.Thank you!
Hi,
Thank you for the update.
We removed an invalid code in the Quick CSS field and disabled the file compression settings temporarily. Please check the page again. (see private field)
/*outline button color*/ #top .avia-button.avia-color-dark { border-color: #719430;!important; }We removed the semi colon after the hex value.
Best regards,
Ismaelon all these subpages it does not appear correct.
thank you!Hi,
Thank you for the update.
You may need to add a custom css class attribute to those sections. Please enable the custom css class field from the Enfold > Layout Builder panel. Look for the “Custom CSS classes input field” and set it to the third option (Show and allow to edit classes). After that, edit the sub pages and look for the color section with the title. In the element’s panel, go to the Developers tab and add the class name “with-title” in the Custom CSS Class field. You can then use this css code in the Quick CSS field.
.responsive #top .with-title { z-index: 9999; position: relative; overflow: visible; }Best regards,
IsmaelHi Ismael,
I cannot find this option. Please find here screenshot with availble options.
I have not updated to Enfold 4.6.3.1 yet… Would it be safe to do so? Sometimes I think there could be some bugs until it is fully tested?Thank you!
Hi,
Thank you for sharing the details.
We recommend updating to the latest version of the theme. In the latest version, this options is enabled by default. Please do backup any custom modifications before proceeding with the update.
You may not see the changes until the cached files are cleared in your browser.
Please perform the below steps to clear the browser cache:
1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right-click on the refresh button and select “Empty Cache and Hard Reload”.
Best regards,
VinayThank you for you reply Vinay. The issue is on the mobile phone, so there is no use to refresh the page on the laptop or desktop.
I just removed the code that Victoria initally provided:
/*Church theme title on mobile space*/
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all #av_section_2 .flex_column {
padding-top: 10px !important;
}
}
and it now the special heading elements appeas again, but it is stuck just under the image. The only page it looks correct is https://aimonas.gr/%cf%84%ce%bf-%cf%87%cf%89%cf%81%ce%b9%cf%8c-%ce%b1%ce%90%ce%bc%ce%bf%ce%bd%ce%b1%cf%82/%cf%84%ce%bf%cf%80%cf%89%ce%bd%cf%85%ce%bc%ce%af%ce%b5%cf%82/ .Hi,
Thank you for the update.
You have to upgrade the theme to the latest version (v4.6.3.1) and try our previous suggestion above. Don’t forget to create a site backup or a restore point in case something goes wrong during the update.
Best regards,
IsmaelHi Isael,
I am creating a backup with Updraft plus (you thik it is a good plugin?) and will update afterwards.Thank you!
- You must be logged in to reply to this topic.