Klicken Sie in Ihrem Figma-Konto in der unteren Symbolleiste auf „Aktionen“ und wählen Sie die Registerkarte „Plugins & Widgets“ aus. Geben Sie in das Suchfeld den Namen des Tilda „Figma to Tilda ein und klicken Sie darauf oder fügen Sie das Plugin über den Link hinzu.

Klicken Sie auf die Schaltfläche „Ausführen“, um das Plugin zu aktivieren.

Es ist soweit! Jetzt kannst du Ebenen und Elemente in Tilda importieren.

Nachdem Sie das Plugin hinzugefügt haben, wählen Sie die gewünschte Ebene im Layout aus. Die ausgewählte Ebene wird im Feld „Ausgewählte Ebenen“ des Plugin-Fensters angezeigt.

Klicken Sie im Plugin-Fenster auf die Schaltfläche „Zum Kopieren vorbereiten“, um die Ebenen für den Import vorzubereiten.

Wenn der Frame zum Importieren bereit ist, klicken Sie auf die Schaltfläche „In die Zwischenablage kopieren “.

Gehe zu Tilda öffne Zero Block klicke auf die Tastenkombination: Strg+V unter Windows oder Befehl+V auf dem Mac.

Sie können den Rahmen als separate Gruppe importieren oder so, dass die Einstellungen auf die Zeichenfläche angewendet und alle aktuellen Elemente ersetzt werden.

Wenn die Zeichenfläche bereits Elemente enthält, können Sie den Rahmen auch als Gruppe einfügen, wobei diese Option jedoch alle Elemente von der Zeichenfläche löscht.

Wenn die Option „Einstellungen auf Zeichenfläche anwenden“ ausgewählt ist, werden die Einstellungen der obersten Ebene des Rahmens in Zero Block übernommen: Die Hintergrundfarbe oder das Hintergrundbild, das automatische Layout und andere von Tilda unterstützte Einstellungen Tilda geändert.

Wenn mehrere Frames eingefügt werden, wird das Popup-Fenster mit den Importoptionen nicht angezeigt.

Gehen Sie zur Figma-Hauptseite und klicken Sie unter Ihrem Profilbild auf Profil anzeigen → Einstellungen.

Gehen Sie dann auf die Registerkarte Sicherheit, gehen Sie zum Block Persönliche Zugangstoken und klicken Sie auf Neues Token generieren.

Geben Sie im neuen Fenster den Namen des Tilda an und wählen Sie dessen Gültigkeitsdauer aus. Zum Beispiel 1 Tag, 7 Tage, 30 Tage und 90 Tage.

Aktivieren Sie im Bereich „Scopes“ die Kontrollkästchen „Aktueller Benutzer“, „Entwicklerressourcen“, „Dateiinhalte“, „Dateiversionen“, „Bibliotheksressourcen“, „Bibliotheksinhalte“ und „Projekte“. Klicken Sie nun auf „Token generieren“.

Kopiere diesen Schlüssel, nachdem du ihn erstellt hast, um ihn in den Importeinstellungen in Tilda anzugeben. Du kannst den Schlüssel nicht erneut anzeigen; erstelle einfach einen neuen Schlüssel.

Klicken Sie in Zero Block auf das Menü mit den drei Punkten Zero Block wählen Sie die Option „Aus Figma importieren“.

Gehe zu Figma. Öffne das Layout, wähle den gewünschten Frame aus und kopiere den Frame-Link aus der Adressleiste des Browsers.

Fügen Sie in dem sich öffnenden Fenster den Link zum Frame sowie den API-Token hinzu, den Sie in den Figma-Einstellungen erhalten haben.

Warten Sie, bis das Layout importiert ist.

Wenn Sie den korrekten Link hinzugefügt haben und es keine Fehler auf der Figma API Seite gibt, wird das Layout in Zero Block importiert.

Beachte, dass Bilder standardmäßig von den Figma-Servern geladen werden. Wenn du sie also auf Tilda hochladen möchtest, musst du in den Einstellungen der Elemente, die Bilder enthalten, auf „Auf Tilda hochladen“ klicken.

Layouts müssen auf einem Rahmen mit einer Breite von 1200px erstellt werden.

Wir empfehlen, das Layout in mehrere Blöcke zu importieren, anstatt das gesamte Layout nur einem einzigen Block hinzuzufügen.

Jede Gruppe kann als Bild importiert werden. Dazu musst du im Namen „image“ angeben. Wenn du „svg“ angibst, wird sie als SVG-Datei importiert.

Du kannst auch Gruppen importieren. Wenn sich darin weitere Gruppen befinden, werden alle Elemente in die Gruppe der ersten Ebene verschoben.

Um eine Schaltfläche zu importieren, müssen Sie die Form und den Text zu einer Gruppe zusammenfassen und „Schaltfläche“ in den Namen einfügen. Da auch die Eigenschaft zur Textausrichtung importiert wird, empfehlen wir Ihnen, die Breite des Textelements an die der Form anzupassen.

Wenn die Form einen Effekt aufweist, der in Zero Block nicht reproduziert werden kann, wird sie mit dem Effektbild im Hintergrund importiert.