ankedsgn

    {% if record.image is not empty %}
        <figure class="main-img">
            <div class="img-container">
                <img class="" 
                {# give the browser three possible imagesizes to choose from #}
                srcset="{{ record.image|thumbnail(1800,750,'c') }} 1800w ,
                        {{ record.image|thumbnail(1200,500,'c') }} 1200w,
                        {{ record.image|thumbnail(800,330,'c') }} 800w"
                {# give the width the image is used on different mediaqueries - in this case always 100% #}
                sizes="100vw"

ankedsgn

{% if app.request.get('_route') %}{# no route, no SEO tags #}
    <title>{{ seo.title() }}</title>
    {{ seo.metatags() }}
{% else %}
    <title>Niet Gevonden | {{ config.get('general/sitename') }}</title>
{% endif %}

ankedsgn

## Debugging
# OFF on global config! - to make sure it is enabled on PROD by default.
debug:
    enabled: false
    address: [email protected]
    
    
    
# TEMPLATES
# Custom for museon site, in the museon2019/templates folder

ankedsgn

.skiplinks {
    position: absolute;
    top: 3px;
    left: 10px;
    width: 100px;
    
    a {
        color: #000; // force black for optimal contrast
        font-size: 0.9167em;
        display: inline-block;

ankedsgn

{% if 'youtube' in record.video.url %}
            {% set embedurl = 'https://www.youtube-nocookie.com/embed/' ~ record.video.url|split('=')|last ~ '?feature=oembed&rel=0&autoplay=1' %}
        {% elseif 'youtu.be' in record.video.url %}
            {% set embedurl = 'https://www.youtube-nocookie.com/embed/' ~ record.video.url|split('/')|last ~ '?feature=oembed&rel=0&autoplay=1' %}
        {% elseif 'vimeo' in record.video.url %}
            {% set embedurl = 'https://player.vimeo.com/video/' ~ record.video.url|split('/')|last ~'?autoplay=1'  %}
        {% else %}
            {% set embedurl = '[todo-else]' %}
        {% endif %}
        

ankedsgn

Source: https://crunchify.com/list-of-all-social-sharing-urls-for-handy-reference-social-media-sharing-buttons-without-javascript/

Facebook:

Facebook social share URL:
https://www.facebook.com/sharer.php?u=[post-url]

Twitter:

Twitter social share URL:

ankedsgn

in contenttypes.yml:
  image:
    type: image
    attrib: [ alt_nl, title_nl, alt_en, title_en, alt_fr, title_fr ]

in de template: 

{% set alt = attribute(record.values.image, 'alt_'~getlanguage() )|default('') %}
{% set title = attribute(record.values.image, 'title_'~getlanguage() )|default('') %}

ankedsgn

$( document ).ready(function() {
  /**
    * breadcrumbs / history path
    */
    breadcrumbStateSaver(document.location.href, document.title);
    showBreadCrumb();

)};
                    
//breadcrumbs -> https://stackoverflow.com/questions/18998797/create-breadcrumbs-dynamically-on-client-side-using-javascript

ankedsgn

if(window.innerWidth < 768) {
        $('table.content-table').each(function( index ) {
          var ths = $( this ).find('th');
          var trs = $( this ).find('tr');
          trs.each(function(){
            $(this).find('td').each(function(i){
              var text="<span>"+ths.eq(i).html()+"</span>";
              $(this).prepend(text);
            })
          });

ankedsgn

h2 a[name] { // all anchors
    scroll-margin-top: 70px;

    @supports (-webkit-overflow-scrolling: touch) { // bc ios safari is not playing along
        /* CSS specific to iOS devices only */
        padding-top: 70px;
        margin-top: -70px;
      }
}