Hi,
Thank you for sharing the mockup, to modify specific icon box please add the below css to quick css and the custom css class name “icon-offset” to the icon box element.
.icon-offset .avia-image-container-inner {
margin-top: -200px;
}
Let us know if you have any questions.
Best regards,
Vinay
Hi,
My web http://www.clickam.es have problemes with videos since update to wordpress 4.5. Look at the video at the home page.
I follow the instructions with your post https://kriesi.at/support/topic/having-problems-after-updating-to-wordpress-4-5-please-read-this-first/ but it isn’t work.
Help me, please
I tried adding quick CSS with both auto and 30px and not change. The bottom of the captcha still shows part of the top border. Right now you can see how it looks with the auto.
Unfortunately there is not an option to change the captcha style/version with Events manager Pro. It has a built-in field for captcha and when added it uses this old style Google captcha. This seems to show fine with other themes but for some reason with Enfold it has the style broken.
Thank you!
Now it seems to create another problem. It was working fine previously.
http://strategistshub.com/articles/

The image originally when it was above the title stretch full width. Now it seem to become smaller and align to the center.
Adding the following code to the css does not help.
.big-preview { padding: 0 !important; margin-top: 20px;}
-
This reply was modified 9 years, 7 months ago by
hzy17079.
Hallo Diana,
I’ve tagged the topic for our german speaking moderator, please wait for his reply.
Grüss,
Rikard
Hi there,
I’d like to create a number of pages that have a picture one the left and a contact form or text box on the right (see the two images attached). The two should be aligned at the top. At this point, they are aligned at the middle of the content elements. How do I change this? Thanks in advance!
Best, N
Hey Dörte,
I’ve tagged the topic for our german speaking moderator, please wait for his reply.
Best regards,
Rikard
Hi,
Glad we could help, please let us know if you should need any more help on the topic.
Thanks,
Rikard
hi, sorry the the projects stop for a time.
the site is at maintenance mode and i have deactivate yoast plugin, because i can´t edit the product category pages in the backend, if i activate it by the enfold theme. So you must activate it.
I sent a pm.
kind regards
Hi Dörte,
I don’t understand most of your posts above since my german is not too good but I’ve tagged our german speaking moderator for the topic, please wait for his reply. Note that each time you reply to your own topic it gets pushed to the back of our support queue so please try not to do so unless you think it’s absolutely necessary.
Best regards,
Rikard
Hey!
Change the CSS with
#top .avia-button.avia-color-light {
text-decoration: none;
}
let us know if that works out for you.
Regards,
Basilis
I figured out that you can make two sections, one that ill hide on desktops/tablets, one that ill hide on mobiles.
I named the section socialjustice, but when I use .socialjustice as an identifier, it doesn’t work.
Here is the code I’m using:
@media only screen and (max-width: 728px) {
.socialjustice {
display: none !important;
}}
What a I missing here?
I’ve been trying, trying, trying to use the @mobile stuff and its just not working.
I don’t want to simply disable the parallax, I want to replace the parallax effect with a simple background (image or color) on mobile – while keeping the other elements there.I do not want to hide the entire section on mobile.
According to you guys, the code automatically disables the parallax effect. This leaves a tiny version of the desktop image sandwiched in between two black boxes. Is there a way to get rid of this small image and black boxes and replace it with a different background? In theory, the code should be pretty simple, but its not working. I tried using your code from the previous message as a test and it didn’t work.
At the moment, I would prefer not to hire a freelance developer. This is not a complicated issue. In the past, I’ve had theme support go into my site and make the changes for me. I’m even asking for that, but can you please help me get this done.
Thank you
Hi,
1. there seems to be an issue with the tables on mobile now, when set to display data and then set to scroll on mobile all of the text overlaps.
2. when using WPML and the dropdown language selector option, we would like to see the small down arrow after the first language at the top in the topbar so people can see that there are options. how do we add this back in please?
Thanks,.
Hi,
You can disable that behaviour but you have to modify the js > avia.js file which is a script file that can’t be modified in a child theme. You have to repeat the modification every time you update the theme. If you’re still interested, edit the file then look for this code around line 464:
win.scrollTop(0);
mobile_advanced.css({display:'block'});
Remove this line:
win.scrollTop(0);
Best regards,
Ismael
Hi,
I’m sorry but we cannot hand in our ip addresses. A workaround is to add an actual video element in addition to the color section. Hide it on desktop then display it mobile. You can do that by using css media queries. More info here: http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/
Best regards,
Ismael
Hi,
Please use this to make it transparent:
.avia-slideshow-arrows a:before {
background: transparent;
}
And change the color of the arrows with this:
#top .avia-slideshow-arrows a {
color: red;
}
Best regards,
Ismael
Hi,
Add a unique Section ID to the top color section then use that in place of the “.avia-section” selector. For example, if you use “custom-section” in the Section ID field, the selector would be “#custom-section”.
Best regards,
Ismael
Hi!
Thank you for using Enfold.
The solution on the previous thread is not going to work properly anymore because the product template has been modified. Please undo the modifications then follow the instructions here: https://kriesi.at/support/topic/sidebar-rechts-single-page/#post-580220
And if possible, please post long codes on pastebin.com.
Best regards,
Ismael
Hey,
No, i’m afraid that’s not possible, mobile browsers disable video autoplay due to limited data-usage.
Best regards,
Josue
Hi,
The sidebar height adapts to the content height now. Replace the css gradient with the following:
.container_wrap.sidebar_right {
background: -webkit-gradient(linear,right top,left top,color-stop(#f1f1f1,0.295),color-stop(white,0));
background: -webkit-linear-gradient(right,#f1f1f1 29.5%,white 0);
background: -moz-linear-gradient(right,#f1f1f1 29.5%,white 0);
background: -o-linear-gradient(right,#f1f1f1 29.5%,white 0);
background: linear-gradient(to left,#f1f1f1 29.5%,white 0);
}
If it’s not working, try this:
.container_wrap.sidebar_right {
background: -webkit-gradient(linear,right top,left top,color-stop(#f1f1f1,0.295),color-stop(white,0));
background: -webkit-linear-gradient(right,#f1f1f1 29.5%,white 0);
background: -moz-linear-gradient(right,#f1f1f1 29.5%,white 0);
background: -o-linear-gradient(right,#f1f1f1 29.5%,white 0);
background: -ms-linear-gradient(to left,#f1f1f1 29.5%,white 0);
background: linear-gradient(left,#f1f1f1 29.5%,white 0);
}
Best regards,
Ismael
Hi,
Can you try implementing this (just need to swap some classes to target grid row instead of accordion slider)?
Best regards,
Josue
Hey!
Try adding this code to the Quick CSS:
#top #header .av-main-nav > li.av-menu-button-bordered > a .avia-menu-text, #top #header .av-main-nav > li.av-menu-button-bordered > a .avia-menu-subtext{
color: #7d7d7d !important;
}
Cheers!
Josue
Hi Ygit,
The solution works but creates two more issues.
1. The three bars in the mobile menu do not turn transparent (white) as on the tablet.
2. All pages that do NOT have a slider with transparent menu are cut off when viewed on mobile. (The text/image at the top of these pages fall behind the menu bar).
Best regards
Simon
Just as an FYI and for anyone else, I just added this to the top of the template-builder.php file in my Child Theme:
if ( is_singular( ‘books’ ) ) {
get_template_part( ‘single-books’ ); exit();
}
and caused the correct template to be used, so I think it’s fine now, but still confused why it’s not using the single-books.php right away.
Hi Yigit,
Thanks for the response but it doesn’t seem to work? Do I need to do anything else within the site to help the code work?
Below is the complete quick css box in case something is contradicting it? Thanks for your help.
#avia-menu {
margin-left: 30%;
}
@media only screen and (max-width: 767px) {
h1.av-special-heading-tag { font-size: 35px !important; }}
.av-subheading_below {
margin-top:50px!important;
}
.av-image-caption-overlay p {
text-align: left;
margin-top: -70px!important;
}
@media only screen and (max-width: 767px) {
.av-subheading {
font-size: 20px!important;
}}
.page-id-144 .avia-content-slider .slide-image { display: none; }
I was hoping to have two menus situated similarly to http://wellnessmama.com/ – is it possible for the secondary menu to either show up below the header or to the right of the logo as opposed to the top little area?
Hi,
Love the theme but bit stuck on one issue. I would like to place a logo at the top of the header that is full width ( 2020px ) x 229px. I tried to set the logo as a background image in the header … which looks good on a laptop but it does not shrink with the screen size.
I also tried the following quick css:
.logo img {
height: 100px;
width: 1200px;
}
and that did not work either…
Also tried css…
.html_header_top.html_logo_center .logo {
left: 0;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
and it almost worked, just not all the way to the edges, but almost there.
Do you have any suggestions ?
Thank You very much.
Hi!
Please add following code to Quick CSS
#top #wrap_all .error .input_checkbox_label {
text-decoration: underline;
}
Best regards,
Yigit
Hi guys,
I’ve successfully used your documentation to add a new, custom widget to the header area (i’ve named them header1 and header2).
The code in the functions.php file for the two headers are:
add_action( 'ava_after_main_menu', 'enfold_customization_header_widget_area' );
function enfold_customization_header_widget_area() {
if(is_front_page()){
dynamic_sidebar( 'header1' );
dynamic_sidebar( 'header2' );
}
}
However, the two custom widgets needs to be located two different places, but for some reason the CSS code wont work properly since both custom widget headers are only affected by the #header2 .widget code (below):
/* Header clock CSS */
#header1 .widget {
left: 91%;
padding-top: 0px;
position: absolute;
top: 80%;
padding-bottom: 0px;
z-index: 1;
}
/* Header ticker CSS */
#header2 .widget {
left: 75%;
padding-top: 0px;
position: absolute;
top: 90%;
padding-bottom: 0px;
z-index: 1;
}