Auf Social Media-Plattformen verlinken

Hier wird gezeigt, wie Sie datenschutzkonform auf Ihre Social-Media-Plattformen verlinken. Die Links werden in einem Teaser mit den entsprechenden Icons angezeigt - siehe das Beispiel rechts.

Im Gegensatz dazu erlauben die grauen «Sharing Buttons» rechts oben, Besucher*innen die Seite auf ihren eigenen Social Media Kanälen zu teilen:
Sharing Buttons

 

Social-Media-Links
Social-Media-Links
(Neuen Teaser erstellen) -> (Schaltfläche) Quellcode
  1. Schalten Sie auf Quellcode um und fügen Sie den nachfolgenden Code ins Textfeld ein.
  2. Setzen Sie in den Links die Adressen Ihrer Social-Media-Auftritte ein: https://www.facebook.com/.../
  3. Entfernen Sie den Code, den Sie nicht brauchen, von <a … bis zu </a>

<p>
  <a class="facebook" href="https://www.facebook.com/.../"
     target="_blank" title="<my site> auf Facebook">&nbsp;</a>
  <a class="linkedin" href="https://www.linkedin.com/.../"
     target="_blank" title="<my site> auf LinkedIn">&nbsp;</a>
  <a class="xing" href="https://www.xing.com/.../"
     target="_blank" title="<my site> auf XING">&nbsp;</a>
  <a class="twitter" href="https://twitter.com/..."
     target="_blank" title="<my site> auf Twitter">&nbsp;</a>
  <a class="instagram" href="https://www.instagram.com/..."
     target="_blank" title="<my site> auf Instagram">&nbsp;</a>
  <a class="youtube" href="https://www.youtube.com/..."
     target="_blank" title="<my site> auf YouTube">&nbsp;</a>
</p>

Schritt 2: Das CSS-Styling in die Seite einbauen

Social-Media-CSS
Social-Media-CSS
Seite bearbeiten -> Seiteneigenschaften bearb. -> (Reiter) Scripts
  1. Öffnen Sie die «Seiteneigenschaften» und wechseln Sie zum Reiter «Scripts»
  2. Fügen Sie nachfolgenden Code ins Feld Scripts ein:


<!-- Start Style Sheet Social Media Icons -->

<style>

.mod-teaser a.facebook, .mod-teaser a.linkedin, .mod-teaser a.xing, .mod-teaser a.twitter, .mod-teaser a.instagram, .mod-teaser a.youtube, .mod-teaser a.issuu
{
    width: 21px;
    height: 21px;
    display: inline-block;
    overflow: hidden;
margin-right:3px;
}

.mod-teaser a.facebook
{
    background-image: url(https://www.uzh.ch/dam/jcr:00000000-7c02-9358-ffff-ffffea416301/facebook.png);
background-repeat: no-repeat;
background-size: 100%;
 content: "";
    display: inline-block;
text-decoration:none;
}
.mod-teaser a.twitter
{
    background-image: url("https://www.uzh.ch/dam/jcr:00000000-7c02-9358-ffff-ffff92e7d42e/twitter.png");
background-repeat: no-repeat;
background-size: 100%;
 content: "";
    display: inline-block;
text-decoration:none;
}
.mod-teaser a.instagram
{
    background-image: url(https://www.uzh.ch/dam/jcr:e0c04bf2-6feb-4925-8043-56aa9cf31214/instagram.png);
background-repeat: no-repeat;
background-size: 100%;
    content: "";
    display: inline-block;
text-decoration:none;

}
.mod-teaser a.youtube
{
    background-image: url("https://www.uzh.ch/dam/jcr:00000000-7c02-9358-ffff-fffffb597cde/youtube.png");
background-repeat: no-repeat;
background-size: 100%;
 content: "";
    display: inline-block;
text-decoration:none;
}
.mod-teaser a.linkedin
{
    background-image: url("https://www.uzh.ch/dam/jcr:00000000-7c02-9358-ffff-ffff9fff7d39/linkedin.png");
background-repeat: no-repeat;
background-size: 100%;
 content: "";
    display: inline-block;
text-decoration:none;
}
.mod-teaser a.xing
{
    background-image: url("https://www.uzh.ch/dam/jcr:39299e70-175a-4d90-b67e-9944a01bddb2/xing.png");
background-repeat: no-repeat;
background-size: 100%;
 content: "";
    display: inline-block;
text-decoration:none;
}
.mod-teaser a.issuu
{
    background-image: url("https://www.uzh.ch/dam/jcr:00000000-7c02-9358-0000-00000bd3a7a4/issuu.png");
background-repeat: no-repeat;
background-size: 100%;
 content: "";
    display: inline-block;
text-decoration:none;
}

</style>

<!-- Style Sheet Social Media Icons -->