Jak zaimportować projekt Figma do witryny internetowej

Przejdź do strony głównej Figma i kliknij Wyświetl profil → Ustawienia pod swoim zdjęciem profilowym.

Następnie przejdź do zakładki Bezpieczeństwo, przejdź do bloku Osobiste tokeny dostępu i kliknij Wygeneruj nowy token.

W nowym oknie określ nazwę tokena Tilda i wybierz jego okres ważności. Na przykład No expiration - Indefinite. Można również wybrać okres wygaśnięcia tokenu wynoszący 1 dzień, 7 dni, 30 dni i 90 dni.

W obszarze Zakresy należy teraz wybrać prawa dostępu dla klucza.

W przypadku opcji Bieżący użytkownik, Zasoby deweloperskie, Zawartość pliku, Wersje pliku, Zasoby biblioteki, Zawartość biblioteki i Projekty wybierz wartość Dostęp tylko do odczytu. Następnie kliknij Wygeneruj token, aby utworzyć token.

Skopiuj ten klucz po jego utworzeniu, aby określić go w ustawieniach Importuj do Tilda . Nie można ponownie wyświetlić klucza, wystarczy utworzyć nowy klucz.

Kliknij menu z trzema kropkami w prawym górnym rogu strony Zero Block i wybierz opcję "Importuj z Figma" z menu rozwijanego.

W aplikacji Figma wybierz żądany układ w panelu Warstwy, ramkę, której potrzebujesz i skopiuj link do ramki z paska adresu przeglądarki.

Aby import był poprawny, musisz dodać jedną ramkę Figma do jednej Zero Block

Wklej ten link do pola Layout URL i dodaj token API uzyskany w ustawieniach Figma do pola API Token.

Poczekaj, aż układ zostanie zaimportowany.

Jeśli dodano prawidłowe łącze i nie ma błędów po stronie API Figma, układ zostanie zaimportowany do Zero Block.

Uwaga: Domyślnie obrazy są ładowane z serwerów Figma. Jeśli więc chcesz przesłać je na stronę Tilda, musisz przejść do ustawień elementów zawierających obrazy i kliknąć przycisk Prześlij na stronę Tilda.

Układy muszą być tworzone w ramce o szerokości 1200 pikseli.

Zalecamy importowanie układu do kilku bloków zamiast dodawania całego układu tylko do jednego.

Każda grupa może zostać zaimportowana jako obraz. W tym celu należy określić "image" w nazwie grupy w Figma. Jeśli podasz "svg", zostanie ona zaimportowana jako plik SVG.

Można również importować grupy. Jeśli wewnątrz znajdują się inne grupy, wszystkie elementy znajdą się w grupie pierwszego poziomu.

Aby zaimportować przycisk, należy połączyć kształt i tekst w grupę i nazwać ją "przycisk".

Zaimportowana zostanie również właściwość wyrównania tekstu, dlatego zalecamy, aby szerokość elementu tekstowego była taka sama jak kształtu.

Jeśli kształt ma efekt, którego nie można odtworzyć na stronie Zero Block, zostanie on zaimportowany z obrazem efektu w tle.