Hi Ismael – okay – this is what I’m trying to do – sorry I wasn’t very clear, never mind having 2 background images…I’ve combined them into one PNG and stretched it to fit – so ignore – however I’m still having issues as per below:
1 – I’ve attached a background image to the avia layout builder
2 – I’ve also written some custom styles to make the blue coloured section have a coloured gradient (see below)
however the issue is – when I add my custom class to the ‘coloured’ module of the layotu builder – as per below – the background image that I’ve uploaded dissapears…
How do i a) have the background image I’ve uploaded and the gradient appear…..
thanks
.sd-blue{
border-bottom: 20px solid #ffc72d;
background: #3574b9; /* Old browsers */
background: -moz-linear-gradient(top, #3574b9 0%, #16304d 100%) !important; /* FF3.6-15 */
background: -webkit-linear-gradient(top, #3574b9 0%,#16304d 100%) !important; /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #3574b9 0%,#16304d 100%) !important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#3574b9′, endColorstr=’#16304d’,GradientType=0 ); /* IE6-9 */
}
Hey echristoperj,
Please try the following in Quick CSS under Enfold–>General Styling:
.home .avia-caption-content {
padding-top: 120px;
}
Best regards,
Rikard
Hi,
Displaying background images the same on all types of screens is more or less impossible unfortunately due to the different dimensions of screens, one option you could try would be to create a second section which will only show for mobile devices, and use an image better adapted to small screens. You can then use CSS like this to hide/show the correct section:
@media only screen and (max-width: 767px) {
#desktop-section {
display:none !important;
}
}
@media only screen and (min-width: 768px) {
#mobile-section {
display:none !important;
}
}
Best regards,
Rikard
Yes you are doing something wrong. You are ending up on the results page. See top left corner of the pen. Change tabs to html and css.
P
Hello,
I installed the Plugin W3 Total Cache.
Now just the preload-site appears and I can’t see the rest of my website.
If I deactivate W3TC everything works fine. Could you tell me what I did wrong?
Perhaps it would be helpful if you login and check the settings of W3 Total Cache. (login credentials in private content)
Another topic is, I need a shrinking header on tablets as well. Is this possible? Otherwise it would be great when the header has the half size ONLY on tablets…
Thanks in advance for your help.
BR
Hello Ismael,
Kindly close the topic. I found the bug; my mistake. Thank you for your support.
Grüße
Jyothis
Hi Vinay,
That had no effect at all. However I know what’s happening – just not how to stop it. I removed the css that allowed me to make the “Nicholas Sansbury Smith” a font size of 75. It is adding space above and below at a font size of 75 however there is nothing above or below – not even a space.
Thanks,
Nathan
-
This reply was modified 9 years, 10 months ago by
norcalnathan.
Hi,
ich habe alles exakt so gemacht wie hier beschrieben – Nur leider erhalte ich nur eine Fehlermeldung:
https://kriesi.at/support/topic/forms-how-to-limit-number-of-rows-in-message-text-imput-window/
“No direct script access allowed”
Was mache ich falsch?
Danke für jeden Tipp!
LG
Jens
Hi!
I have removed the xcreenshot.
Please do not that when you post multiple times, on the top of an image, it drives it last to the que.
Please do try to avoid that.
THanks a lot
Regards,
Basilis
I am working on a site where the default language is danish.
The top of the pages is:
<!DOCTYPE html>
<html lang=”da-DK” prefix …..
On two pages (German and English) I want to change
<html lang=”da-DK”
to
<html lang=”en-US”
and
<html lang=”de”
Is it possible in the enfold theme ?
Thanks for your reply
just made few css adjustnemt on child css and managet to display the thumbnails at the side of the big pic.
this is even better than the top.
also fixed the croping of thumbnales like it was sujestet in other topic.
all good.
Hi,
Great, glad you got it working. Please let us know if you should need any more help on the topic.
Regards,
Rikard
Hey norcalnathan,
To reduce the gap or specify your own on advanced layout elements. Please enable the custom css class name for the advanced layout elements and add this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
.custom-class-name {
margin-top:30px!important;
margin-bottom:30px!important;
}
Best regards,
Vinay
-
This reply was modified 9 years, 10 months ago by
Vinay.
Hi,
If you look at the home page, you’ll see a text box at the top with “Nicholas Sansbury Smith” and social icons below. There is a lot of space above and below “Nicholas Sansbury Smith” and below the social icons.
I need to be able to specify the spacing above and below “Nicholas Sansbury Smith” and below the social icons and the text box below it.
Your help is appreciated!
Thanks!
Nathan
-
This topic was modified 9 years, 10 months ago by
Yigit.
Hey ShortieD,
Thank you for using Enfold.
Please refrain from creating duplicate threads. Thank you. https://kriesi.at/support/topic/class-styles-not-working/
Best regards,
Ismael
Hey ShortieD,
Thank you for using Enfold.
Remove the image background from the color section then add this in the QuicK CSS field:
.sd-blue:before {
content: '';
display: block;
width: 100%;
height: 100%;
position: absolute;
background-image: url(https://rfl.shortiedesigns.com/wp-content/uploads/2016/06/blue_bg_top.png);
background-position: top right;
background-repeat: no-repeat;
}
Best regards,
Ismael
Hi,
Thanks for the info!
Please also add the following code:
.sub-menu.avia_mega_hr {
padding-top: 0px !important;
}
Also the text is no longer bold. Please try clearing your browser’s cache and refreshing the page.
Best regards,
Jordan
Hey!
That is a bit of a strange issue.
Can you please provide us backend access so we can give it a look.
Please be also patience and do not double post on a topic, as it gets back and last to the line, until we check it.
Regards,
Basilis
thanks
what about the summary font size (“This title is a direct quote from a conversation with Erasmus…”)
any any update on this ticket which is directly related to this section
Hey!
Please refer to this post – https://kriesi.at/support/topic/woocommerce-2-6-problem-urgent/#post-650161 for the workaround. We will release an update soon :)
Best regards,
Yigit
I added a screenshot showing what I am asking. We use the categories as menu items… so we have the category info in a post that is always at the top of the results. Is there a way with the archive (category results) listings to have the top post under the glossy menu like a page or post can be?
Hey znong51,
Thanks for getting in touch with us!
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
#top #header .mega_menu_title a {
font-size: 15px;
font-weight: initial;
}
#top #header .avia_mega_div > .sub-menu {
padding-top: 0px;
padding-bottom: 0px;
}
Best regards,
Jordan
Hi Ismael,
Yes, the site is 100% Enfold. I have now regenerated thumbnails (plugin: Regenerate Thumbnails) and it is still the same issue. Something else is surely wrong and speaking with Woocommerce people they advise to go to theme builders. I know categories can work for the same size as we see them in the demo here: http://kriesi.at/themes/enfold/shop/
Also, it seems off that I am having similar issues with the related thumbnails being too big and displaying incorrectly with a huge coloured background as in the same ticket here: #651631
Thanks
Vincent
thanks for reply
same problem it looks fine on desktop but not on ipad and mobile phone, they both still have that space under the video. I need to remove that space it should sit flush with the gray footer / bar below it, with no gap. The 2nd picture in the following screen shot shows the exact issue
https://postimg.org/image/nbqa4n7i9/
if you dont load it on ipad you wont notice
-
This reply was modified 9 years, 10 months ago by
Ivygrace808.
Hi,
Please disable the search icon in the Enfold > Header > Extra Elements panel then follow the solution here: https://kriesi.at/support/topic/swap-magnifier-for-text-search/#post-616206
Best regards,
Ismael
Back for more help with big yet seemly easy to fix issue :)
I had my new site about 95% done and a big issue has appeared. The problem is there is a 10 or 15 pixel white space below a video embed that I can not figure out how to remove. This problem only seems to effect ipads and mobile phones, because everything looks great on desktop but not on ipads or mobile phones (in landscape / portrait view as well both have the problem)
I’ve tried all the obvious stuff but I’m stumped……?
I followed some enfold threads and added a Custom Css Class to my text block (that has the video embedded in it) and tried to zero out the padding but that is not working.
Details of what I did: With the .videofix custom class added to the text block in question, I then applied the following css style to it.
}
.videofix {
padding-top: 0px!important;
padding-bottom: 0px!important;
}}
But again that is not working…………….. ?????????????????
I also tried media queries too, but can’t figure why this white space is being so stubborn? I’m not the best with media queries, which I assume is the problem though it could be something else?
Please help me remove this white space I’m stuck :(
I have attached a pic that shows the problem https://postimg.org/image/nbqa4n7i9/
and my private details and site URL info as well.
Any help would be much appreciated…
Thanks
Ivy
-
This topic was modified 9 years, 10 months ago by
Ivygrace808.
Hi,
Great, glad you got it working. Please let us know if you should need any more help on the topic.
Best regards,
Rikard