In this post you will learn how to create Staggs Attributes. The attributes contain all the information of the attributes displayed in the configurator, like the titles, description, available options, type and templates. Attribute settings The Staggs attribute consists out of two parts: the Staggs attribute settings and the attribute options / items. The attribute settings allow you to control the main attribute settings. Here you can change the attribute display and image settings.
Attribute items Next up are the attribute items or options. These are the available options for the given attribute. Let’s say we have attribute color. Then the options can be red, green, brown, purple etc. So Color would be the attribute title, and Black the attribute item title.
First thing to note is that we support a few different types of attribute items. There are some fields that are only visible based on the type of attribute you select. 1) Image Images are the most used type of attributes. Image attributes can be seen as the default type of attribute. You can use the image attribute type in almost all the templates, except for “Text field”, “Numeric field” and “Measurement”. Those are for the Input attribute type. 2) Input
Next up, we have input type. Think text inputs, textarea’s, number inputs and range sliders. Inputs only work with the templates “Text field”, “Numeric field” and “Measurement”. Important! When you set type to input, you have to add one attribute item at least to render the actual input field. 3) Color
The color attribute is basically an image attribute. Though one thing is different: instead of setting a value, you can pick a color as the value. This can be useful in combination with the “Color swatches” template. Otherwise you might as well use the Image type. 4) Font family
If you are using text input previews, you can change the styling of the preview text by adding custom fonts. You can pull fonts from Google Fonts or Adobe Typekit, or any other font URL. Just make sure you fill out all the fields. 5) URL
You can also link to other products if you like to. In that case you can use the URL attribute type On attribute selection, you will be redirected to the given URL You can use this to create a linked product variations effect. 6) Linked (WooCommerce) Product (PRO)
Finally, you can link another WooCommerce Simple Product as a Staggs attribute item. The following mapping will be applied: Product gallery => Main images Product title => Attribute label Product price => Attribute price Product SKU => Attribute SKU Product stock => Attribute stock Note: simple products with configurator active are not selectable.