Featuremalen

Vi er kjent med at script-embeds i featuremalen (D2, Magasinet & Smak) automatisk legger seg i venstrespalten. For å omgå dette bruker vi å legge til et script som løser dette for oss; inntil videre. Her er kodene for fullbredde (venstre + høyre spalte) og brødtekstspalten (kun høyre) du trenger for å legge sammen med embedden din.

Bildetekst til embed

Bildetekst

 <!-- Legg inn embed-koden din her -->
 <figcaption class="vrs-image-block__image-description is-collapsed">
   <p>
     <span itemprop="description">
       
     </span>
   </p>
   <span class="vrs-image-block__image-description-overlay"></span>
 </figcaption>

Embed i brødtekstspalten

<div data-layout="body-width">
  <!-- Lim inn embed-koden din her -->
</div>
<script>
(() => {
  const bodyWidthEmbeds = document.querySelectorAll('[data-layout="body-width"]');
  bodyWidthEmbeds.forEach(element => {
    const embed = element.closest('[id^="embed"]');
    embed.setAttribute('class', '');
    embed.classList.add('vrs-content-block', 'vrs-content-block__text');
    const inner = embed.querySelector('div');
    inner.classList = 'vrs-content-block__text-inner';
    inner.style = 'margin-block: 25px';
  });
})();
</script>

Embed over begge spaltene

<div data-layout="full-width">
  <!-- Lim inn embed-koden din her -->
</div>
<script>
(() => {
  const fullWidthEmbeds = document.querySelectorAll('[data-layout="full-width"]');
  fullWidthEmbeds.forEach(element => {
    const embed = element.closest('[id^="embed"]');
    embed.setAttribute('class', '');
    embed.classList.add('vrs-content-block', 'vrs-content-block__text');
    embed.style = 'margin-block: 25px';
  });
})();
</script>

Ta bort marger i hovedbilde

<style>
.vrs-article-header > [id*='embed_2-1'] {
  padding: 0;
}

@media (max-width: 750px) {
  .vrs-ma-frame__topbanner {
    margin-bottom: 0;
  }
}
</style>

Video i loop / Animert stillbilde

Lim inn direkte url til videoen i JWPlayer

 <figure class="vrs-article-header__image-wrapper vrs-image-block" itemscope="" itemtype="http://schema.org/VideoObject">
   <video autoplay loop muted playsinline preload disablepictureinpicture width="100%">
     <source src="">
   </video>
 </figure>

 <style>
   .vrs-article-header [id*="embed_2-1"] {
     padding-inline: 0;
   }

   .vrs-article-header [id*="embed_2-1"] ~ .vrs-article-header__summary {
     display: none;
   }
 </style>