Incompatibilità CSS con eCatalog HTML5 e componenti sociali

Domanda

  1. Vogliamo rimuovere la condivisione sociale dal visualizzatore di eCatalog preimpostato

  2. Abbiamo creato il nostro visualizzatore eCatalog personalizzato preimpostato modificando la skin tramite CSS, e vogliamo rimuovere il social sharing

  3. Abbiamo creato il nostro visualizzatore eCatalog personalizzato preimpostato modificando la skin tramite CSS, e vogliamo che il social sharing sia visualizzato correttamente.

Risposta

Incompatibilità CSS con eCatalog HTML5 e componenti sociali

ECATALOG HTML5

Rimuovere il supporto alla condivisione sociale dall'OOB 4.9 di eCatalog

Caso d'uso: Un cliente sta usando il visualizzatore OOB di eCatalog, o un visualizzatore personalizzato preimpostato con OOB viewer CSS. Nella versione 4.9, il nuovo pulsante di social sharing si trova nella barra di controllo nella parte superiore. Il cliente non vuole avere questa funzione di social sharing.
URL del problema:

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

Soluzione:

  1. In SPS, nella pagina Viewers Setup, seleziona la preimpostazione Universal_HTML5_eCatalog in uso e seleziona Export. Il file CSS del visualizzatore (html5_ecatalogviewer_dark.css) verrà scaricato sul tuo disco rigido.

  2. Apri il file CSS nell'editor

  3. Aggiungi il seguente blocco all'inizio del file:

    .s7ecatalogviewer .s7socialshare {
    display:none;
    }
  4. Carica i CSS modificati dall'SPS della tua organizzazione

  5. Crea un nuovo eCatalog HTML5 preimpostato nella tua azienda, assegna quel preset con i CSS appena caricati e usa quel preset nell'URL di produzione.

URL risoluzione:

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

Rimuovere il supporto per il social sharing da eCatalog 4.8 personalizzato

Caso d'uso: Un cliente utilizza un visualizzatore di eCatalog personalizzato preimpostato e CSS personalizzati creati prima della versione 4.9. Con la versione 4.9, un pulsante di social sharing appare nel posto sbagliato e con una skin errata. Il cliente non vuole avere questa funzione di social sharing.

URL del problema:

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

Soluzione:

  1. In SPS, nella pagina Viewers Setup, seleziona il tuo eCatalog personalizzato preimpostato in uso e scegli Export. Il file CSS del visualizzatore sarà scaricato sul disco rigido

  2. Apri il file CSS nell'editor

  3. Aggiungi il seguente blocco all'inizio del file:

    .s7ecatalogviewer .s7socialshare {
    display:none;
    }
  4. Carica i CSS modificati per la tua azienda. Nota: questo passaggio sovrascriverà il file CSS originale personalizzato.

  5. Potrebbe essere necessario richiedere un clear della cache CDN per il file che connette il CSS e l'URL di produzione.

URL risolto:

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

Aggiungere il supporto per il social sharing a eCatalog 4.8 personalizzato

Caso d'uso: Un cliente utilizza un visualizzatore di eCatalog personalizzato preimpostato e CSS personalizzati creati prima della versione 4.9. Con la versione 4.9, un pulsante di social sharing appare nel posto sbagliato e con una skin errata. Il cliente vuole avere le funzionalità di social sharing funzionanti nel suo visualizzatore personalizzato.
URL del problema:

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

Soluzione.

  1. In SPS, nella pagina Viewers Setup, seleziona il tuo eCatalog personalizzato preimpostato in uso e scegli Export. Il file CSS del visualizzatore sarà scaricato sul disco rigido

  2. Apri il file CSS nell'editor

  3. Aggiungi il seguente blocco all'inizio del file:

    /*** 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);}
    }
  4. Se necessario, regola la posizione del pulsante di social sharing modificando la classe CSS .s7socialshare

  5. Se necessario, regola l'artwork OOB per i pulsanti di social sharing e le finestre di dialogo

  6. Carica i CSS modificati per la tua azienda. Nota: questo passaggio sovrascriverà il file CSS originale personalizzato.

  7. Potrebbe essere necessario richiedere un clear della cache CDN per il file che connette il CSS e l'URL di produzione.

    URL soluzione: 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

Logging

Informazioni su come registrare l'incidente in RightNow

Prodotto: Scene7 - Visualizzatori/eCatalog - Integrazione di pagine web - Visualizzatori, iOS mobile,
disposizione HTML5: Domanda generale - Knowledge DB (KDB) appropriato

 Adobe

Ottieni supporto in modo più facile e veloce

Nuovo utente?

Adobe MAX 2024

Adobe MAX
La conferenza sulla creatività

14-16 ottobre Miami Beach e online

Adobe MAX

La conferenza sulla creatività

14-16 ottobre Miami Beach e online

Adobe MAX 2024

Adobe MAX
La conferenza sulla creatività

14-16 ottobre Miami Beach e online

Adobe MAX

La conferenza sulla creatività

14-16 ottobre Miami Beach e online