Não importa se você usa um XLSX, um CSV ou o Google Sheets como planilha: a estrutura é sempre a mesma. A primeira linha (o “cabeçalho”) da planilha é usada como a primeira linha de cabeçalho da tabela (a linha “componente”), e todas as linhas abaixo dela se tornam instâncias desse primeiro cabeçalho.
Para pré-visualizar o conteúdo da sua planilha, cole a URL pública do Google Sheets no campo Your Public Google Sheet URL. Se for uma URL válida, pública e estruturada corretamente, a pré-visualização dos cabeçalhos que ela contém será carregada automaticamente depois que você colar.
Quando a pré-visualização carregar, clique no botão Generate Table from Rows. Isso importa o conteúdo da sua planilha para uma tabela na página atual do Figma.
Exemplo de estrutura de planilha para importar tabelas
Não importa se você usa um XLSX, um CSV ou o Google Sheets como planilha: a estrutura é sempre a mesma. A primeira linha (o “cabeçalho”) da planilha precisa conter os nomes das camadas do Figma que você quer sincronizar com as demais linhas abaixo dela.
Você pode dar a elas o nome que quiser, mas o mais fácil é usar um formato de hashtag curto e descritivo, como #Title ou #Description. No Figma, dê também às suas camadas de texto os nomes #Title ou #Description. Assim, elas serão mapeadas entre si quando a planilha for sincronizada no plugin mais tarde.
| #Title | #Genre | #Age Rating | #Total Reviews |
|---|---|---|---|
| No Time To Die | Ação | 13 | 123 avaliações |
| Dune | Ação e ficção científica | 14 | 124 avaliações |
| Black Widow | Ação | 18 | 125 avaliações |
| Suicide Squad | Ação | 18 | 125 avaliações |
Formatação Markdown compatível para o texto das tabelas
Se quiser, você pode adicionar ao conteúdo da planilha uma formatação Markdown básica (negrito, itálico) e links, que serão aplicados automaticamente quando o trecho for sincronizado com sua camada de texto do Figma.
Sua camada de texto do Figma pode começar como texto comum; não é preciso formatar antes um exemplo em negrito ou itálico. Use uma família de fontes que tenha disponíveis no Figma as variantes negrito, itálico ou negrito itálico correspondentes. A pré-visualização da planilha usa as fontes do navegador, então a aparência dela, por si só, não confirma que sua fonte do Figma tem essas variantes.
- Para deixar um texto em negrito, use dois asteriscos
**Snippet text to bold**ou dois sublinhados__Snippet text to bold__ - Para deixar um texto em itálico, use um asterisco
*Italic Snippet Text*ou um sublinhado_Italic Snippet Text_ - Para deixar um texto em negrito itálico, use três asteriscos
***Bold Italic Snippet Text***ou três sublinhados___Bold Italic Snippet Text___ - Para criar hiperlinks, use a sintaxe Markdown
This is [my link here](https://example.com) in a text snippet(você também pode formatar o texto do link adicionando a sintaxe de negrito/itálico dentro da área de texto[]do link).