51751ABB-5214-4D7F-AB7F-8A7599AC7751 Created with sketchtool.

Audio player

100% 
<figure class="c-audio">
    <div class="c-audio__embed">
        <script class="podigee-podcast-player" src="https://cdn.podigee.com/podcast-player/javascripts/podigee-podcast-player.js" data-configuration="https://sooderso.podigee.io/9-episode-9/embed?context=external&amp;token=_a_WpO1U_zz_1IEYPkkUAA"></script>
    </div>
    <figcaption class="c-audio__caption">So oder so - der Podcast für Hildesheim mit den HAZ-Redakteuren Jan Fuhrhop und Johannes Krupp.</figcaption>
</figure>
 
<figure class="c-audio">
    <div class="c-audio__embed">
        <script class="podigee-podcast-player"
                src="https://cdn.podigee.com/podcast-player/javascripts/podigee-podcast-player.js"
                data-configuration="{{ url }}"></script>
    </div>
    {% if caption %}
    <figcaption class="c-audio__caption">{{ caption }}</figcaption>
    {% endif %}
</figure>
 
{
  "additionalClasses": "",
  "url": "https://sooderso.podigee.io/9-episode-9/embed?context=external&amp;token=_a_WpO1U_zz_1IEYPkkUAA",
  "caption": "So oder so - der Podcast für Hildesheim mit den HAZ-Redakteuren Jan Fuhrhop und Johannes Krupp."
}
  • Content: 
    .c-audio {
    background: $color-white;

    &__caption {
        padding: rem-calc(0 20 20);
    }
}
  • URL: /components/raw/audio/audio.scss
  • Filesystem Path: src/patterns/20-components/audio/audio.scss
  • Size: 103 Bytes

Audio player

As audio player, Podigee is used. It is embedded as script with data -configuration attribute which holds the desired audio file URL to play.