It sounds a bit like you did the move of the hopmepage by hand. With transfer of the settings and css settlements etc.
I always migrate WordPress installations with Duplikator ( Link ) and never had to fear such problems.
Maybe you decide to take this step.

But first: tests you could still do –
Check if the settings in the “Advanced Settings” are identical.
If yes then try a backup of the settings data via Enfold – Import/Export : Export Theme Settings File and then the import in the new installation will bring a little more.

if your page is like this here: https://kriesi.at/themes/enfold/pages/contact/
you can include here the font-size too:

.main_color .required {
    color: #8E199D;
    font-size: 20px;
}

if it is in a placeholder you had to style the placeholder text. – is there a page to see the issue?

ich persönlich blende die Infos immer aus, welcher Editor für die die Seiten/Beitragserstellung zuständig war.
Lediglich Entwurf und wichtige Infos ( Datenschutzseite) lasse ich drin.

Legt mal folgendes in Eurer Child-Theme functions.php an:

/****  Die Poststates im Dashboard nicht anzeigen - wichtige schon *****/
function remove_post_state( $post_states, $post ) {
  if("! has_blocks( $post->ID )") {
    unset($post_states['wp_editor']);
  }
  if("!= Avia_Builder()->get_alb_builder_status($post->ID)") {
    unset($post_states['avia_alb']);
  }
return $post_states;
}
add_filter('display_post_states','remove_post_state',999,2);

Das betrifft eben auch die Menus.
_________
Ansonsten sehe ich die Darstellungsprobleme nicht im Menu – lediglich das Laden der vollständingen Seite verhindert das zeitnahe Rendern der kompletten Seite – dadurch hatte ich auch zunächst Darstellungsprobleme eures Menüs.

Geht mal auf Gtmetrix und forscht mal nach, warum ihr soviele Requests habt :
https://gtmetrix.com/reports/www.institut-generationenberatung.de/Ng6GhVjP

Dann versucht doch mal das Merging von Enfold. Das stelle ich auch immer erst zum Schluss an, weil die vereinten js und css files während des layouts oft wie ein Caching wirken und das hält auf. Wenn die Seite allerdings dann steht, kann man das Anstellen.

______________
for non German participants here

Personally, I always hide the information about which editor was responsible for the pages/contributions.
Only draft and important information (data protection page) I leave inside.

Please look at the code above.

This also applies to the menus.
_________

Otherwise I don’t see the display problems in the menu – only the loading of the complete page prevents the timely rendering of the complete page – so I had display problems of your menu at first.

Go to Gtmetrix and find out why you have so many requests:
https://gtmetrix.com/reports/www.institut-generationenberatung.de/Ng6GhVjP

Why don’t you try merging Enfold? I always do this at the end of the layout because the merged js and css files often act like a caching during the layout and that stops. But when the page is finished, you can start the merging.

As mentioned above your favicon : http://www.downundermusic.com/wp-content/uploads/2019/01/favicon-16×16.png
tries to load from http and could not be found under this url.

Keiner!

Und wieso kannst du nicht einfach eine Antwort auf eine generelle Frage geben?

weil sowas hier für 95% der Mitstreiter hier an Board nicht hilfreich ist: https://developer.wordpress.org/reference/functions/get_bloginfo/
______
Wie du hier am Board Logo siehst, hat Kriesi eine Bildmarke und Text eingebunden.
Das tat ich zB. auch auf einer meiner Seiten: https://guenterweber.com
Man hat dann wie hier die Möglichkeit verschiedene Effekte noch auf diese anzuwenden ( siehe oben beim Shrinken )

Das kann man z.B. auch mit dem Seitennamen und der Beschreibung machen – wobei etwas css noch dazugehört diese dann richtig zu positionieren.:
das hier in die child-theme functions.php

add_filter('avf_logo_subtext', 'kriesi_logo_addition');
function kriesi_logo_addition($sub)
{
  $sub .= "<span class='logo-title'>";
  $sub .= get_bloginfo( 'name', 'display' );
  $sub .= "</span>";
  $sub .= "<span class='logo-title logo-subtitle'>";
  $sub .= get_bloginfo( 'description', 'display' );
  $sub .= "</span>";
  return $sub;
}

wenn du es aber oben im Top-Menu links haben wolltest muss eine andere Lösung her etc. pp beides wäre auch als oben links zu bezeichnen, wenn das Logo links positioniert hast.

Daher mein Nachfragen. Mir war das zu allgemein um eine präzise Lösung anzubieten.

what do you mean by upper left corner? Screen or besides the logo etc. pp.
or best would be to see the site – and a description then where you like to have that information.

haha – hier steht der Avatar für die Seite ;)

hier wäre ja zumindest der Seitentitel doppelt genannt mit deinem Logo …

your header-meta overlaps that area:
you can set the header_meta to less z-index:

#header_meta {
    z-index: 1 !important;
}

Edit : and it overlaps because of a header_meta rule sets min-height to 80px – default value is 30px
so better get rid of that rule and let the z-index of header_meta to its default value 10

#header_meta .container {
    min-height: 30px;
}

what kind of header-settings do you have: logo left menu right or something else?
what kind of content – an image as “second logo” ?

so – the script responsible for shrinking behavior is: avia-snippet-sticky-header.js
you can have a child-theme script instead of loading the parent one by:

add_action( 'wp_enqueue_scripts', 'wp_change_sticky_header_script', 100 );
function wp_change_sticky_header_script() {
   wp_deregister_script( 'avia-sticky-header' );
   wp_enqueue_script( 'avia-sticky-header-child', get_stylesheet_directory_uri().'/js/avia-snippet-sticky-header.js', array('avia-default'), $vn, true);
}

This script takes care of the shrink factor and other settings – for example the varialble line-height while shrinking.
In the function avia_header_size there is the calculation of the effect – the trick will be to include the new element to be calculated f.e. in height and width.

some thoughts on it:
https://kriesi.at/support/topic/diagonal-border-angle/#post-1138048

for color-sections the best position to have real divider is as mentioned in the link above:

<div class="avia-section  …
  <svg  (  inline for the top ) > …</svg>
     <div class="container">… </div>
   <svg  ( inline  for the bottom ) >… </svg>
</div>

the reason for using svg is easy : these can be influenced to react responsive – and if they use only vectors they are allways sharp, they are extremly small in file-size, and you can set fill-colors for the needed transition. They can be animated : see here on the footer: https://webers-testseite.de/pureinstall/fullwidth-slider/

you can even use them on sliders – as you can see in the link above. But you have to choose a better place to insert them to markup.

maybe – even if you could not create a simple example or post the page:

This will give you a hint to the right way :

#main .av-layout-grid-container:nth-of-type(odd) .flex_cell:nth-of-type(even) {
 background: #900 !important;    
}
#main .av-layout-grid-container:nth-of-type(odd) .flex_cell:nth-of-type(even) * {
 color: #fff !important;    
}
#main .av-layout-grid-container:nth-of-type(even) .flex_cell:nth-of-type(odd) {
 background: #900 !important;    
}
#main .av-layout-grid-container:nth-of-type(even) .flex_cell:nth-of-type(odd) * {
 color: #fff !important;    
}

https://webers-testseite.de/colorize-grids/

On responsive breakpoint you had to style them with other rules :

it seems that the each(function… is not necessary so try first :
( from my understanding this will be ok – but it works without too! )

function move_header_widget_to_burger(){
?>
<script>
(function($){
	$('#header_main .widget').css('display' , 'none');
	$('#header').one('click', '.av-main-nav-wrap', function() {
		var isMobile  = $('.av-burger-menu-main').css('display');
		$('#top #av-burger-menu-ul').css({
			'display' : 'block',
			'height' : 'auto',
			'vertical-align' : 'top',
			'padding' : '140px 0 0',
		});
		var burger_widget = $('#header_main .widget').detach();
		burger_widget.appendTo('.av-burger-overlay-inner').css({
			'display' : 'block',
			'position': 'relative',
			'width': '94%',
			'text-align': 'left',
			'margin-left': '3%',
			'border-top': '1px dashed #333',
		});
	});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'move_header_widget_to_burger');

I can’t quite understand your argument. However more than pointing out the possibility of solving the problem by Enfold methods I cannot do.

The enfold calculation of the new size formats will be done on upload.
Those Optimising Plugins will edit these existing images. So for enfold there will be no difference if they find the same nomenklatur for them.

I suppose that once you have run through such an optimizer the images will stay that way even after deactivating or deleting the plugin.
Isn’t there a free contingent of them, which can be processed? I would test that first.

_______________

The snippet above will take effect immediately on upload. The images that are already there I have recalculated with Force Regenerate Thumbnails.
The benefit of that plugin is that it deletes the old thumnails not needed ( f.e. if you change the theme – there will be other sizes and some sizes are not needed – or if you follow the link of Victoria that you exclude some sizes from being calculated. )

See here https://kriesi.at/support/topic/disable-creation-of-multiple-file-resoltuions-on-media-upload/#post-1172543

You can influence what sizes are calculated on upload.
Sometimes you notice that some image sizes are not needed at all for an Enfold installation, and in some cases you can even work with other formats. Then you could save yourself the trouble of generating these file sizes.

___________

Have a look at that plugin too – seems to be a very usefull one:
https://de.wordpress.org/plugins/simple-image-sizes/

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

I’m trying everything I can to minimize page load times and lighten I/O. Images seem to be a big thing (as expected). If I, for example, upload a 2,048 x 2,048 original image, but then tell Enfold that it is a 640 x 640 image on the post, is it being resized (and served as a smaller file size)? Or am I just defining the “window” in which Enfold displays that big file?

these images are resized and should be less file size. BUT:

on functions-enfold.php:

if( ! function_exists( 'av_return_100' ) )
{
	/**
	* Sets the default image to 100% quality for more beautiful images when used in conjunction with img optimization plugins
	*
	* @since 4.3
	* @added_by Kriesi
	*/
	function av_return_100(){ return 100; }
	add_filter('jpeg_quality', 'av_return_100');
	add_filter('wp_editor_set_quality', 'av_return_100');
}

Enfold takes the original image on upload, unpacks it and calculates new smaller sizes, but without compression level!
That is f.e. like you save a jpg on photoshop without compressing on quality level 10 !

This is meant very nicely, but leads to the fact that optimized jpgs uploaded in their original size sometimes have a smaller file size than the recalculated files which are smaller in dimension.

This is not necessarily the case for a 640px image, but for the sizes : “featured”, “featured_large” and “extra_large” this is often the rule.

This little snippet in child-theme functions.php :

  function av_return_100(){ return 65; }
  add_filter('jpeg_quality', 'av_return_100');
  add_filter('wp_editor_set_quality', 'av_return_100');

65% seems to be a good compromise – but this depends of course on your pictures and your requirements for sharpness.

This small snippet reduces the quality of the recalculated images during upload.
but unfortunately it has no effect afterwards. Therefore you would have to recalculate the thumbnails. There are several plugins you can use for this.
Regenerate thumbnails etc.