Deutsch English Français

Design Connector

Inhaltsverzeichnis

Introduzione

Il modulo “Design Connector” può essere utilizzato quando si integra il negozio online in un sito web esistente.

Questo modulo è disponibile per PepperShop Professional e deve essere acquistato separatamente.

File modello

Il file modello è una “pagina vuota” del sito web. Contiene un “marcatore” che definisce dove appare il negozio. Nella configurazione standard, il testo per il marcatore è <!-- SHOP -->.

Il file modello deve utilizzare collegamenti assoluti per il proprio contenuto e i propri collegamenti (ad es.: <img src="http://example.com/xy.jpg">).

È vantaggioso utilizzare il framework HTML Bootstrap, poiché anche il negozio lo utilizza.

Componenti del negozio

Ulteriori “marcatori” predefiniti possono essere utilizzati nel file modello:

  • <!-- SHOP_SEARCH -->
  • <!-- SHOP_BASKET -->
  • <!-- SHOP_ACCOUNT -->
  • <!-- SHOP_CURRENCY -->
  • <!-- SHOP_LANGUAGE -->

Questi marcatori vengono sostituiti dinamicamente dal negozio quando vengono chiamati.

Configurazione Design Connector

Il Design Connector ora utilizza questa pagina vuota e inserisce il negozio online al posto del marcatore <!-- SHOP -->.

Le modifiche per il file modello devono essere effettuate nel file design_integration.php.

$externe_domain = 'http://www.example.com';
$externe_seite_webpath = array('de'=>'/path/cms-seite.html');

Deve essere definito un URL per ogni lingua.

Gli altri marcatori (carrello, …) possono anche essere attivati o disattivati nella configurazione.

Attivazione

Per attivare il Design Connector, l’impostazione deve essere modificata nell’editor di configurazione (Impostazioni → Configurazione sistema → Configurazione → “Visualizza e modifica le costanti di controllo di questo negozio” → Editor di configurazione).

prima: define('EXTERNE_DESIGN_INTEGRATION',false); dopo: define('EXTERNE_DESIGN_INTEGRATION',true);

Installazione

Requisiti di sistema

Per utilizzare il modulo Design Connector, è necessario un PepperShop v.3.0 Professional.

Copiare e caricare il file

Il modulo Design Connector consiste in un file che deve essere copiato nel tuo PepperShop installato. Prima, estrai l’archivio ZIP fornito. È incluso il seguente file, mostrato qui con la directory di destinazione: {shopdir}/shop/design_integration.php

Modello di esempio

File di esempio per un modello con più “marcatori” che vengono sostituiti dal Design Connector con i rispettivi componenti. Quali marcatori devono essere sostituiti può essere definito nella configurazione del Design Connector.

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Shop Template</title>
    <link
      rel="stylesheet"
      href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"
    />
    <style>
      .navbar {
        border-radius: 0;
        border-bottom: 4px solid \#555555;
        color: #ffffff;
      }
      .navbar-header .navbar-brand {
        padding-top: 15px;
      }
      .footer {
        border-top: 1px #dddddd solid;
        margin-top: 20px;
      }
    </style>
  </head>
  <body>
    <nav class="navbar navbar-inverse">
      <div class="container">
        <div class="navbar-header">
          <button
            type="button"
            class="navbar-toggle collapsed"
            data-toggle="collapse"
            data-target="#navbar"
            aria-expanded="false"
            aria-controls="navbar"
          >
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">*Sito web*</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">*Home*</a></li>
            <li><a href="#menu1">*Menu 1*</a></li>
            <li><a href="#menu2">*Menu 2*</a></li>
            <li><a href="#shop">*Negozio online*</a></li>
          </ul>
        </div>
        <!-- SHOP_SEARCH -->
        <!-- SHOP_BASKET -->
        <!-- SHOP_ACCOUNT -->
        <!-- SHOP_CURRENCY -->
        <!-- SHOP_LANGUAGE -->
      </div>
    </nav>
    <!-- SHOP -->
    <div class="container">
      <footer class="footer">
        <p>Footer</p>
      </footer>
    </div>
  </body>
</html>

Ulteriore aiuto

Avete domande o avete bisogno di assistenza? Avete esigenze particolari o desiderate una soluzione personalizzata per il vostro sistema? Il nostro team di supporto sarà lieto di aiutarvi. I servizi di supporto vengono fatturati in base al tempo impiegato a CHF 195.- / ora. Ecco come raggiungerci:

Altre pagine utili

🌶️
🔥
🌶️