on Avia Layout Builder take a color-section.
Open that color section options dialog – click to the section background and set your wanted image.
Set your image behavior here too- if you like to repeat the background or if it is stretched. (on your example it seems to cover the element)
Set the image as you like to behave : scroll, parallax or fixed ( all will leave the screen on scrolling but with different effects)
Goto the tab on top : Section Background Overlay – set your overlay color if wanted – on your example it seems to be a black overlay color with f.e. 0.5 opacity.
Thats all – you can drag all you wanted into the color section now

i do allways this code to functions.php of my child-theme – it deactivates the reset all button too:

function admin_head_mod() {
echo '<style type="text/css">
#avia_quick_css .avia_description {float: none;margin-bottom: 20px !important;padding-left: 0 !important;width: 98%}
#avia_quick_css .avia_control {float: left;max-width: 98% !important;width: 98% !important}
.avia_footer_links li {float: left;padding-right: 20px}
.avia_footer .avia_footer_save {float: left}
.avia_reset {pointer-events: none !important }
</style>';
}
add_action('admin_head', 'admin_head_mod');

you are always welcome
and even if English is not my native language, I am probably understood, even if my sentence constructions are easily recognizable as German.

can you try this in your functions.php of your child-theme:
this filter you will only need if you havn’t got a secondary menu or social media – so there will be no header-meta
add_filter( 'avf_execute_avia_meta_header', '__return_true', 10, 1);

for you this will be enough i think:

add_filter( 'avia_meta_header', 'avia_append_search_nav_mod');
function avia_append_search_nav_mod()
{
          global $avia_config;
          ob_start();
          get_search_form();
          $form =  htmlspecialchars(ob_get_clean()) ;

          $items .= '<li id="menu-item-search" class="noMobile menu-item menu-item-search-dropdown menu-item-avia-special">
                        <a href="?s=" data-avia-search-tooltip="'.$form.'" '.av_icon_string('search').'>
                          <span class="avia_hidden_link_text">'.__('Search','avia_framework').'</span>
                        </a>
                    </li>';

    echo $items;
}

Edit: i see it has on header meta a list-point so add this to your quick css:

#top #menu-item-search {
    list-style: none;
}

please delete your comment on this rule:
// Full Width on Mobile for Blog Featured Images and Videos

because on css you comment things by: /**** comment ***/

the method by //comment is used in php files

can you please look if it starts now on your mobile devices: http://webers-testseite.de/weber/archie/

have you deleted all caches ( browser and maybe plugin-caches – and enfold merged files (js and css) ) ?

on which different mobile devices have you tested this?

F.e. only since IOS 11 with new safari these video-backgrounds are supported!

What is your smart option – i can not find it in the api options?
why don’t you include in the iframe code an autoplay=1 option ?

and for mobile (safari too) set the parameter :
&playsinline=1

well i understand this : Hello i have a problem. I have 7 categories with there own logo that he likes to change the logo for each category. – and not to have multiple logos

i realy don’t understand your construct – but you can change logo for pages , categories , posts, etc if you know something about conditional phrases in wordpress.

a single post got a categorie – if you like to change all logos for single post with a given category use

add_filter('avf_logo','av_change_logo_for_categories');
function av_change_logo_for_categories($logo){
    if( is_single() && in_category( 'slider1' ) )  {
    	$logo = "https://webers-testseite.de/wp-content/uploads/layerslider/Parallax-Slider/truc.png"; 
    }
    return $logo;
}

you can modify this with a lot of elseif rules and for pages , page arrays etc. pp like:

add_filter('avf_logo','av_change_logo');
function av_change_logo($logo){
    if( is_page(21) ) {
        $logo = "http://www.domain.com/wp-content/uploads/logo21.jpg"; 
    }
  
    elseif ( is_page( array( 42, 54, 6 ) ) ) {
        $logo = "http://www.domain.com/wp-content/uploads/logo22.jpg"; 
    }

    elseif ( is_category( 'slider1' ) )  {
        $logo = "http://www.domain.com/wp-content/uploads/logo23.jpg"; 
    }

    elseif( is_single() && in_category( 'slider1' ) )  {
        $logo = "http://www.domain.com/wp-content/uploads/logo24.jpg"; 
    }
    return $logo;
}

all single posts with category: slider1 will get logo24
if you got a list of posts of category slider1 ( has_category) logo23

Give to the testimonial-wrapper a min-height – so that biggest Testimonial fits in to that container.
You will not solve that problem for all screen-width ( the small ones are the problem) – but for a normal screen width this will work:
Please adjust the min-height to your testimonials – the thing is that the short testimonials

.avia-testimonial-wrapper {
    min-height: 350px;
    margin: 0;
}

the min-height value should be in this way that even the biggest testimonial has enough place to show.
a fixed height that will work even for small screens ( maybe a normal 3 liner will turn under this circumstances in a 6 liner testimonial) looks ugly.

• This reply was modified 7 years, 5 months ago by Guenni007.

editing the files means having a child-theme footer.php and maybe insert your own hook

f.e. after the <?php on line 162 of footer.php
do_action( 'ava_in_socket' );

try this – that is probably a good approach to the solution

@media only screen and (max-width: 767px) {
  .big-preview.single-big, .big-preview.single-small {
    width: 120% !important;
    max-width: 120% !important;
    margin: 0 auto !important;
    position: relative;
    left: -10% !important;
}
  #main .content {
    padding-top: 0px
  } 
}

i edited the thread because i see in your css some strange things:

by the way on my Mac newest OSX and Safari / Safari Technology Preview / Chrome / Firefox all is ok with your Headings

i think he likes to add an ID to an Enfold ALB Button!
There are scripts to achieve this, but then the class should definitely only exist once! – otherwise you will have double ID conflicts !

give the button itself a unique class (in my case: unique-class )
add this to functions.php of your child-theme:

function add_ID_to_unique_class() { 
?>
<script>
(function($){
	$(document).ready(function(){ 
  		$('.unique-class .avia-button').attr('id', 'what-you-like');
	});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'add_ID_to_unique_class');

If you have this often – then i would edit that alb element to have an id Input field – put it in child-themes/shortcodes folder and load that.
Instructions: https://webers-testseite.de/edited-enfold-alb-elements/
See here: https://pastebin.com/EE3b0wX4
Download here: https://pastebin.com/dl/EE3b0wX4

• This reply was modified 7 years, 5 months ago by Guenni007.