[{"data":1,"prerenderedAt":489},["ShallowReactive",2],{"help-article-\u002Fhelp\u002Finput-fields\u002Foffer-a-selection":3},{"id":4,"title":5,"body":6,"category":471,"description":472,"extension":473,"keywords":474,"meta":479,"navigation":480,"order":481,"path":482,"published":483,"rawbody":484,"seo":485,"stem":486,"updated":487,"__hash__":488},"help\u002Fhelp\u002Finput-fields\u002Foffer-a-selection.md","Offer a selection: let users choose from set texts or images",{"type":7,"value":8,"toc":464},"minimark",[9,22,25,38,43,171,175,181,372,382,392,396,401,434],[10,11,12,13,17,18,21],"p",{},"In the ",[14,15,16],"place",{},"template editor",", a selection input field makes users choose from texts or images you set in the ",[14,19,20],{},"design generator",". They don't type anything themselves and don't upload anything. That way every design stays the way your brand wants it.",[10,23,24],{},"This takes three steps:",[26,27,28,32,35],"ol",{},[29,30,31],"li",{},"Create the input field in the template editor.",[29,33,34],{},"Set the options in the Input Fields view.",[29,36,37],{},"Test the input field in the design generator.",[39,40,42],"h2",{"id":41},"create-the-input-field","Create the input field",[26,44,45,70,111,160],{},[29,46,47,51,52,55,56,60,61,64],{},[48,49,50],"click",{},"Click"," the square with the plus in the ",[14,53,54],{},"toolbar"," at the top. This is the ",[57,58,59],"strong",{},"Create Input Field"," tool.",[62,63],"br",{},[65,66],"img",{"alt":67,"src":68,"width":69},"Toolbar with the Create Input Field tool highlighted.","https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fhelp\u002FKB-create-input-field-01\u002Fpublic",894,[29,71,72,74,75,78,79,82,83],{},[48,73,50],{}," the text or image users should get a selection for. You can click it on the ",[14,76,77],{},"canvas"," or in the ",[14,80,81],{},"layers panel",". A popup opens.",[84,85,87],"trouble",{"symptom":86},"No popup opens?",[10,88,89,90,92,93,95,96,100,101,104,105,107,108,110],{},"If the element sits inside a group or mask, a click on the ",[14,91,77],{}," selects the whole group. Groups have no popup. Locked elements can't be clicked on the ",[14,94,77],{}," either. ",[97,98,99],"press",{},"Press"," ",[57,102,103],{},"Esc"," and start again at step 1. Then ",[48,106,48],{}," the element itself in the ",[14,109,81],{},".",[29,112,113,116,117,137,154,156],{},[48,114,115],{},"Choose"," the field type for the selection on the left of the popup.",[118,119,120,129],"ul",{},[29,121,122,125,126],{},[123,124],"right",{}," For a text: ",[57,127,128],{},"Text Selection",[29,130,131,133,134],{},[123,132],{}," For an image: ",[57,135,136],{},"Image Selection",[84,138,140],{"symptom":139},"The field type you want is missing?",[10,141,142,143,146,147,150,151,110],{},"The popup only offers what no input field controls yet. If the element already has an input field, you'll find it in the ",[14,144,145],{},"Input Fields view",". You open it with ",[57,148,149],{},"Input Fields"," next to ",[57,152,153],{},"Share",[62,155],{},[65,157],{"alt":158,"src":159,"width":69},"Popup for a text element with the Text Selection field type chosen and highlighted, and a preview of the input field on the right.","https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fhelp\u002FKB-offer-a-selection-02\u002Fpublic?v=a83b2ca9",[29,161,162,100,164,167,168,170],{},[48,163,50],{},[57,165,166],{},"Add Field",". The input field is now created and already has a first option: the text or image that was in the element. With ",[57,169,136],{},", a placeholder image is added as a second option.",[39,172,174],{"id":173},"set-the-options","Set the options",[10,176,177,178,180],{},"The ",[14,179,145],{}," shows all input fields of your template, and you configure them there.",[26,182,183,202,216,234,242,279,293,340,347,361],{},[29,184,185,100,187,189,190,192,193,195,196,198],{},[48,186,50],{},[57,188,149],{}," at the top right of the ",[14,191,54],{},". The ",[14,194,145],{}," opens.",[62,197],{},[65,199],{"alt":200,"src":201,"width":69},"Top right of the toolbar with the Input Fields button highlighted.","https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fhelp\u002FKB-create-input-field-02\u002Fpublic",[29,203,204,208,209,212,213,110],{},[205,206,207],"look",{},"Look"," at the bottom of the list for your new input field. It is called ",[57,210,211],{},"Select Text"," or ",[57,214,215],{},"Select Image",[29,217,218,220,221,212,224,110,227,229],{},[48,219,50],{}," the gear on the right of the input field. The settings open. Your options are under ",[57,222,223],{},"Text options",[57,225,226],{},"Image options",[62,228],{},[65,230],{"alt":231,"src":232,"width":233},"Settings of a Text Selection input field: Text options with two options, Add option and Type.","https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fhelp\u002FKB-offer-a-selection-01\u002Fpublic",338,[29,235,236,100,238,241],{},[48,237,50],{},[57,239,240],{},"Add option",". A new option appears. It is a copy of the last option.",[29,243,244,245,276,278],{},"Change the new option:",[118,246,247,259],{},[29,248,249,125,251,255,256,110],{},[123,250],{},[252,253,254],"type",{},"Type"," the text that should appear in the design under ",[57,257,258],{},"Value",[29,260,261,133,263,265,266,269,270,272,273,110],{},[123,262],{},[48,264,50],{}," the option's image. The ",[57,267,268],{},"Image Library"," opens. ",[48,271,115],{}," an image or upload your own with ",[57,274,275],{},"Upload",[62,277],{},"Repeat steps 4 and 5 for every further option.",[29,280,281,283,284,286,287],{},[48,282,50],{}," the trash can in the row of every option you don't need. With ",[57,285,136],{},", that usually includes the placeholder image.",[84,288,290],{"symptom":289},"The trash can can't be clicked?",[10,291,292],{},"One option always has to stay. You can replace the last option, but not delete it.",[29,294,295,297,298,300,301,326,328,329,331,332,334,335,337,338,110],{},[48,296,115],{}," under ",[57,299,254],{}," how users see the selection:",[118,302,303,313],{},[29,304,305,125,307,212,310],{},[123,306],{},[57,308,309],{},"Dropdown",[57,311,312],{},"Buttons",[29,314,315,133,317,319,320,212,323],{},[123,316],{},[57,318,309],{},", ",[57,321,322],{},"Button Grid",[57,324,325],{},"Carousel",[62,327],{},"On a phone, the ",[14,330,20],{}," shows ",[57,333,312],{}," as a dropdown menu and a ",[57,336,322],{}," as a ",[57,339,325],{},[29,341,342,100,344,110],{},[48,343,50],{},[57,345,346],{},"Done",[29,348,349,351,352],{},[48,350,115],{}," the option the design should start with in the input field. It is now the default value.",[84,353,355],{"symptom":354},"The input field shows no selected option?",[10,356,357,358,360],{},"The default value is still the text or image the element had when you created the input field. If you changed or deleted that option, the default value matches no option any more, and the input field shows nothing. ",[48,359,115],{}," an option in the input field. It becomes the new default value.",[29,362,363,100,365,369,370,110],{},[48,364,50],{},[366,367,368],"close",{},"×"," at the top right to close the ",[14,371,145],{},[373,374,375],"tip",{},[10,376,377,378,381],{},"With ",[57,379,380],{},"Custom label"," you give an option a label of its own. Users then see the label instead of the text, for example \"Trade fair version\" instead of a long sentence.",[383,384,385],"warning",{},[10,386,177,387,389,390,110],{},[14,388,145],{}," is not a preview. Whatever you select in an input field here changes your template for good. Test input fields in the ",[14,391,20],{},[39,393,395],{"id":394},"test-the-input-field-in-the-design-generator","Test the input field in the design generator",[10,397,177,398,400],{},[14,399,20],{}," is the page where users fill in your template and export their design. You can test the input field there safely: whatever you select doesn't change your template for good.",[26,402,403,419,429],{},[29,404,405,406,100,408,410,411,414,415,418],{},"When you are done with your input fields, ",[48,407,48],{},[57,409,153],{}," at the top right and then ",[57,412,413],{},"Publish Template Link",". If you have published the template before, the menu item is called ",[57,416,417],{},"Open Template Campaign",". A popup with the share settings opens. Your template can now be reached through a link.",[29,420,421,100,423,426,427,195],{},[48,422,50],{},[57,424,425],{},"Copy URL"," and open the link in a new browser tab. The ",[14,428,20],{},[29,430,431,433],{},[48,432,115],{}," a different option in your input field. Check that the design changes the way you want.",[435,436,437],"related",{},[118,438,439,446,452,458],{},[29,440,441],{},[442,443,445],"a",{"href":444},"\u002Fhelp\u002Finput-fields\u002Fcreate-input-field","Create an input field: let users change a text or image",[29,447,448],{},[442,449,451],{"href":450},"\u002Fhelp\u002Finput-fields\u002Felements-properties-input-fields","How elements, properties and input fields fit together",[29,453,454],{},[442,455,457],{"href":456},"\u002Fhelp\u002Finput-fields\u002Ftext-input-fields","Text input fields",[29,459,460],{},[442,461,463],{"href":462},"\u002Fhelp\u002Finput-fields\u002Fimage-input-fields","Image input fields",{"title":465,"searchDepth":466,"depth":466,"links":467},"",2,[468,469,470],{"id":41,"depth":466,"text":42},{"id":173,"depth":466,"text":174},{"id":394,"depth":466,"text":395},"input-fields","Let users of your design generator choose from texts or images you set, instead of typing or uploading their own.","md",[128,136,475,476,477,240,223,226,322,325,478],"selection","dropdown","options","on-brand",{},true,13,"\u002Fhelp\u002Finput-fields\u002Foffer-a-selection","2026-10-13","---\ntitle: \"Offer a selection: let users choose from set texts or images\"\ndescription: \"Let users of your design generator choose from texts or images you set, instead of typing or uploading their own.\"\ncategory: input-fields\norder: 13\nkeywords: [\"Text Selection\", \"Image Selection\", \"selection\", \"dropdown\", \"options\", \"Add option\", \"Text options\", \"Image options\", \"Button Grid\", \"Carousel\", \"on-brand\"]\n---\n\nIn the :place[template editor], a selection input field makes users choose from texts or images you set in the :place[design generator]. They don't type anything themselves and don't upload anything. That way every design stays the way your brand wants it.\n\nThis takes three steps:\n\n1. Create the input field in the template editor.\n2. Set the options in the Input Fields view.\n3. Test the input field in the design generator.\n\n\n## Create the input field\n\n1. :click[Click] the square with the plus in the :place[toolbar] at the top. This is the **Create Input Field** tool.\n\n   ![Toolbar with the Create Input Field tool highlighted.](https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fhelp\u002FKB-create-input-field-01\u002Fpublic){width=\"894\"}\n\n2. :click[Click] the text or image users should get a selection for. You can click it on the :place[canvas] or in the :place[layers panel]. A popup opens.\n\n   ::trouble{symptom=\"No popup opens?\"}\n   If the element sits inside a group or mask, a click on the :place[canvas] selects the whole group. Groups have no popup. Locked elements can't be clicked on the :place[canvas] either. :press[Press] **Esc** and start again at step 1. Then :click[click] the element itself in the :place[layers panel].\n   ::\n\n3. :click[Choose] the field type for the selection on the left of the popup.\n\n   - :right For a text: **Text Selection**\n   - :right For an image: **Image Selection**\n\n   ::trouble{symptom=\"The field type you want is missing?\"}\n   The popup only offers what no input field controls yet. If the element already has an input field, you'll find it in the :place[Input Fields view]. You open it with **Input Fields** next to **Share**.\n   ::\n\n   ![Popup for a text element with the Text Selection field type chosen and highlighted, and a preview of the input field on the right.](https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fhelp\u002FKB-offer-a-selection-02\u002Fpublic?v=a83b2ca9){width=\"894\"}\n\n4. :click[Click] **Add Field**. The input field is now created and already has a first option: the text or image that was in the element. With **Image Selection**, a placeholder image is added as a second option.\n\n## Set the options\n\nThe :place[Input Fields view] shows all input fields of your template, and you configure them there.\n\n1. :click[Click] **Input Fields** at the top right of the :place[toolbar]. The :place[Input Fields view] opens.\n\n   ![Top right of the toolbar with the Input Fields button highlighted.](https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fhelp\u002FKB-create-input-field-02\u002Fpublic){width=\"894\"}\n\n2. :look[Look] at the bottom of the list for your new input field. It is called **Select Text** or **Select Image**.\n3. :click[Click] the gear on the right of the input field. The settings open. Your options are under **Text options** or **Image options**.\n\n   ![Settings of a Text Selection input field: Text options with two options, Add option and Type.](https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002Fhelp\u002FKB-offer-a-selection-01\u002Fpublic){width=\"338\"}\n\n4. :click[Click] **Add option**. A new option appears. It is a copy of the last option.\n5. Change the new option:\n\n   - :right For a text: :type[Type] the text that should appear in the design under **Value**.\n   - :right For an image: :click[Click] the option's image. The **Image Library** opens. :click[Choose] an image or upload your own with **Upload**.\n\n   Repeat steps 4 and 5 for every further option.\n\n6. :click[Click] the trash can in the row of every option you don't need. With **Image Selection**, that usually includes the placeholder image.\n\n   ::trouble{symptom=\"The trash can can't be clicked?\"}\n   One option always has to stay. You can replace the last option, but not delete it.\n   ::\n\n7. :click[Choose] under **Type** how users see the selection:\n\n   - :right For a text: **Dropdown** or **Buttons**\n   - :right For an image: **Dropdown**, **Button Grid** or **Carousel**\n\n   On a phone, the :place[design generator] shows **Buttons** as a dropdown menu and a **Button Grid** as a **Carousel**.\n\n8. :click[Click] **Done**.\n9. :click[Choose] the option the design should start with in the input field. It is now the default value.\n\n   ::trouble{symptom=\"The input field shows no selected option?\"}\n   The default value is still the text or image the element had when you created the input field. If you changed or deleted that option, the default value matches no option any more, and the input field shows nothing. :click[Choose] an option in the input field. It becomes the new default value.\n   ::\n\n10. :click[Click] :close[×] at the top right to close the :place[Input Fields view].\n\n::tip\nWith **Custom label** you give an option a label of its own. Users then see the label instead of the text, for example \"Trade fair version\" instead of a long sentence.\n::\n\n::warning\nThe :place[Input Fields view] is not a preview. Whatever you select in an input field here changes your template for good. Test input fields in the :place[design generator].\n::\n\n## Test the input field in the design generator\n\nThe :place[design generator] is the page where users fill in your template and export their design. You can test the input field there safely: whatever you select doesn't change your template for good.\n\n1. When you are done with your input fields, :click[click] **Share** at the top right and then **Publish Template Link**. If you have published the template before, the menu item is called **Open Template Campaign**. A popup with the share settings opens. Your template can now be reached through a link.\n2. :click[Click] **Copy URL** and open the link in a new browser tab. The :place[design generator] opens.\n3. :click[Choose] a different option in your input field. Check that the design changes the way you want.\n\n::related\n- [Create an input field: let users change a text or image](\u002Fhelp\u002Finput-fields\u002Fcreate-input-field)\n- [How elements, properties and input fields fit together](\u002Fhelp\u002Finput-fields\u002Felements-properties-input-fields)\n- [Text input fields](\u002Fhelp\u002Finput-fields\u002Ftext-input-fields)\n- [Image input fields](\u002Fhelp\u002Finput-fields\u002Fimage-input-fields)\n::\n",{"title":5,"description":472},"help\u002Finput-fields\u002Foffer-a-selection","2026-10-22","r0csgaLrMULok-6Vkl_pA915V8PlIINHnfhGGmwY0Yk",1792680560633]