Incompatibilité de HTML5 ecatalog CSS avec les composants sociaux

Rechercher

Dernière mise à jour le 2 mai 2021 | S’applique également à Experience Manager

Question

Nous voulons supprimer les réseaux sociaux des paramètres prédéfinis prêts à l'emploi du visionneur eCatalog.
Nos propres paramètres prédéfinis de visionneur d'eCatalog ont été créés en dénudant le CSS, avec la volonté de supprimer le partage social.
Nous avons créé notre propre préréglage de visualiseur de catalogue électronique personnalisé en dépouillant le CSS et souhaitons corriger le partage social pour qu'il s'affiche correctement.

Réponse

Incompatibilité de HTML5 ecatalog CSS avec les composants sociaux

ECATALOG HTML5

Supprimer la prise en charge du partage hors limites sur les réseaux sociaux d'ecatalog 4.9

Cas d'utilisation : Un client utilise le visualiseur hors limites d'ecatalog, ou un paramètre prédéfini avec lecteur personnalisé hors limites CSS. Avec la version 4.9, le nouveau bouton Partage sur les réseaux sociaux s'affiche dans la barre de contrôle supérieure. Le client ne souhaite pas disposer de cette fonction de partage social.
Problème d'URL :

http://s7d1.scene7.com/s7viewers/html5/eCatalogViewer.html?emailurl=http://s7d1.scene7.com/s7/emailFriend&serverUrl=http://s7d1.scene7.com/is/image/&config=Scene7SharedAsset

Solution :

Dans SPS, dans la page Configuration de visualiseurs sélectionnez Universal_HTML5_eCatalog prédéfini en service et sélectionnez Exporter. Le fichier visualiseur CSS (html5_ecatalogviewer_dark.css) sera téléchargé sur votre disque dur.
Ouvrir le fichier CSS dans l’éditeur.

Ajoutez le bloc suivant en haut du fichier :

.s7ecatalogviewer .s7socialshare {
display:none;
}

Télécharger le fichier CSS modifié vers votre propre fonction SPS
Créer un nouveau paramètre prédéfini du ecatalog HTML5 dans votre entreprise, affectez à ce paramètre prédéfini le nouveau CSS chargé, et utilisez ce paramètre prédéfini dans l'URL de production.

URL résolue:

http://s7d1.scene7.com/s7viewers/html5/eCatalogViewer.html?emailurl=http://s7d1.scene7.com/s7/emailFriend&serverUrl=http://s7d1.scene7.com/is/image/&config=sashadallas/HTML5_eCatalog_49_no_social&contenturl=http://s7d1.scene7.com/skins/&asset=Scene7SharedAssets/eCatalog_Sample

Supprimer la prise en charge du partage sur les réseaux sociaux du ecatalog 4.8 personnalisé.

Cas d'utilisation : Un client utilise le paramètre prédéfini du visualiseur personnalisé et du ecatalog CSS personnalisé créé avant la version 4.9. Avec la version 4.9, un bouton de partage sur les réseaux sociaux s'affiche au mauvais endroit et est inconvenablement épuré. Le client ne souhaite pas disposer de cette fonction de partage social.

Problème d'URL:

http://s7d1.scene7.com/s7viewers/html5/eCatalogViewer.html?emailurl=http://s7d1.scene7.com/s7/emailFriend&serverUrl=http://s7d1.scene7.com/is/image/&config=sashadallas/HTML5

Solution :

Dans la page Configuration de visualiseurs, sélectionnez votre préconfiguration eCatalog personnalisé en cours d’utilisation et choisissez Exporter. Le fichier CSS du visualiseur sera téléchargé sur votre disque dur.
Ouvrir le fichier CSS dans l’éditeur.

Ajoutez le bloc suivant en haut du fichier :

.s7ecatalogviewer .s7socialshare {
display:none;
}

Téléchargez le fichier CSS modifié dans votre entreprise. Notez que cela va remplacer votre fichier CSS personnalisé d'origine.
Vous devrez peut-être demander la suppression du cache CDN pour votre URL de production dans le fichier CSS.

URL résolue:

http://s7d1.scene7.com/s7viewers/html5/eCatalogViewer.html?emailurl=http://s7d1.scene7.com/s7/emailFriend&serverUrl=http://s7d1.scene7.com/is/image/&config=sashadallas/HTML5_eCatalog_48_no_social&contenturl=http://s7d1.scene7.com/skins/&asset=Scene7SharedAssets/eCatalog_Sample

Ajouter la prise en charge de partage de réseaux sociaux à l'eCatalog 4.8 personnalisé

Cas d'utilisation : Un client utilise le paramètre prédéfini du visualiseur personnalisé et de l'eCatalog CSS personnalisé créé avant la version 4.9. Avec la version 4.9, un bouton de partage sur les réseaux sociaux s'affiche au mauvais endroit et est inconvenablement dépouillé. Le client veut bénéficier d’une fonctionnalité de partage de réseaux sociaux correctement fonctionnelle dans son lecteur de contenu personnalisé.
Problème d'URL :

http://s7d1.scene7.com/s7viewers/html5/eCatalogViewer.html?emailurl=http://s7d1.scene7.com/s7/emailFriend&serverUrl=http://s7d1.scene7.com/is/image/&config=sashadallas/HTML5

Solution.

Dans la page Configuration de visualiseurs, sélectionnez votre préconfiguration eCatalog personnalisé en cours d’utilisation et choisissez Exporter. Le fichier CSS du visualiseur sera téléchargé sur votre disque dur.
Ouvrir le fichier CSS dans l’éditeur.

Ajoutez le bloc suivant en haut du fichier :

/*** SOCIAL SHARE ***/
.s7ecatalogviewer .s7socialshare {
position:absolute;
top:4px;
left:47px;
width:28px;
height:28px;
}
.s7ecatalogviewer .s7socialshare .s7socialsharepanel {
background-color: rgb(231, 231, 231);/whithout alpha/
background-color: rgba(231, 231, 231, 0);
}
.s7ecatalogviewer .s7socialshare .s7socialbutton {
background-color: transparent;
}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='up' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_up?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='over' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_over?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='down' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_down?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='disabled' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_disabled?scl=1&fmt=png-alpha);}

/*** EMAIL SHARE ***/
.s7ecatalogviewer .s7emailsharestate='up' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_up?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='over' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_over?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='down' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_down?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_disabled?scl=1&fmt=png-alpha);}

/*** EMBED SHARE ***/
.s7ecatalogviewer .s7embedsharestate='up' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_up?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='over' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_over?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='down' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_down?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_disabled?scl=1&fmt=png-alpha);}

/*** LINK SHARE ***/
.s7ecatalogviewer .s7linksharestate='up' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_up?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='over' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_over?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='down' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_down?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_disabled?scl=1&fmt=png-alpha);}

/*** FACEBOOK SHARE ***/
.s7ecatalogviewer .s7facebooksharestate='up' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_up?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='over' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_over?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='down' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_down?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_disabled?scl=1&fmt=png-alpha);}

/*** TWITTER SHARE ***/
.s7ecatalogviewer .s7twittersharestate='up' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_up?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='over' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_over?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='down' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_down?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_disabled?scl=1&fmt=png-alpha);}

/*** Social Share Dialogs CloseButton ***/
.s7embeddialog .s7closebutton {
position: absolute;
width: 28px;
height: 28px;
}
.s7embeddialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled?scl=1&fmt=png-alpha); }

.s7emaildialog .s7closebutton {
position: absolute;
width: 28px;
height: 28px;
}
.s7emaildialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled?scl=1&fmt=png-alpha); }

.s7linkdialog .s7closebutton {
position: absolute;
width: 28px;
height: 28px;
}
.s7linkdialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled?scl=1&fmt=png-alpha); }

.s7dialogbody { -webkit-transform: translateZ(0);}

/Tablet/
@media only screen and (max-device-width:13.5in) and (max-device-height:13.5in) and (max-device-width:799px),
only screen and (max-device-width:13.5in) and (max-device-height:13.5in) and (max-device-height:799px)
{
/*** SOCIAL SHARE ***/
.s7ecatalogviewer .s7socialshare {
position:absolute;
bottom:4px;
left:75px;
width:56px;
height:56px;
}

.s7ecatalogviewer .s7socialshare .s7socialbutton{
width:56px;
height:56px;
background-color: rgb(231, 231, 231);
background-color: rgba(231, 231, 231, 0);
}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='up' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='over' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='disabled' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_disabled_touch?scl=1&fmt=png-alpha);}

/*** EMAIL SHARE ***/
.s7ecatalogviewer .s7emailshare{
width:56px;
height:56px;
}
.s7ecatalogviewer .s7emailsharestate='up' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='over' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='down' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_disabled_touch?scl=1&fmt=png-alpha);}

/*** EMBED SHARE ***/
.s7ecatalogviewer .s7embedshare{
width:56px;
height:56px;
}
.s7ecatalogviewer .s7embedsharestate='up' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='over' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='down' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_disabled_touch?scl=1&fmt=png-alpha);}

/*** LINK SHARE ***/
.s7ecatalogviewer .s7linkshare{
width:56px;
height:56px;
}
.s7ecatalogviewer .s7linksharestate='up' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='over' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='down' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_disabled_touch?scl=1&fmt=png-alpha);}

/*** FACEBOOK SHARE ***/
.s7ecatalogviewer .s7facebookshare{
width:56px;
height:56px;
}
.s7ecatalogviewer .s7facebooksharestate='up' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='over' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='down' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_disabled_touch?scl=1&fmt=png-alpha);}

/*** TWITTER SHARE ***/
.s7ecatalogviewer .s7twittershare {
width:56px;
height:56px;
}
.s7ecatalogviewer .s7twittersharestate='up' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='over' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='down' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_disabled_touch?scl=1&fmt=png-alpha);}

/*** Email panel ***/
.s7emaildialog .s7dialog {
width: 100%;
height: 100%;
border: none;
background-color: #ffffff;
border-radius: 0px;
}
.s7emaildialog .s7dialogfooter {
position:absolute;
bottom: 0px;
padding: 0;
}
.s7emaildialog .s7dialogviewarea {
overflow:scroll;
-webkit-overflow-scrolling: touch;
}
.s7emaildialog .s7dialogheader{
padding: 0;
}
.s7emaildialog .s7dialogviewarea {
padding: 0;
}
.s7emaildialog .s7dialogbody {
padding: 0;
}
.s7emaildialog .s7dialogerrormessage {
font-size: 16pt;
}
.s7emaildialog .s7dialogheadertext {
font-size: 26pt;
}
.s7emaildialog .s7dialoginputlabel {
font-size: 18pt;
width: 100px;
}
.s7emaildialog .s7dialogaddemailbutton {
font-size: 16pt;
}
.s7emaildialog .s7dialogmessage {
font-family: Helvetica;
height: 110px;
font-size: 17pt;
}
.s7emaildialog .s7dialoginputcontainer {
padding: 15px 10px;
}
.s7emaildialog .s7dialoginputshort {
font-size: 20pt;
width: 400px;
}
.s7emaildialog .s7dialoginputwide {
font-size: 20pt;
width: 430px;
}
.s7emaildialog .s7dialogthumbnail {
width: 180px;
height: 120px;
}
.s7emaildialog .s7dialoginfopanel {
width: 390px;
}
.s7emaildialog .s7dialogtitle {
font-size: 24pt;
}
.s7emaildialog .s7dialogorigin {
font-size: 19pt;
}
.s7emaildialog .s7dialogdescription {
font-size: 17pt;
}
.s7emaildialog .s7dialogremoveemailbutton {
height: 35px;
width: 35px;
background-position : center;
background-repeat: no-repeat;
}
.s7emaildialog .s7dialogfooter .s7button {
font-size: 26pt;
line-height: 80px;
}
.s7emaildialog .s7dialogcancelbutton{
width: 240px;
height: 80px;
margin-right: 20px;
}
.s7emaildialog .s7dialogactionbutton {
width: 240px;
height: 80px;
margin-right: 20px;
}

/*** Link panel ***/
.s7linkdialog .s7dialog {
width: 100%;
height: 100%;
border: none;
background-color: #ffffff;
border-radius: 0px;
}
.s7linkdialog .s7dialogfooter {
position:absolute;
bottom: 0px;
}
.s7linkdialog .s7dialogheader{
padding: 0;
}
.s7linkdialog .s7dialogviewarea {
padding: 0;
}
.s7linkdialog .s7dialogbody {
padding: 0;
}
.s7linkdialog .s7dialogheadertext {
font-size: 26pt;
}
.s7linkdialog .s7dialoginputwide {
font-size: 16pt;
width: 590px;
}
.s7linkdialog .s7dialoglink {
font-size: 20pt;
width: 578px;
}
.s7linkdialog .s7dialoginputcontainer {
padding: 15px 10px;
}
.s7linkdialog .s7dialogfooter .s7button {
font-size: 26pt;
line-height: 80px;
}
.s7linkdialog .s7dialogcancelbutton{
width: 240px;
height: 80px;
margin-right: 20px;
}

/*** Embed panel ***/
.s7embeddialog .s7dialog {
width: 100%;
height: 100%;
border: none;
background-color: #ffffff;
border-radius: 0px;
}
.s7embeddialog .s7dialogfooter {
position:absolute;
bottom: 0px;
}
.s7embeddialog .s7dialogviewarea {
overflow:scroll;
-webkit-overflow-scrolling: touch;
}
.s7embeddialog .s7dialogheader{
padding: 0;
}
.s7embeddialog .s7dialogviewarea {
padding: 0;
}
.s7embeddialog .s7dialogbody {
padding: 0;
}
.s7embeddialog .s7dialogheadertext {
font-size: 26pt;
}
.s7embeddialog .s7dialoginputwide {
font-size: 16pt;
width: 600px;
}
.s7embeddialog .s7dialoginputcontainer{
width: 578px;
font-size: 14pt;
}
.s7embeddialog .s7dialogembedsizelabel {
font-size: 16pt;
width: 120px;
}
.s7embeddialog .s7dropdownitemanchor {
font-size: 16pt;
}
.s7comboboxexpanded="false" {
width: 180px;
}
.s7embeddialog .s7sizeinp {
font-size: 16pt;
}
.s7embeddialog .s7dialogfooter .s7button {
font-size: 26pt;
line-height: 80px;
}
.s7embeddialog .s7dialogcancelbutton{
width: 240px;
height: 80px;
margin-right: 20px;
}

/*** Social Share Dialogs CloseButton ***/
.s7embeddialog .s7closebutton {
position: absolute;
width: 56px;
height: 56px;
}
.s7embeddialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up_touch?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over_touch?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down_touch?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled_touch?scl=1&fmt=png-alpha); }

.s7emaildialog .s7closebutton {
position: absolute;
width: 56px;
height: 56px;
}
.s7emaildialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up_touch?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over_touch?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down_touch?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled_touch?scl=1&fmt=png-alpha); }

.s7linkdialog .s7closebutton {
position: absolute;
width: 56px;
height: 56px;
}
.s7linkdialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up_touch?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over_touch?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down_touch?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled_touch?scl=1&fmt=png-alpha); }
}
@media only screen and (max-device-width:13.5in) and (max-device-height:13.5in) and (max-device-width:799px) and (-webkit-min-device-pixel-ratio:1.5),
only screen and (max-device-width:13.5in) and (max-device-height:13.5in) and (max-device-height:799px) and (-webkit-min-device-pixel-ratio:1.5)
{
/*** SOCIAL SHARE ***/
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='up' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='over' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='disabled' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}

/*** EMAIL SHARE ***/
.s7ecatalogviewer .s7emailsharestate='up' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='over' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='down' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7emailsharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/EmailShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}

/*** EMBED SHARE ***/
.s7ecatalogviewer .s7embedsharestate='up' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='over' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='down' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7embedsharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/EmbedShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}

/*** LINK SHARE ***/
.s7ecatalogviewer .s7linksharestate='up' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='over' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='down' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7linksharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/LinkShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}

/*** FACEBOOK SHARE ***/
.s7ecatalogviewer .s7facebooksharestate='up' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='over' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='down' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}

/*** TWITTER SHARE ***/
.s7ecatalogviewer .s7twittersharestate='up' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='over' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='down' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}

/*** Social Share Dialogs CloseButton ***/
.s7embeddialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up_touch_2x?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over_touch_2x?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down_touch_2x?scl=1&fmt=png-alpha); }
.s7embeddialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled_touch_2x?scl=1&fmt=png-alpha); }

.s7emaildialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up_touch_2x?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over_touch_2x?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down_touch_2x?scl=1&fmt=png-alpha); }
.s7emaildialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled_touch_2x?scl=1&fmt=png-alpha); }

.s7linkdialog .s7closebuttonstate='up' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_up_touch_2x?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='over' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_over_touch_2x?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_down_touch_2x?scl=1&fmt=png-alpha); }
.s7linkdialog .s7closebuttonstate='disabled' { background-image:url(/is/image/Scene7SharedAssets/CloseButton_light_disabled_touch_2x?scl=1&fmt=png-alpha); }
}
@media only screen and (max-device-width:9in) and (max-device-height:9in)
{
/*** SOCIAL SHARE ***/
.s7ecatalogviewer .s7socialshare {
position:absolute;
top:8px;
left:72px;
width:56px;
height:56px;
}
.s7ecatalogviewer .s7socialshare .s7socialbutton{
width:56px;
height:56px;
background-color: rgb(231, 231, 231);
background-color: rgba(231, 231, 231, 0);
}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='up' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='over' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='disabled' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_disabled_touch?scl=1&fmt=png-alpha);}

/*** EMAIL SHARE ***/
.s7ecatalogviewer .s7emailshare {
display:none;
}

/*** EMBED SHARE ***/
.s7ecatalogviewer .s7embedshare {
display:none;
}

/*** LINK SHARE ***/
.s7ecatalogviewer .s7linkshare {
display:none;
}

/*** FACEBOOK SHARE ***/
.s7ecatalogviewer .s7facebookshare{
width:56px;
height:56px;
}
.s7ecatalogviewer .s7facebooksharestate='up' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='over' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='down' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_disabled_touch?scl=1&fmt=png-alpha);}

/*** TWITTER SHARE ***/
.s7ecatalogviewer .s7twittershare {
width:56px;
height:56px;
}
.s7ecatalogviewer .s7twittersharestate='up' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_up_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='over' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_over_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='down' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_down_touch?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_disabled_touch?scl=1&fmt=png-alpha);}
}
/*for phones with 2 pixel ratio, includes special case for Samsung Galaxy SIII */
@media only screen and (max-device-width:9in) and (max-device-height:9in) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (device-width:720px) and (device-height:1280px) and (-webkit-device-pixel-ratio: 2),
only screen and (device-width:1280px) and (device-height:720px) and (-webkit-device-pixel-ratio: 2)
{
/*** SOCIAL SHARE ***/
.s7ecatalogviewer .s7socialshare {
position:absolute;
bottom: 8px;
left:72px;
width:56px;
height:56px;
}
.s7ecatalogviewer .s7socialshare .s7socialbutton{
width:56px;
height:56px;
background-color: rgb(231, 231, 231);
background-color: rgba(231, 231, 231, 0);
}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='up' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='over' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='down' { background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7socialshare .s7socialbuttonstate='disabled' {background-image:url(/is/image/Scene7SharedAssets/SocialShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}

/*** EMAIL SHARE ***/
.s7ecatalogviewer .s7emailshare {
display:none;
}

/*** EMBED SHARE ***/
.s7ecatalogviewer .s7embedshare {
display:none;
}

/*** LINK SHARE ***/
.s7ecatalogviewer .s7linkshare {
display:none;
}

/*** FACEBOOK SHARE ***/
.s7ecatalogviewer .s7facebookshare{
width:56px;
height:56px;
}
.s7ecatalogviewer .s7facebooksharestate='up' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='over' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='down' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7facebooksharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/FacebookShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}

/*** TWITTER SHARE ***/
.s7ecatalogviewer .s7twittershare {
width:56px;
height:56px;
}
.s7ecatalogviewer .s7twittersharestate='up' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_up_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='over' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_over_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='down' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_down_touch_2x?scl=1&fmt=png-alpha);}
.s7ecatalogviewer .s7twittersharestate='disabled' {background-image:url(/is/image/Scene7SharedAssets/TwitterShare_dark_disabled_touch_2x?scl=1&fmt=png-alpha);}
}

Si nécessaire, ajustez la position du bouton partage sur réseaux sociaux en modifiant la classe CSS .s7socialshare
Le cas échéant, réglez l’illustration hors limites pour les boutons et boîtes de dialogue de partage de réseaux sociaux.
Téléchargez le fichier CSS modifié dans votre fonction. Notez que cela va remplacer votre fichier CSS personnalisé d'origine.
Vous devrez peut-être demander la suppression du cache CDN pour votre URL de production dans le fichier CSS.

URL résolue : http://s7d1.scene7.com/s7viewers/html5/eCatalogViewer.html?emailurl=http://s7d1.scene7.com/s7/emailFriend&serverUrl=http://s7d1.scene7.com/is/image/&config=sashadallas/HTML5_e

Journalisation des

Informations sur la façon de consigner l’incident dans RightNow

Produit : Scene7 - Visualiseur/eCatalog - Intégration de page web - Visualiseurs, mobile iOS, HTML5
Mise en forme : question générale - Information DB (KDB) appropriée.