Site Footer

Beta

HTML
View
Context
Info


        
        <footer class="site-footer container container--lg stack" id="page-footer">
    <section>
        <div class="row">
            <div class="col col--12 sm:col--12 lg:col--4">
                <div class="logo">
                    <img src="/assets/logos/hsd.svg" class="logo__initial" alt="">
                </div>
                <h2 class="h6">Hochschule Düsseldorf</h2>
                <p>University of Applied Sciences<br>
                    Münsterstraße 156 40476 Düsseldorf</p>
                <ul class="list list--unstyled mt--md">
                    <li>
                        <a href="https://www.hs-duesseldorf.de/hochschule/gebaeude/anfahrt">Anfahrt</a>
                    </li>
                    <li>
                        <a href="https://wiwi.hs-duesseldorf.de/impressum">Impressum</a>
                    </li>
                    <li>
                        <a href="https://www.hs-duesseldorf.de/datenschutzbestimmungen">Datenschutzbestimmungen</a>
                    </li>
                </ul>
            </div>
            <div class="col col--12 sm:col--6 lg:col--4">
                <h3 class="mb--md" id="footer-nav-service">Service</h3>
                <nav aria-labelledby="footer-nav-service">
                    <ul class="list list--unstyled">
                        <li>
                            <a href="https://bewerbung.hs-duesseldorf.de/">Bewerbungsportal</a>
                        </li>
                        <li>
                            <a href="https://www.hs-duesseldorf.de/studium/beratung_und_kontakt/studienberatung">Zentrale Studienberatung</a>
                        </li>
                        <li>
                            <a href="https://ossc.hs-duesseldorf.de/qisserver/rds?state=user&type=0">Online Studierenden Support Center (OSSC)</a>
                        </li>
                        <li>
                            <a href="https://share.hs-duesseldorf.de/citipedia">CITipedia</a>
                        </li>
                        <li>
                            <a href="https://www.hs-duesseldorf.de/hochschule/verwaltung/alumni_stipendien/unsere_stipendiaten">Stipendien</a>
                        </li>
                        <li>
                            <a href="https://www.hs-duesseldorf.de/studium/internationales">Internationales</a>
                        </li>
                        <li>
                            <a href="https://www.stellenwerk-hochschule-duesseldorf.de/">Stellenwerk</a>
                        </li>
                    </ul>
                </nav>
            </div>
            <div class="col col--12 sm:col--6 lg:col--4">
                <h3 class="mb--md" id="footer-nav-institutions">Einrichtungen</h3>
                <nav aria-labelledby="footer-nav-institutions">
                    <ul class="list list--unstyled">
                        <li>
                            <a href="https://cit.hs-duesseldorf.de/">Campus IT</a>
                        </li>
                        <li>
                            <a href="https://www.hs-duesseldorf.de/ssc">Hochschulbibliothek</a>
                        </li>
                        <li>
                            <a href="https://zwek.hs-duesseldorf.de">Zentrum für Weiterbildung und Kompetenzentwicklung</a>
                        </li>
                        <li>
                            <a href="https://cs.hs-duesseldorf.de/">Career Service</a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </section>

    <section>
        <h3 class="h5 mb--md visually-hidden" id="footer-nav-social">Sozial Media</h3>
        <nav aria-labelledby="footer-nav-social">
            <ul class="list list--inline">
                <li itemscope itemtype="http://schema.org/Organization">
                    <link itemprop="url" href="https://www.hs-duesseldorf.com">
                    <a target="_blank" rel="noopener noreferrer" itemprop="sameAs" href="https://www.facebook.com/hsduesseldorf" class="">
                        <svg class="icon icon--lg" aria-hidden="true" focusable="false" width="16" height="16">
                            <use xlink:href="/assets/icons.svg#i-facebook" />
                        </svg>
                        <span class="visually-hidden">Facebook</span>
                    </a>
                </li>
                <li itemscope itemtype="http://schema.org/Organization">
                    <link itemprop="url" href="https://www.hs-duesseldorf.com">
                    <a target="_blank" rel="noopener noreferrer" itemprop="sameAs" href="https://www.instagram.com/hsduesseldorf/" class="">
                        <svg class="icon icon--lg" aria-hidden="true" focusable="false" width="16" height="16">
                            <use xlink:href="/assets/icons.svg#i-instagram" />
                        </svg>
                        <span class="visually-hidden">Instagram</span>
                    </a>
                </li>
                <li itemscope itemtype="http://schema.org/Organization">
                    <link itemprop="url" href="https://www.hs-duesseldorf.com">
                    <a target="_blank" rel="noopener noreferrer" itemprop="sameAs" href="https://twitter.com/hsduesseldorf" class="">
                        <svg class="icon icon--lg" aria-hidden="true" focusable="false" width="16" height="16">
                            <use xlink:href="/assets/icons.svg#i-twitter" />
                        </svg>
                        <span class="visually-hidden">Twitter</span>
                    </a>
                </li>
                <li itemscope itemtype="http://schema.org/Organization">
                    <link itemprop="url" href="https://www.hs-duesseldorf.com">
                    <a target="_blank" rel="noopener noreferrer" itemprop="sameAs" href="https://www.linkedin.com/school/hsduesseldorf/" class="">
                        <svg class="icon icon--lg" aria-hidden="true" focusable="false" width="16" height="16">
                            <use xlink:href="/assets/icons.svg#i-linkedin" />
                        </svg>
                        <span class="visually-hidden">LinkedIn</span>
                    </a>
                </li>
                <li itemscope itemtype="http://schema.org/Organization">
                    <link itemprop="url" href="https://www.hs-duesseldorf.com">
                    <a target="_blank" rel="noopener noreferrer" itemprop="sameAs" href="https://www.youtube.com/hsduesseldorfhsd" class="">
                        <svg class="icon icon--lg" aria-hidden="true" focusable="false" width="16" height="16">
                            <use xlink:href="/assets/icons.svg#i-youtube" />
                        </svg>
                        <span class="visually-hidden">YouTube</span>
                    </a>
                </li>
                <li itemscope itemtype="http://schema.org/Organization">
                    <link itemprop="url" href="https://www.hs-duesseldorf.com">
                    <a target="_blank" rel="noopener noreferrer" itemprop="sameAs" href="https://www.studycheck.de/hochschulen/hsduesseldorf" class="">
                        <svg class="icon icon--lg" aria-hidden="true" focusable="false" width="16" height="16">
                            <use xlink:href="/assets/icons.svg#i-studycheck" />
                        </svg>
                        <span class="visually-hidden">StudyCheck</span>
                    </a>
                </li>
            </ul>
        </nav>
    </section>

    <section>
        <h3 class="h5 mb--md visually-hidden">Partner und Auszeichnungen</h3>
        <ul class="list list--inline">
            <li>
                <a href="https://www.hs-duesseldorf.de/hochschule/verwaltung/strategie_innovation/DiM/fambuero/Seiten/familiengerechtehochschule.aspx" title="Familienfreundliche Hochschule" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/FamilieLogo_neu.png" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.hs-duesseldorf.de/hochschule/verwaltung/strategie_innovation/DiM/diversity/hsd/audit" title="Vielfalt gestalten in NRW" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/Vielfalt_gestalten.jpg" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.hs-duesseldorf.de/hochschule/verwaltung/strategie_innovation/DiM/diversity/hsd/re-audit" title="Re-Audit Vielfalt gestalten in NRW" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/DiversityLogo.jpg" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.hs-duesseldorf.de/hochschule/profil/Seiten/ugc.aspx" title="UN Global Compact" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/UnGlobalCompactLogo.jpg" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.hs-duesseldorf.de/hochschule/profil/Seiten/coc.aspx" title="Nationaler Kodex für das Ausländerstudium an deutschen Hochschulen" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/CodeOfConductLogo.jpg" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.hs-duesseldorf.de/hochschule/profil/appell" title="Düsseldorfer Appell" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/LogoAppell2.jpg" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="http://www.eua.be/" title="European University Association" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/EUA_member_icon_sw.jpg" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.hrk.de/weltoffene-hochschulen" title="Weltoffene Hochschulen - Gegen Fremdenfeindlichkeit" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/Logo_WHGF.png" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.charta-der-vielfalt.de/die-charta/" title="Charta der Vielfalt" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/Charta-Logo_web.png" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="http://www.hn-nrw.de/netzwerk/" title="Angewandte Forschung – Hochschulnetzwerk NRW (HN NRW)" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/HN-NRW.png" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.wissensregion-duesseldorf.de/" title="Wissensregion Düsseldorf" class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/WissensregionDuesseldorf_Logo.png" alt="" loading="lazy">
                </a>
            </li>
            <li>
                <a href="https://www.studycheck.de/ratgeber-studium/digital-studieren-diese-hochschulen-sind-bereit" title="StudyCheck: Digital Studieren." class="">
                    <img src="https://www.hs-duesseldorf.de/SiteCollectionImages/DigitalStudieren.png" alt="" loading="lazy">
                </a>
            </li>
        </ul>
    </section>
</footer>


        <footer class="site-footer container container--lg stack" id="page-footer">
  <section>
    <div class="row">
      <div class="col col--12 sm:col--12 lg:col--4">
        <div class="logo">
          <img src="/assets/logos/hsd.svg" class="logo__initial" alt="">
        </div>
        <h2 class="h6">Hochschule Düsseldorf</h2>
        <p>University of Applied Sciences<br>
          Münsterstraße 156 40476 Düsseldorf</p>
        {% if footerMeta|length > 0 %}
        <ul class="list list--unstyled mt--md">
          {% for item in footerMeta %}
          <li>
            <a href="{{ item.url }}">{{ item.label }}</a>
          </li>
          {% endfor %}
        </ul>
        {% endif %}
      </div>
      {% if footerServices|length > 0 %}
      <div class="col col--12 sm:col--6 lg:col--4">
        <h3 class="mb--md" id="footer-nav-service">Service</h3>
        <nav aria-labelledby="footer-nav-service">
          <ul class="list list--unstyled">
            {% for item in footerServices %}
            <li>
              <a href="{{ item.url }}">{{ item.label }}</a>
            </li>
            {% endfor %}
          </ul>
        </nav>
      </div>
      {% endif %}
      {% if footerInstitutes|length > 0 %}
      <div class="col col--12 sm:col--6 lg:col--4">
        <h3 class="mb--md" id="footer-nav-institutions">Einrichtungen</h3>
        <nav aria-labelledby="footer-nav-institutions">
          <ul class="list list--unstyled">
            {% for item in footerInstitutes %}
            <li>
              <a href="{{ item.url }}">{{ item.label }}</a>
            </li>
            {% endfor %}
          </ul>
        </nav>
      </div>
      {% endif %}
    </div>
  </section>

  {% if footerSocial|length > 0 %}
  <section>
    <h3 class="h5 mb--md visually-hidden" id="footer-nav-social">Sozial Media</h3>
    <nav aria-labelledby="footer-nav-social">
      <ul class="list list--inline">
        {% for item in footerSocial %}
        <li itemscope itemtype="http://schema.org/Organization">
          <link itemprop="url" href="https://www.hs-duesseldorf.com">
          <a target="_blank" rel="noopener noreferrer" itemprop="sameAs" href="{{ item.url }}" class="">
            {% include '@icon' with { 'type': item.icon, 'classes': 'icon--lg' } %}
            <span class="visually-hidden">{{ item.label }}</span>
          </a>
        </li>
        {% endfor %}
      </ul>
    </nav>
  </section>
  {% endif %}

  {% if footerLogos.length > 0 %}
  <section>
    <h3 class="h5 mb--md visually-hidden">Partner und Auszeichnungen</h3>
    <ul class="list list--inline">
      {% for item in footerLogos %}
      <li>
        <a href="{{ item.url }}" title="{{ item.label }}" class="">
          <img src="{{ item.image.src }}" alt="{{ item.image.alt }}" loading="lazy">
        </a>
      </li>
      {% endfor %}
    </ul>
  </section>
  {% endif %}
</footer>


        
            
            {
  "footerMeta": [
    {
      "label": "Anfahrt",
      "url": "https://www.hs-duesseldorf.de/hochschule/gebaeude/anfahrt"
    },
    {
      "label": "Impressum",
      "url": "https://wiwi.hs-duesseldorf.de/impressum"
    },
    {
      "label": "Datenschutzbestimmungen",
      "url": "https://www.hs-duesseldorf.de/datenschutzbestimmungen"
    }
  ],
  "footerServices": [
    {
      "label": "Bewerbungsportal",
      "url": "https://bewerbung.hs-duesseldorf.de/"
    },
    {
      "label": "Zentrale Studienberatung",
      "url": "https://www.hs-duesseldorf.de/studium/beratung_und_kontakt/studienberatung"
    },
    {
      "label": "Online Studierenden Support Center (OSSC)",
      "url": "https://ossc.hs-duesseldorf.de/qisserver/rds?state=user&type=0"
    },
    {
      "label": "CITipedia",
      "url": "https://share.hs-duesseldorf.de/citipedia"
    },
    {
      "label": "Stipendien",
      "url": "https://www.hs-duesseldorf.de/hochschule/verwaltung/alumni_stipendien/unsere_stipendiaten"
    },
    {
      "label": "Internationales",
      "url": "https://www.hs-duesseldorf.de/studium/internationales"
    },
    {
      "label": "Stellenwerk",
      "url": "https://www.stellenwerk-hochschule-duesseldorf.de/"
    }
  ],
  "footerInstitutes": [
    {
      "label": "Campus IT",
      "url": "https://cit.hs-duesseldorf.de/"
    },
    {
      "label": "Hochschulbibliothek",
      "url": "https://www.hs-duesseldorf.de/ssc"
    },
    {
      "label": "Zentrum für Weiterbildung und Kompetenzentwicklung",
      "url": "https://zwek.hs-duesseldorf.de"
    },
    {
      "label": "Career Service",
      "url": "https://cs.hs-duesseldorf.de/"
    }
  ],
  "footerSocial": [
    {
      "label": "Facebook",
      "url": "https://www.facebook.com/hsduesseldorf",
      "icon": "i-facebook"
    },
    {
      "label": "Instagram",
      "url": "https://www.instagram.com/hsduesseldorf/",
      "icon": "i-instagram"
    },
    {
      "label": "Twitter",
      "url": "https://twitter.com/hsduesseldorf",
      "icon": "i-twitter"
    },
    {
      "label": "LinkedIn",
      "url": "https://www.linkedin.com/school/hsduesseldorf/",
      "icon": "i-linkedin"
    },
    {
      "label": "YouTube",
      "url": "https://www.youtube.com/hsduesseldorfhsd",
      "icon": "i-youtube"
    },
    {
      "label": "StudyCheck",
      "url": "https://www.studycheck.de/hochschulen/hsduesseldorf",
      "icon": "i-studycheck"
    }
  ],
  "footerLogos": [
    {
      "label": "Familienfreundliche Hochschule",
      "url": "https://www.hs-duesseldorf.de/hochschule/verwaltung/strategie_innovation/DiM/fambuero/Seiten/familiengerechtehochschule.aspx",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/FamilieLogo_neu.png",
        "alt": ""
      }
    },
    {
      "label": "Vielfalt gestalten in NRW",
      "url": "https://www.hs-duesseldorf.de/hochschule/verwaltung/strategie_innovation/DiM/diversity/hsd/audit",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/Vielfalt_gestalten.jpg",
        "alt": ""
      }
    },
    {
      "label": "Re-Audit Vielfalt gestalten in NRW",
      "url": "https://www.hs-duesseldorf.de/hochschule/verwaltung/strategie_innovation/DiM/diversity/hsd/re-audit",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/DiversityLogo.jpg",
        "alt": ""
      }
    },
    {
      "label": "UN Global Compact",
      "url": "https://www.hs-duesseldorf.de/hochschule/profil/Seiten/ugc.aspx",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/UnGlobalCompactLogo.jpg",
        "alt": ""
      }
    },
    {
      "label": "Nationaler Kodex für das Ausländerstudium an deutschen Hochschulen",
      "url": "https://www.hs-duesseldorf.de/hochschule/profil/Seiten/coc.aspx",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/CodeOfConductLogo.jpg",
        "alt": ""
      }
    },
    {
      "label": "Düsseldorfer Appell",
      "url": "https://www.hs-duesseldorf.de/hochschule/profil/appell",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/LogoAppell2.jpg",
        "alt": ""
      }
    },
    {
      "label": "European University Association",
      "url": "http://www.eua.be/",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/EUA_member_icon_sw.jpg",
        "alt": ""
      }
    },
    {
      "label": "Weltoffene Hochschulen - Gegen Fremdenfeindlichkeit",
      "url": "https://www.hrk.de/weltoffene-hochschulen",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/Logo_WHGF.png",
        "alt": ""
      }
    },
    {
      "label": "Charta der Vielfalt",
      "url": "https://www.charta-der-vielfalt.de/die-charta/",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/Charta-Logo_web.png",
        "alt": ""
      }
    },
    {
      "label": "Angewandte Forschung – Hochschulnetzwerk NRW (HN NRW)",
      "url": "http://www.hn-nrw.de/netzwerk/",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/HN-NRW.png",
        "alt": ""
      }
    },
    {
      "label": "Wissensregion Düsseldorf",
      "url": "https://www.wissensregion-duesseldorf.de/",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/WissensregionDuesseldorf_Logo.png",
        "alt": ""
      }
    },
    {
      "label": "StudyCheck: Digital Studieren.",
      "url": "https://www.studycheck.de/ratgeber-studium/digital-studieren-diese-hochschulen-sind-bereit",
      "image": {
        "src": "https://www.hs-duesseldorf.de/SiteCollectionImages/DigitalStudieren.png",
        "alt": ""
      }
    }
  ]
}

Handle: @site-footer
Preview:
- With layout
- Component only
Filesystem Path: patterns\8-components\site-footer\site-footer.html.twig
References (1): @icon
Referenced by (1): @preview-page