Compare the two screenshots. In portrait mode I need the background photo to move left. However in landscape mode it is fine.
These screenshots were annotated for another topic, but they have annotations for this discussion as well. Just look at the image in the background on portrait.
What are your suggestions? Please give me CSS to move it and then let me know if you have another better solution.
Thank you,
Jas
Thank you Andy! I’ll check out that article.
Almost perfect.
Look at the first screenshot. The section is too large in portrait mode but it is good for landscape mode. What are you recommendations? That section should not be twice the height of the image slider at the top of the page. The image slider is the focus, the header, not this section.
I like this element but I’d like to find a solution for all my sites. I’d like to continue to use it.
Thanks!
Hi Yigit!
Thanks a lot for your help. It works great.
The other design issue I”m facing is concerning the active tab background color.
I would like both the active and inactive tabs to have a white backgroung (as well as the active tab content).
Right now, I’m missing the white backgroung for the active tab : it is light grey for desktop screen size and blue of mobile devices.
Thanks in advance to let me know how you would close this gap!
Steph.
Thanks for the help Andy but unfortunately that didn’t solve it.
Changing the main header height creates new alignment issues with all the header elements.The only solution I can think of is having the page elements below the header shift upwards at the moment the top header disappears to compensate for the new empty space but I can’t figure out how to accomplish it.
I’m using the following code to make the header transparent on a mobile phone:
@media only screen and (min-width:481px) and (max-width: 767px) {
#header, #header * { background: transparent !important; }
#header { position: fixed !important; }
}
How can i make this solid as soon as i scroll down, as it does on desktop?
Hey Vinnie!
How are you? Please find the credentials requested below.
Thank you so much!
Have a great day!!!!
PS: please take a look at the “product details in lightbox” topic. I could really need some help with that one. It’s the most important one :)
It does mea pushing it to the top of the list. See here
Anyway, is there a way for you to suggest something without backend access? I can screenshot anything you need me to.
Hi!
To highlight the fullwidth submenu on same page while scrolling please add the below code to functions.php file
//One page nav highlight
function activateMenuItem(){
?>
<script>
jQuery(document).scroll(function() {
var sections = jQuery('.avia-section'),
menu = jQuery('.av-submenu-container'),
nav_height = menu.outerHeight();
jQuery(window).on('scroll', function() {
var cur_pos = jQuery(this).scrollTop();
sections.each(function() {
var top = jQuery(this).offset().top - 300,
bottom = top + jQuery(this).outerHeight();
if (cur_pos >= top && cur_pos <= bottom) {
menu.find('a').removeClass('active-menu-item');
menu.find('a[href="#' + jQuery(this).attr('id') + '"]').addClass('active-menu-item');
}
});
});
});
</script>
<?php
}
Then add your own highlight style
/* Your css styles for active menu item*/
.current_page_item .avia-menu-text, .active-menu-item {
background:gold!important;
}
Cheers!
Vinay Kashyap
-
This reply was modified 10 years, 2 months ago by
Vinay.
Hi!
Bumping it, means pussing it back to the end and not to the top of the list! :-)
Is it possible for us to have backend access, to give it a look?
That will help us a lot
Regards,
Basilis
Hello,
I’ve just upgraded the theme from 2.7.1 to current version. Everything is quite OK except the Viadeo icon in the top nav.
I’ve added the line ‘viadeo’ => array( ‘font’ =>’viadeo’, ‘icon’ => ‘ue888’), in functions.php, the font is still set up.
What can I do? (for the moment I’ve put the Vimeo icon instead
Hello,
I want to modify the contact form, can you help me please?
I want to place the titles of the fields inside the fields (not above)
I read this topic https://kriesi.at/support/topic/contact-form-align-center/
but i have not a solution because my file (class-form-generator.php) has different php code.
i use Enfold version 3.4.7
thank you very much!
Hi Rikard,
Sounds like a crazy request but I’m trying to boost my ranking and one of the top ranking factors, so I’m told, is more content. I can’t think of any other way to do this without making the site look bad.
I added in the text under the first content slider box “Big Dreams” so that you can see the overflow I wish was hidden.
Thanks,
Terry
I was able to get this working by putting the following in the Quick CSS settings:
.html_header_left .av-main-nav ul {
left: 0;
top: 32px;
}
ul.sub-menu
{
opacity:1!important;
visibility:visible!important;
}
.html_header_left .av-main-nav ul
{
float: left;
top: 0;
left: 0;
position: relative;
width: 100%;
border: 0px;
padding: 0px;
box-shadow: none;
}
.html_header_sidebar #top .av-main-nav ul a
{
padding: 5px 25px 5px 25px;
border: none;
font-size: 14px;
}
.html_header_sidebar #header .av-main-nav > li > a
{
padding: 15px 0px 5px;
}
.html_header_sidebar #header .av-main-nav > li
{
float:left;
width:74%;
}
.html_header_sidebar #header .av-main-nav {
padding: 20px 0 30px;
float: left;
}
-
This reply was modified 10 years, 2 months ago by
rbates86.
Hey!
As i understand you need text on top of slider right?
To re-write the slider code it will take a lot of time instead do this little hack.
First create a text widget with custom class before the slider and using the css position it over the slider.
To add custom classes to the ALB elements turn on class support
http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
If you have any issues create a temporary user with ‘administrator’ role and share in private content with permission to deactivate all plugins and add custom code if necessary to help you better.
Best regards,
Vinay Kashyap
Hi Kriesi-Team,
I am trying to put a sticky fullwidth submenu below a slider, so that it appears at the bottom of the screen and then moves up, when the page is scrolled.
I’ve tried simply moving up the container #top .av-submenu-container by 72px, which is the height I gave the container;
#top .av-submenu-container {
font-size: 15px;
height: 72px;
margin-top: -72px;
}
But naturally the container will then vanish those 72px under the header. I guess someone more knowledgeable could fiddle with the java script, but maybe there is an easier way?
Cheers,
Michael
Also just removed
#top #wrap_all .ajax_slide .avia-gallery-thumb a {
pointer-events: none;
}
The portfolio is now working almost correctly …only on setting: Display Preview Images
if you choose the ‘image list’ option it still pops up a raw image
Thanks Julian
Hey!
Please add following code to Quick CSS as well
@media only screen and (max-width: 989px) and (min-width: 768px) {
.responsive.html_mobile_menu_tablet.html_visible_cart #top .cart_dropdown {
right: 13%;
}}
@media only screen and (max-width: 767px) {
.responsive #top .cart_dropdown {
right: 7.5%;
}}
Regards,
Yigit
Hi!
2. Nimm dies hier noch dazu:
a.button.product_type_simple.ajax_add_to_cart {
display: none;
}
3.) Verwende diesen Code:
#top label {
font-weight: normal;
}
Gruß!
Andy
Hi!
It seems like
.responsive #top .av-submenu-container {
top: auto !important;
position: relative !important;
height: auto;
}
Ismael mentioned is still in active. Please make sure to flush cache after making the changes.
Best regards,
Yigit
Hey Peter
Please edit your blog post and click “Screen options” on the top right corner and check “Excerpt” and then scroll below your content and add your excerpt into the field
Best regards,
Yigit
Hi jumamedia!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
#header_meta {
position: fixed;
top: 0;
width: 100%;
left: 0;
}
Then go to Appearance > Editor and add following code to functions.php file
add_shortcode('avia_search', 'get_search_form');
then go to Enfold theme options > Header > Extra Elements and add following shortcode into Phone info field to display search box there
[avia_search]
Regards,
Yigit
Hey – I´ve found this Question here:
https://kriesi.at/support/topic/un-mute-audio-in-an-embedded-video-in-a-color-section/
Q1. How do you un-mute the audio when embedding video into a “Color Section”?
Q2. How do you stop the looping and just play the video once.
And the Answer from Ismael:
Hey!
To unmute and disable the loop on a color section video, edit config-templatebuilder > avia-shortcodes > section. Find this code on line 406:
‘video_mute’ => true,
‘video_loop’ => true,
Replace it with:
‘video_mute’ => false,
‘video_loop’ => false,
Regards,
Ismael
+++++++++++++++
I´ve tried changing this (not on line 406 but on line 723 and 724) but there´s still no sound and the looping works on and on –
any Idea what to do?
Hey!
You have following custom CSS
.home .content {
padding-top: 0px;
}
If you would like to override it on sections that are after sliders, please add following code to Quick CSS
#after_full_slider_1 .content {
padding-top: 40px !important;
}
Cheers!
Yigit
Hi Lucian!
Not sure if you got this resolved but if you use a sticky header the cart will be visible on scroll.
To make the header sticky in mobile please add the below code to Enfold > General Styling > Quick CSS
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all #header {
position: fixed!important;
}
}
Regards,
Vinay Kashyap
Hey Todd!
Can you please check if that workaround works for you – https://kriesi.at/support/topic/boxed-layout-and-margin-on-top/#post-582571?
Cheers!
Yigit
Hi!
Are you using this plugin – https://wordpress.org/plugins/autoptimize/? If you are, please try de-activating it flush browser cache a few times and check if that helps. It seems to breaking the links of assets
Regards,
Yigit
Hi ilonka78!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
#top .sidebar_left .widget_nav_menu ul ul li:before {
display: none;
}
Cheers!
Yigit
Hi Louise!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
@media only screen and (max-width: 767px) {
.main_menu .avia-menu, #header_main_alternate, .fallback_menu {
display: block;
}
#top #wrap_all .av_header_transparency {
background: transparent;
}}
Regards,
Yigit
Merhabalar!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all .container {
width: 95%;
max-width: 95%;
}}
If that does not help, please post a screenshot and show the changes you would like to make.
Regards,
Yigit