Introduction
Generator is a Figma plugin that helps you quickly generate multiple designs with changing data, such as certificates with different names or business cards with different contact information.
Definitions
- CSV headers: The top row of a CSV file, which contains the names of the data fields.
- Variables: Text layers or certain text within a text layer that are linked to CSV headers.
Conventions
- Global variables: Use the '#' symbol to indicate a global variable. For example, to use the 'Email' header as a global variable, name a layer '#Email'.
- (Syntax: #VariableName)
- Inline variables: Use curly braces ('{}') to indicate an inline variable. For example, to use the 'Email' header as an inline variable, include '#{Email}' within the text of a text layer.
- (Syntax: #{VariableName})
How to Use
- 1. Select a design frame and a text layer containing the CSV data you want to use. You can also use the file upload option to upload a local CSV file. Click next once you’re done.
- Select the variables you want to include in your design from the available selection chips.
- (Optional) Enable inline variables to replace specific parts of a text layer rather than the whole. Avoid enabling it when unnecessary as it is a time-heavy operation.
- Click 'Generate' to create the new frames with the specified text.
Tips
- Make sure to rename your layers or layer content according to the conventions mentioned above to use variables from the CSV data.
- If you have any further questions or need assistance, join our discord here:
