Social andel social-share

Verktyget för delning via sociala medier visas som standard i det övre vänstra hörnet. Den består av en knapp och en panel som utökas när användaren klickar eller trycker på en knapp och innehåller enskilda delningsverktyg.

Placeringen och storleken på verktyget för delning via sociala medier i visningsprogrammets användargränssnitt styrs med följande:

.s7ecatalogsearchviewer .s7socialshare

CSS-egenskaper för verktyget för social delning

Exempel - Ställ in ett verktyg för delning via sociala medier som är placerat fyra pixlar från överkanten och fem pixlar från höger om visningsprogrammets behållare och som har storleken 28 x 28 pixlar.

.s7ecatalogsearchviewer .s7socialshare {
margin-top: 4px;
margin-left: 10px; width:28px;
 height:28px;
}

Utseendet på verktygsknappen för delning via sociala medier styrs av följande CSS-klassväljare:

.s7ecatalogsearchviewer .s7socialshare .s7socialbutton

CSS-egenskaper för den sociala knappen

Knappens funktionsbeskrivning kan lokaliseras. Mer information finns i Lokalisering av användargränssnittselement.

Exempel - Ställ in en knapp för verktyget för delning via sociala medier som visar olika bilder för de fyra olika knapplägena.

.s7ecatalogsearchviewer .s7socialshare .s7socialbutton[state='up'] {
background-image:url(images/v2/SocialShare_video_dark_up.png);
}
.s7ecatalogsearchviewer .s7socialshare .s7socialbutton[state='over'] {
background-image:url(images/v2/SocialShare_dark_over.png);
}
.s7ecatalogsearchviewer .s7socialshare .s7socialbutton[state='down'] {
background-image:url(images/v2/SocialShare_dark_down.png);
}
.s7ecatalogsearchviewer .s7socialshare .s7socialbutton[state='disabled'] {
background-image:url(images/v2/SocialShare_dark_disabled.png);
}

Utseendet på panelen som innehåller de enskilda ikonerna för social delning styrs med följande CSS-klassväljare:

.s7ecatalogsearchviewer .s7socialshare .s7socialsharepanel

CSS-egenskaper för panelen för social delning

Exempel - ställ in en panel så att den har genomskinlig färg:

.s7ecatalogsearchviewer .s7socialshare .s7socialsharepanel {
 background-color: transparent;
}