Zum Hauptinhalt springen

PDF-Button

Zeigen Sie einen Button an, der PDFs in einem Popup-Overlay öffnet. Wird als Liste angezeigt, wenn mehrere PDFs verknüpft sind.

Was der PDF-Button macht

Der PDF-Button zeigt einen anklickbaren Button oder Link an. Wenn Kunden darauf klicken, öffnet sich das PDF in einem Popup-Overlay über Ihrer Seite.

Wenn Sie mehrere PDFs mit einer Ressource verknüpfen, erscheinen sie automatisch als Liste von Buttons.

Wie es aussieht

Einzelnes PDF:

  • Ein Button mit PDF-Namen
  • Klick öffnet PDF im Overlay
  • Overlay überdeckt die Seite
  • Schließen-Button kehrt zur Seite zurück

Mehrere PDFs:

  • Liste von Buttons, einer pro PDF
  • Jeder Button öffnet sein PDF
  • Buttons stapeln sich vertikal
  • Alle PDFs von einem Ort aus zugänglich

Wann Button-Anzeige verwendet werden sollte

Am besten für:

  • Mehrere PDFs auf einer Seite
  • Mobiloptimierte Shops
  • Seiten mit begrenztem Platz
  • Schnellreferenzdokumente
  • Download-fokussierte PDFs

Perfekt für:

  • Produktseiten mit Handbüchern, Größentabellen und Garantien
  • Ressourcenseiten mit mehreren Leitfäden
  • Seiten, auf denen eingebettete Viewer zu viel Platz einnehmen würden

PDF-Button zu Ihrem Theme hinzufügen

  1. Gehen Sie zu Onlineshop > Themes
  2. Klicken Sie auf Anpassen bei Ihrem aktiven Theme
  3. Navigieren Sie zum Seitentyp (Produkt, Kollektion usw.)
  4. Klicken Sie auf Abschnitt hinzufügen oder Block hinzufügen
  5. Finden Sie PDF Connect unter Apps
  6. Wählen Sie PDF Button
  7. Klicken Sie auf Speichern

Die Button-Extension anpassen

Im Theme-Editor können Sie anpassen, wie der Button erscheint (nicht der PDF-Viewer selbst):

Überschrift anzeigen - Abschnittsüberschrift ein-/ausschalten

Überschriftstext - Abschnittstitel anpassen (z. B. "PDF herunterladen")

Button-Text - Button-Beschriftung anpassen

Button-Textquelle - Wählen Sie generischen Text, PDF-Namen oder PDF-Beschreibung

Button-Ausrichtung - Links-, Zentrier- oder Rechtsposition

Button-Textausrichtung - Textausrichtung innerhalb des Buttons

Layout für mehrere PDFs - Vertikale (Spalten-) oder horizontale Anzeige

PDF-Symbol anzeigen - PDF-Symbol auf Buttons anzeigen

Container-Rahmen anzeigen - Rahmen um den Button-Bereich hinzufügen

Farben:

  • Button-Hintergrundfarbe
  • Button-Textfarbe
  • Button-Hover-Hintergrundfarbe

PDF-Viewer-Modal-Größe - Wählen Sie, wie groß das Popup erscheint (Klein 60%, Mittel 70%, Groß 80%, Extra Groß 90%)

Diese Einstellungen steuern nur das Erscheinungsbild des Buttons. Der tatsächliche PDF-Viewer (Custom, Light oder Flipbook) wird in der App konfiguriert.

Wie die Liste funktioniert

Wenn mehrere PDFs verknüpft sind:

  1. Alle PDFs erscheinen als einzelne Buttons
  2. Buttons zeigen PDF-Dateinamen an
  3. Kunden klicken auf das gewünschte PDF
  4. Dieses PDF öffnet sich im Popup
  5. Schließen-Button kehrt zur Liste zurück

Keine zusätzliche Einrichtung erforderlich - die Liste erscheint automatisch.

PDF-Viewer-Konfiguration

Bevor Sie die Button-Extension anpassen, müssen Sie wählen, welchen PDF-Viewer Sie verwenden möchten. Dies wird in der App konfiguriert, nicht im Theme-Editor.

Viewer-Typ in der App festlegen

Auf der PDF-Detailseite finden Sie den Abschnitt Viewer-Konfiguration:

Custom Viewer (Vollständig)

  • Vollständig ausgestatteter PDF-Viewer mit allen Navigationselementen
  • Suchfunktion, Zoom-Tools, anpassbare Anzeigeoptionen
  • Mobiloptimierte Anzeige
  • Konfigurieren: Anfangsseite, Zoomstufe, Seitenlayout, Scrollrichtung
  • Aktivieren/Deaktivieren: Download, Toolbar, Bildstempel, Textmarker, Zeichenwerkzeuge, Textauswahl

Light Viewer (Schnell & Einfach)

  • Einfacher, schnell ladender Viewer mit minimaler Oberfläche
  • Perfekt für schnelle Dokumentenvorschau
  • Mobiloptimiert
  • Keine Konfigurationsoptionen - funktioniert einfach

Flipbook Viewer (Interaktive Seiten)

  • Interaktives Seitenumblätter-Erlebnis
  • Imitiert das Lesen eines physischen Buches oder Magazins
  • Großartig für Kataloge, Broschüren, Marketingmaterialien
  • Nicht mobiloptimiert
  • Konfigurieren: Animationsstil, Seitenschatten, Hintergrundfarbe

Der von Ihnen gewählte Viewer-Typ gilt für ALLE Theme App Extensions (sowohl Button als auch eingebettet) für dieses PDF.

Wie das Popup-Overlay funktioniert

Wenn Kunden auf den Button klicken, öffnet sich das PDF in einem Popup mit der von Ihnen festgelegten Viewer-Konfiguration:

Custom Viewer Popup:

  • Vollbildansicht mit allen Steuerelementen
  • Zoom, Suche, Seitennavigation
  • Download/Drucken (wenn aktiviert)
  • Anpassbare Toolbar

Light Viewer Popup:

  • Einfache, saubere Oberfläche
  • Grundlegende Navigation
  • Schnelles Laden

Flipbook Viewer Popup:

  • Seitenumblätter-Animation
  • Realistisches Bucherlebnis
  • Am besten auf Desktop

Button vs. Eingebetteter Vergleich

MerkmalButtonEingebettet
Verwendeter PlatzMinimalGroß
Mehrere PDFsSaubere ListeGestapelte Viewer
MobilfreundlichAusgezeichnetHerausfordernd
SeitenfokusHält Seite sauberZeigt PDF inline
KundenaktionKlick erforderlichSofortige Ansicht

Tipps für Button-Anzeige

Benennen Sie PDFs klar - Button-Beschriftungen verwenden Dateinamen

Reihenfolge ist wichtig - Wichtigstes PDF zuerst

Auf Mobilgeräten testen - Buttons funktionieren großartig auf kleinen Bildschirmen

Erwägen Sie Gruppierung - Verwandte PDFs funktionieren gut als Liste

Button-Text-Anpassung

Machen Sie Button-Beschriftungen kundenfreundlich:

Standard: "produkt-handbuch-v2.pdf"
Besser: "Produkthandbuch"

Sie können den Button-Text in den Theme-Einstellungen oder durch Umbenennen von PDFs vor dem Upload anpassen.

Nächste Schritte