API
Anleitung
  • 1. API-Key beantragen
    Beantragen Sie einen API-Key, damit Sie den Service von COPPIO nutzen können.
  • 2. Javascript einbinden
    Binden Sie folgende Zeilen vor dem schließenen Body-Tag ein.
                                                
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="https://www.coppio.de/system/api/coppio.min.js" data-app-key="Ihr API-Key"></script>
                                                
                                            
  • 3. HTML-Tags setzen
    Damit die API von COPPIO Ihre Bilder erkennt, die zur Entwicklung bereitgestellt werden sollen, müssen alle Bilder folgenden Tags haben.
                                                
    <img 
        src="http://linkzuihrembild_thumbnail.de" 
        alt="vorschau" 
        data-coppio-imgurl="linkzuihrembild" 
        data-coppio="image"
    >
                                                
                                            
    Sobald jetzt auf das Bild geklickt wird, erkennt COPPIO das Bild und speichert dieses ab. Das angeklickte Bild erhält zudem die Klasse ".coppio-img-active", sodass das ausgewählte Bild kenntlich gemacht werden kann. Beispielsweise so:
                                                
    <style>
        .coppio-img-active { border: 2px solid #333; } 
    </style>
                                                
                                            
  • 4. Bilder übergeben
    Zuletzt muss der Bestellen-Button noch eingefügt werden, dafür benutzen Sie bitte folgenden Code:
                                                
    <div data-coppio="addImages">
        (<span data-coppio="counter">0</span>) Bestellen
    </div>