templates/news/newsdetail.html.twig line 1

{% extends 'layout/layout.html.twig' %}

{% block content %}

    {# back link #}
    {% set docNews = pimcore_website_config('docNews', null, app.request.locale) %}

    {% set detailLink = path('news-detail', {
        locale: app.request.locale, 
        id: newsDetail.id,
        title: toUrl(newsDetail.title)
    }) %}

    {# share link #}
    {% set fullLink = app.request.getSchemeAndHttpHost() ~ detailLink %}

    {# hero #}
    {{ include('areas/hero/newsdetail.html.twig', {
        'title': pimcore_website_config('newsDetailHeroTitle', null, app.request.locale),
        'images': [pimcore_website_config('newsDetailHeroImage', null, app.request.locale)]
    }) }}

    <section class="section-newsdetail">
        <div class="grid-container">

            {# date #}
            <p class="date">
                {{ newsDetail.date|date('d.m.Y') }}
            </p>

            {# title #}
            <h1 class="title">
                {{ newsDetail.title }}
            </h1>
            
            {# block #}
            {% for element in newsDetail.block %}

                {# text #}
                {% if (element["localizedfields"].data.localizedValue('text')) %}
                    <div class="text">
                        {{ element["localizedfields"].data.localizedValue('text')|raw }}
                    </div>
                {% endif %}

                {# youtube #}
                {% if (element["localizedfields"].data.localizedValue('youtubeId')) %}
                    <div class="youtubeId">
                        {% set youtubeId = element["localizedfields"].data.localizedValue('youtubeId') %}

                        <div class="youtube-container">
                            <iframe 
                                src="https://www.youtube-nocookie.com/embed/{{ youtubeId }}?autoplay=0&modestbranding=1&iv_load_policy=3" 
                                frameborder="0" 
                                allow="autoplay; encrypted-media" 
                                allowfullscreen
                            ></iframe>
                        </div>
                    </div>
                {% endif %}

                {# video assett #}
                {% set videoPoster = element["localizedfields"].data.localizedValue('videoPoster') %}
                {% set videoMp4 = element["localizedfields"].data.localizedValue('videoMp4') %}
                {% set videoWebm = element["localizedfields"].data.localizedValue('videoWebm') %}
                
                {% if (videoMp4 or videoWebm) %}

                    {% if videoPoster %}
                        {% set poster = 'poster="' ~ videoPoster.thumbnail('newsVideo') ~'"' %}
                    {% else %}
                        {% set poster = '' %}
                    {% endif %}

                    <div class="video">
                        <video controls {{ poster|raw }}>

                            {% if device == 'desktop' %}
                                {% if videoMp4 %}
                                    <source src="{{ videoMp4 }}" type="video/mp4">
                                {% endif %}
            
                                {% if videoWebm %}
                                    <source src="{{ videoWebm }}" type="video/webm">
                                {% endif %}
                            {% else %}
                                {% if videoWebm %}
                                    <source src="{{ videoWebm }}" type="video/webm">
                                {% endif %}

                                {% if videoMp4 %}
                                    <source src="{{ videoMp4 }}" type="video/mp4">
                                {% endif %}
                            {% endif %}
        
                            Your browser does not support the video tag.
                        </video>
                    </div>

                {% endif %}

                {# link button #}
                {% if (element["localizedfields"].data.localizedValue('link')) %}

                    {# target #}
                    {% if (element["localizedfields"].data.localizedValue('link').target) %}
                        {% set target = 'target="' ~ element["localizedfields"].data.localizedValue('link').target ~ '"' %}
                    {% else %}
                        {% set target = '' %}
                    {% endif %}

                    <a class="btn" href="{{ element["localizedfields"].data.localizedValue('link').href }}" {{ target|raw }}>
                        {{ element["localizedfields"].data.localizedValue('link').text }}
                    </a>
                {% endif %}

                {# gallery #}
                {% if (element["gallery"]) and element["gallery"].data.items|length > 0 %}
                    <div class="gallery">
                        <div class="grid-x grid-margin-x grid-margin-y">
                            {% for image in element["gallery"].data.items %}

                                {% if image.image %}
                                    <div class="cell medium-6">
                                        <a href="{{ image }}" class="glightbox" data-gallery="gallery">
                                            <img src="{{ image.thumbnail('newsDetailGallery') }}" alt="Gallery">
                                        </a>
                                    </div>
                                {% endif %}

                            {% endfor %}
                        </div>
                    </div>
                {% endif %}

            {% endfor %}

            {# share #}
            <div class="share">
                <span>{{ 'news.detail.share'|trans }}</span>

                <a href="https://www.facebook.com/sharer/sharer.php?u={{ fullLink }}" target="_blank">
                    {{ include('news/svg/share/facebook.html.twig') }}
                </a>

                <a href="http://www.linkedin.com/shareArticle?mini=true&url={{ fullLink }}&title={{ newsDetail.title }}&summary={{ newsDetail.teaser|replace({"\n": " ", "\r": " ", "\t": " "})|striptags|url_encode }}&source={{ fullLink }}" target="_blank">
                    {{ include('news/svg/share/linkedin.html.twig') }}
                </a>

                <a href="https://twitter.com/intent/tweet?text={{ newsDetail.title }}&url={{ fullLink }}" target="_blank">
                    {{ include('news/svg/share/twitter.html.twig') }}
                </a>

            </div>

            {# back #}
            <div class="back-wrapper">
                <a href="{{ docNews }}"class="btn">{{ 'news.detail.back-link'|trans }}</a>
            </div>

        </div>
    </section>

{% endblock %}