Gehashte Dateinamen bei Framer-Downloads beheben

Lade ein PDF in Framer hoch, verknüpfe es mit einem Download-Button und veröffentliche deine Website. Klickt jemand auf den Button, landet statt deiner Broschüre oder Preisliste etwas wie H1noQ3ayrNopaxtDGhblzV37fag.pdf im Download-Ordner. Das wirkt kaputt. Und bei Dateien, die Leute auf ihrem Computer behalten sollen, zum Beispiel ein Immobilien-Exposé oder ein Preisblatt, sieht es sofort unprofessionell aus.

Die Lösung dauert etwa zwei Minuten und funktioniert mit jedem Button auf deiner Seite, nicht nur mit dem eingebauten Download-Button von Framer. Es ist eine kleine Komponente namens Filename Download. Sie sitzt zwischen deinem Button und der Datei und benennt den Download um, bevor er beim Besucher ankommt.

Hier siehst du die Lösung im Video. Oder lies weiter für die schriftliche Anleitung.

Warum Framer das macht

Framer speichert hochgeladene Assets, auch PDFs, mit automatisch generierten Namen. Das hilft beim Caching und Ausliefern. Für Bilder ist das egal, weil sie niemand herunterlädt und nur auf der Seite sieht. Sobald ein Besucher aber eine Datei herunterlädt, landet genau dieser generierte Name im Download-Ordner. Und das ist das Erste, was er sieht.

In vier Schritten einrichten

1. Kopiere die Filename Download Komponente in dein Projekt und füge sie auf dem Canvas neben deinem Download-Button ein.

2. Zieh deinen Button aus dem Komponenten-Frame heraus. Er muss ausserhalb des Frames liegen, aber auf derselben Seite bleiben. Genau hier passieren die meisten Fehler.

3. Wähle die Komponente aus und wähle dann deinen Button in der Button-Einstellung. Jeder Button funktioniert, es muss nicht der Framer Download-Button sein.

4. Entferne das PDF vom Button selbst, lade die Datei dann in der Komponente unter Upload File hoch und gib unter Save As den gewünschten Namen ein.

Nach dem Veröffentlichen kommt der Download mit genau diesem Namen an, ohne Hash, ohne zufällige Zeichen, nur mit dem Dateinamen, den du eingegeben hast.

Ein Name reicht selten: die CMS-Version

Ein fixer Dateiname reicht für eine Landingpage mit einem PDF. Der echte Anwendungsfall ist aber eine CMS Collection, bei der jeder Eintrag eine eigene Datei und einen eigenen Namen braucht. Denk an eine Immobilienseite, auf der jedes Objekt ein eigenes Exposé hat, oder an einen Produktkatalog, in dem jedes Produkt ein eigenes Datenblatt hat.

1. Füge deiner Collection zwei Felder hinzu: ein Datei-Feld für das PDF und ein einfaches Textfeld für den Dateinamen.

2. Fülle beide Felder pro Eintrag aus. Ins Datei-Feld kommt das PDF, ins Textfeld der Name, den der Besucher sehen soll, zum Beispiel Penthouse.pdf.

3. Klicke in der Komponente auf das Plus neben Upload File und Save As und verbinde beide mit dem passenden CMS-Feld.

Jeder Eintrag liefert jetzt seine eigene Datei mit dem richtigen Namen aus, ohne dass du das Design nochmals anfassen musst. Neuen Eintrag hinzufügen, die zwei Felder ausfüllen, und der Download funktioniert automatisch.

Worauf du achten solltest

• Lass den Button ausserhalb des Komponenten-Frames, sonst kann die Komponente ihn nicht verwenden.

• Entferne die Datei vom Button, damit sie nicht mit der Komponente kollidiert.

• Schreib die Dateiendung ins Namensfeld, also Penthouse.pdf und nicht nur Penthouse.

Wenn der Download nach dem Setup immer noch einen Hash-Namen zeigt, prüfe zuerst die Platzierung des Buttons. Fast immer liegt es am Frame, nicht am Datei-Upload.

Komponente holen

Du kannst dir die Filename Download Komponente für Framer holen und direkt in dein Projekt einfügen.