Where did you get the shortcode from? – so why don’t you insert the link first to that source and then copy/paste the shortcode?

ich bin wie Sie auch nur ein Teilnehmer mit manchmal guten hilfeangeboten.
Daher sehe ich die Zugangsdaten nicht.
Versuchen sie den code oben – eventuell die 200px anpassen

the transparency comes from the title container:
but border style belongs to #header and main:

.title_container {
    background-color: transparent !important;
    border: none !important;
}

#header_main,
.container_wrap_first.container_wrap {
    border: none !important;
}

you have to put this into your child-theme functions.php:

add_action('wp_footer', 'custom_lightbox_script');
function custom_lightbox_script(){
?>
<script type="text/javascript">
(function($) {
    function a() {
      $('body').on('click', '.lightbox-added', function() {
        if($('.mfp-bg').length >= 1) {
          $('html').css("overflow-y", "hidden");
        } 
      });
      
      $('body').on('click', function() {
        setTimeout( function() {
          if($('.mfp-bg').length == 0) { 
            $('html').css("overflow-y", "scroll");
          }
        },500);   
      });
    }
  a(); 
})(jQuery);
</script>
<?php
}

some people would pay money for a code like that ;) :lol

nothing opens at all. Continous spinning wheel on top

have you a live link for me ?

well all first color-section on enfold got that ID ( av_section_1 ) on default !
Only if you fill the input field “For Developers: Section ID” – the ID will change to that custom one

well everything is on your linked page!
just make a color-section and give a custom class ( hero-bkg-animated ) to it. Place the code into your quick css.

.hero-bkg-animated {
    background: #EEE url(//webers-testseite.de/wp-content/uploads/geometry2.png) repeat 0 0;
    width: 100%;
    margin: 0;
    -webkit-animation: slide 20s linear infinite;
    animation: slide 20s linear infinite;
}

@-webkit-keyframes slide {
    from { background-position: 0 0; }
    to { background-position: -400px 0; }
}

the 400px depends on the png you like to use – the height of the color-section can be different to that.

https://webers-testseite.de/hostage-media/

PS : and if you take a real png with transparency – the background-color can be changed here too !
and i would include the animation ( not only the -webkit-animation to that rule

PPS: if you change the keyframe to – you will have diagonal animation etc. pp

@-webkit-keyframes slide {
    from { background-position: 0 0; }
    to { background-position: -400px -400px; }
}

These slanted areas are additional containers after the concerning color-section – the belong to the color-section where it is definded.
Allthough they look like the are part of the following color-section.
It is a div which got the background-color of the following color-section and is rotated about 5deg.
If you got perhaps a rule for that class: av-extra-border-inner with border it could be that you have on the slanted lines a border. But this must be an additonal css and could not be achieved through enfold alb setting.

And by the way – if there are no transparency needs – do use jpg.
And if you use jpg – try to optimize them for web ( f.e. in photoshop via save for web and take a higher compression level.
Your mission-6.jpg has 3MB – that is the reason why the image needs too long to load. You can have that image nearby 460kb without visible loss of quality

And you see on small screens that you have to do some extra css
or just to set up that css for screens over your break point for mobile:

@media only screen and (min-width: 768px){
.avia-image-container.overlap-image {
    position: relative;
    top: -200px;
}
}

And you can have sliders above too etc.

Unfortunately Duplicator is not multi-site compatible. Therefore I got Updraft for this case. This works perfectly. But it’s not cheap. But it does backups automatically and sends them to me in zip form – depending on the setting also encrypted on my ftp server.

and by the way if you like to exclude the layout for archiv-page and all the post in it you can use has_category()

if( is_category('grafik') || has_category('grafik') ){

hm seems not to work in that supposed manner.
I will brainstorm again. …

Edit: it seems to be this way that the layout of the category will go to the post in that category !
But you can bypass it by f.e.
(maybe a mod knows a different setting – quiet shorter):

add_filter('avia_layout_filter', 'avia_change_category_layout', 10, 2);
function avia_change_category_layout($layout, $post_id) {
    if( is_category('grafik') && is_archive() ){
        $layout['current'] = $layout['sidebar_right'];
        $layout['current']['main'] = 'sidebar_right';
    }

    return $layout;
}

add_filter('avia_layout_filter', 'avia_change_post_layout', 10, 2);
function avia_change_post_layout($layout, $post_id) {
    if( has_category('grafik') && !is_archive() ){
        $layout['current'] = $layout['fullsize'];
        $layout['current']['main'] = 'fullsize';
    }

    return $layout;
}

so here the archive page of category: grafik will be with sidebar right – but the posts in it has no sidebar.

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

Get rid of sidebar – where – on all archive pages or only for some category pages ?

to have not the overlapping from the masonry over the slant : just put under the masonry a whitespace f.e. 100px

click to enlarge:

The slanting comes from the color-section on top and has the background-color of the following color-section.
So the following color section can do without borderstyling, unless it should have an own slanting.
But the borderstyling above : the top section border styling – there was the borderline perhaps you mentioned.

But better would be a lifelink to say where it comes from