Webdienst-Footer

Verwenden Sie diesen Footer für FHNW-Webdienste.

1
2  // Webdienst-Footer
3  <footer id="footer">
4    <div class="container">
5      <div class="row">
6        <div class="col-xs-12 col-sm-6 col-md-4">
7          <h4>Kontakt</h4>
8          <p>
9            Fachhochschule Nordwestschweiz FHNW
10            <br />
11            Institute
12            <br />
13            Division
14            <br />
15            Street<br />
16            Zip Location
17          </p>
18          <p>
19            E-Mail: <a href="mailto:#">E-Mail</a>
20          </p>
21
22          <!-- Social Media Icons -->
23          ...
24        </div>
25        <div class="col-xs-12 col-sm-12 col-md-4 order-first order-md-0">
26          <h4>Über diese Website</h4>
27          <p>
28            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae vel esse obcaecati minus!
29            Aperiam quibusdam, voluptatem est recusandae neque veritatis sunt.
30            Corporis quibusdam ad vitae consequuntur nemo, atque error iste.
31          </p>
32        </div>
33        <div class="col-xs-12 col-sm-6 col-md-4">
34          <h4>Quicklinks</h4>
35          <p>
36            <a href="#">
37              Link
38            </a>
39            <br />
40            <a href="#">Link</a>
41            <br />
42            <a href="#">
43              Link
44            </a>
45            <br />
46            <a href="#">Quicklinks</a>
47          </p>
48        </div>
49      </div>
50    </div>
51    <div class="container tools__footer">
52      <div class="row">
53        <div class="d-flex justify-content-center">
54          <p>
55            <a href="https://www.fhnw.ch" target="_blank">
56              www.fhnw.ch
57            </a>
58            <span class="d-inline-block mx-1 mx-md-2">|</span>
59            <a href="#">Impressum</a>
60            <span class="d-inline-block mx-1 mx-md-2">|</span>
61            <a href="#">Datenschutz</a>
62          </p>
63        </div>
64      </div>
65    </div>
66  </footer>
67  

Social Media Icons

1
2// Footer share icons
3<ul class="social__icons">
4 <!-- Instagram -->
5 <li>
6  <a href="https://www.fhnw.ch" target="_blank" title="Folgen Sie uns auf Instagram" class="icon__instagram--sm"></a>
7 </li>
8
9 <!-- Facebook -->
10 <li>
11  <a href="https://facebook.com/fhnw.ch" target="_blank" title="folgen Sie uns auf Facebook" class="icon__facebook--sm"></a>
12 </li>
13
14 <!-- Bluesky -->
15 <li>
16  <a href="https://bsky.app/profile/fhnw.ch" target="_blank" title="folgen Sie uns auf Bluesky" class="icon__bluesky--sm"></a>
17 </li>
18
19 <!-- Xing -->
20 <li>
21  <a href="https://www.xing.com/companies/fachhochschulenordwestschweiz/" target="_blank" title="folgen Sie uns auf Xing" class="icon__xing--sm"></a>
22 </li>
23
24 <!-- LinkedIn -->
25 <li>
26  <a href="https://www.linkedin.com/school/fachhochschule-nordwestschweiz-fhnw/" target="_blank" title="folgen Sie uns auf LinkedIn" class="icon__linkedin--sm"></a>
27 </li>
28
29 <!-- Youtube -->
30 <li>
31  <a href="https://www.fhnw.ch" target="_blank" title="folgen Sie uns auf YouTube" class="icon__youtube--sm"></a>
32 </li>
33
34 <!-- Vimeo -->
35 <li>
36  <a href="https://www.fhnw.ch" target="_blank" title="folgen Sie uns auf Vimeo" class="icon__vimeo--sm"></a>
37 </li>
38
39 <!-- Flickr -->
40 <li>
41  <a href="https://www.fhnw.ch" target="_blank" title="folgen Sie uns auf Flickr" class="icon__flickr--sm"></a>
42 </li>
43
44 <!-- Issuu -->
45 <li>
46  <a href="https://www.fhnw.ch" target="_blank" title="folgen Sie uns auf Issuu" class="icon__issuu--sm"></a>
47 </li>
48</ul>
49