Die Chrome-Entwicklertools zeigen, dass noch einige Assets fehlen. Beheben Sie alle derartigen Fehler, bevor Sie zum nächsten Schritt übergehen.
Benutzerdefinierter HTML-Skin - Ein vorhandenes Site-Design in einen HTML-Skin umwandeln
Dieser Artikel wurde automatisch übersetzt und kann Ungenauigkeiten enthalten.
Original auf Englisch anzeigen
Wenn Sie eine Veranstaltung durchführen und möchten, dass der Stil Ihrer DPG-Site exakt einem vorhandenen Site-Design entspricht, können Sie das HTML der Hauptsite klonen und daraus einen Skin erstellen, der mit DPG verwendet werden kann.
Einen benutzerdefinierten Skin zu erstellen ist völlig optional; für die meisten Nutzer ist es am besten, unsere leicht anpassbaren Templates zu verwenden.
Der HTML-Skin besteht aus einer vollständigen Seite Ihres HTML-Codes, ergänzt um DPG-Inserts, die die Galerie und den übrigen benötigten Code von DPG in die Bereiche einfügen, in denen er angezeigt werden soll.
Viele schreiben den HTML-Skin für die DPG-Site selbst und orientieren sich dabei am Code der Hauptsite. In diesem Tutorial zeigen wir Ihnen jedoch eine schnelle Möglichkeit, ein vorhandenes Design in einen DPG-Skin umzuwandeln.
In dieser Anleitung verwenden wir:
Wenn Sie keinen Entwickler im Team haben, aber einen benutzerdefinierten HTML-Skin wünschen, können wir diesen Service gegen Aufpreis anbieten. Wenden Sie sich für weitere Informationen an support@digitalphotogallery.com.
Das HTML auf Ihre lokale Festplatte klonen
Stellen Sie sicher, dass Homebrew installiert ist, und führen Sie dann den Befehl aus, um wget zu installieren:
brew install wget
Erstellen Sie einen neuen Ordner, wechseln Sie mit cd hinein und verwenden Sie den folgenden Befehl, um die Assets von der Website zu klonen, mit der Sie die Integration vornehmen:
wget -U firefox -p -k -H http://www.targetdomain.com/Assets auf Ihren eigenen Server oder Ihr CDN hochladen
Laden Sie Ihre geklonten Assets an einen online erreichbaren Ort hoch; in diesem Beispiel verwende ich Transmit mit Amazon S3.
Wenn Sie die volle Kontrolle über die Hauptsite haben und die Asset-Speicherorte vorhersehbar sind, können Sie auf diese Assets verlinken, anstatt sie zu klonen.
Alle Assets neu verlinken
Als Sie den wget-Befehl ausgeführt haben, wurde das HTML der angegebenen Seite heruntergeladen. Suchen Sie diese Datei auf Ihrer lokalen Festplatte und ersetzen Sie im Code alle verlinkten Assets durch ihre neue Adresse. Testen Sie die lokale Seite regelmäßig in einem Browser, um Ihren Fortschritt zu überprüfen.
Während Sie die Assets neu verlinken, möchten Sie vielleicht auch ungenutzten Tracking-Code entfernen.
Sobald keine Fehler mehr auftreten, prüfen Sie die Domain, von der die Assets stammen, um sicherzustellen, dass keine Assets von einer Adresse ausgeliefert werden, über die Sie keine Kontrolle haben.
Beispieldatei in diesem Stadium.
Mehr über DPG-Seitenlayouts erfahren
Lesen Sie diesen Artikel, um zu erfahren, wie Sie den aktuellen DPG-Insert-Code erhalten und Ihren HTML-Code auf Ihre DPG-Galerie anwenden.
Das heruntergeladene HTML in einen Skin umwandeln
Da Sie nun eine perfekte Kopie der Originalseite haben, können Sie sie bearbeiten und die DPG-Inserts hinzufügen.
Fügen Sie die DPG-Inserts für den Header hinzu.
Entfernen Sie das Inhalts-HTML und ersetzen Sie es durch den DPG-Inhalts-Insert.
Fügen Sie am Ende der Seite Inserts hinzu.
Erstellen Sie Ihr Seitenlayout in DPG.
Testen Sie Ihr Layout auf einer einzelnen Seite. Sobald Sie wissen, dass es korrekt funktioniert, wenden Sie es auf alle Seiten an.
Sie haben nun eine voll funktionsfähige DPG-Site, die zu Ihrer Hauptwebsite passt. Fügen Sie abschließend auf Ihrer Hauptsite Links hinzu, die auf die neue Fotogalerie verweisen.
Fertiger Code aus diesem Beispiel.