Stop: One problem is still to be solved, because if there is no Youtube ID in the description it shows nonsense.
Let’s see if I can build in a check routine.

maybe this could be a way for your customer to get it.
On that portfolio categories page you can even have more breaks ( two times enter will end in two p-tags in the description) – even that would work. But it is only necessary that the ID is on an extra line and the last line in your description.

insert at the end the Youtube ID with one or more linebreaks ( just enter and insert )

then put this to your child-theme functions.php
and it might be better to execute this only on archive page :

Edit :just brainstorming :lol

See: Example Page

But i think the autoplay will not work with videos not muted.
(maybe you dont need the document ready here.)

you can try this in your child-theme functions.php:

Solution see here: Link

PS If you like to insert it after the description : use append instead of prepend

On that selector ( these are classes at body ) : $('.archive.tax-portfolio_entries.term-monitor-interattivi')
you have your “Portfolio Category” : monitor-interattivi
If you got : termoscanner the selector would be: $('.archive.tax-portfolio_entries.term-termoscanner')

• This reply was modified 1 week, 4 days ago by  Guenni007.

under advanced tab of the slider image – you can insert that button – mybe as you already did it.
the youtube link ( or vimeo ) had to have some addendum :
(click to enlarge)

on my example page: https://www.youtube.com/watch?v=lv6op2HHIuM?iframe=true&autoplay=1

the "?iframe=true" indicates the iframe opening

can you describe it a bit more – or show a page f.e. on a demo page where you like to insert that video?
f.e.: Link – is it that place on top where it should go to?

maybe it is a bit nicer if your whole masonry has a semitransparent background – and the upcomming titles will have a rounded corner on the bottom too:
So try to replace the last code of Mike for the masonries and take this one:

#main .main_color .av-masonry {
    background-color: transparent !important;
}

#main .main_color .av-masonry-image-container,
#main .main_color .av-masonry-outerimage-container {
	border-radius: 50px;
} 

#main .main_color .av-inner-masonry-content.site-background {
  border-radius: 0 0 50px 50px;
}

If you like to use the function :
Always remember that on new jQuery 3.5.1 this is deprecated

$(window).load(function(){

and you had to use now:

$(window).on('load', function(){

if you are talking about the logo that could be seen on transparency header – this is the one in .subtext
may i see the page it concerns too. I’m participant as you are – so private Content area can not be seen by me.

If you see the demo page : https://kriesi.at/themes/enfold-2017/
and on mobile view there will be no transparency – that seems to be the default behavior – but on my home page ( test page ) i got this too.
on mobile view there will be transparency first – after scroll there will be a fixed white header then.
https://webers-testseite.de/
( the only difference here is that these imgs are replaced by svgs )

So is i want to change only the transparency logo on home page – i had to replace the logo in the subtext ( alternate class )

yes – but think of jQuery 3.5.1 : jQuery(window).load(function(){ is deprecated now.
You had to use instead: jQuery(window).on('load', function(){

or here in the code: Link

$(window).on('load', function(){
…

and if it is the syntax is:

(function($){
…
})(jQuery);

you can write every jQuery inside as $: ( f.e. $(‘body’) }

function av_open_inline_popup(){
?>
<script type="text/javascript">
(function($) {
$(window).on('load', function(){
	$('.open-popup-link').addClass('no-scroll');
	$('.open-popup-link').magnificPopup({
		type:'inline',
		midClick: true,
		callbacks: {
			beforeOpen: function () {
				$('body').css("overflow-y", "hidden");
			},
			close: function() {
				$('body').css("overflow-y", "auto");
			},
		},
	});
});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'av_open_inline_popup');

i think no : Link

PS : on Iconlist the same – lines 892ff
enfold/config-templatebuilder/avia-shortcodes/iconlist/iconlist.php

Similar way – but with shinking header in action:
https://webers-testseite.de/xeovision3/

___________________
adjust it to your page-id !

#top.page-id-40389 {
  background-size: 0 !important;
  overflow: hidden;
  position: relative;
}

#top.page-id-40389:before {
  background-image: url(/wp-content/uploads/nature-3082832_1920.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1 !important;
  will-change: transform;
  pointer-events: none;
}

#top.page-id-40389 #wrap_all {
  background-color: transparent !important
}

#top.page-id-40389 #main {
  background-color: transparent !important
}

#top.page-id-40389 .avia-section.transparent-section {
    background-color:  transparent !important;
}

The trick via before pseudocontainer is that it is a container set to fixed position – and not that body has a background-attachment : fixed. some Browser do react on that with jitter (Safari)

hm – isn’t it solved ?
why another topic for it?

https://kriesi.at/support/topic/color-section-parallax-image-scaling/#post-1307972
https://webers-testseite.de/xeovision/

with the changes above it will be:
( click to enlarge )

for example you can change those lines to :

if( ! empty( $link ) )
{
	$linktitle = $title;

	switch( $linkelement )
	{
		case 'both':
			if( $title ) 
			{
				$title = "<a href='{$link}' title='Link to " . esc_attr( $linktitle ) . "' $blank>$linktitle</a>";
			}
			
			$display_char_wrapper['start'] = "a href='{$link}' title='Iconlink to "  . esc_attr($linktitle) . "' {$blank}";
			$display_char_wrapper['end'] = 'a';
			break;
		case 'only_icon':
			$display_char_wrapper['start'] = "a href='{$link}' title='Iconlink to " . esc_attr($linktitle) . "' {$blank}";
			$display_char_wrapper['end'] = 'a';
			break;
		default:
			if( $title ) 
			{
				$title = "<a href='{$link}' title='Link to " . esc_attr( $linktitle ) . "' {$blank} >$linktitle</a>";
			}
			
			$display_char_wrapper['start'] = 'div';
			$display_char_wrapper['end'] = 'div';
			break;
	}
}

see results here on those two iconboxes on the right: https://webers-testseite.de/tagood/

this is the layout i used for it:
( click to enlarge )

here is the css code for it in quick css:
( in my case it is that page-id – adjust to your page-id )

#top.page-id-40318 #main {
  overflow-x: hidden;
  height: 100vh;
}

#top.page-id-40318 .avia-section.xeovision {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex !important;
    justify-content: center;
    align-items: center;
    letter-spacing: 0.2em;
    color: white;
    background-size: cover !important;
    background-position: center !important;
}

/*** and everything that follows the xeovision section  f.e.: a grid-row (.av-layout-grid-container) ***/
#top.page-id-40318 .avia-section:not(.xeovision) {
    position: relative; 
}