Jak zaimportować projekt Figma do witryny internetowej

Można automatycznie zaimportować projekt Figma do Zero Block
Jak uzyskać token dostępu do interfejsu API Figma
Перейдите на главную Figma и нажмите под фотографией своего профиля Wyświetl profil → Ustawienia.
Далее перейдите на вкладку Security, перейдите к блоку Personal access tokens и нажмите на Generate new token.
В новом окне впишите название токена Tilda и выберите срок его действия. Например, Bez wygaśnięcia - Бессрочный. Также можно выбрать срок действия ключа на 1 день, 7 дней, 30 дней и 90 дней.

В области применения (Zakresy) теперь необходимо выбрать права доступа для ключа.
Для пунктов Bieżący użytkownik, Zasoby deweloperskie, Zawartość pliku, Wersje pliku, Zasoby biblioteki, Zawartość biblioteki и Projekty установите значение для доступа Tylko do odczytu. А затем нажмите на Generate token - создать токен.
Скопируйте этот ключ после создания, чтобы указать в настройках Import на Tilda. Посмотреть ключ повторно нельзя, только создать новый.
Jak zaimportować układ do Zero Block
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 wprowadziłeś poprawny link i nie ma żadnych błędów po stronie Figma API, 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.
Wymagania dotyczące układu i funkcje importu
Układ
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.
Grupy
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.
Kształty i przyciski
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.
Wykonane na
Tilda