[{"data":1,"prerenderedAt":697},["ShallowReactive",2],{"header:help":3,"footer:default":67,"story:navigation\u002Fsearch:help":250,"story:help\u002Fcategories":288,"story:help\u002Farticles\u002Fadd-a-dropdown-with-an-other-text-option":314,"no-guide:add-a-dropdown-with-an-other-text-option":59,"article:\u002Fhelp\u002Farticles\u002Fadd-a-dropdown-with-an-other-text-option":438,"story:contact":452,"help:tree:9e6248ef-9dd6-4ccd-a4ed-4a2b04802da9":642,"_apollo:default":696},{"name":4,"created_at":5,"published_at":6,"updated_at":7,"id":8,"uuid":9,"content":10,"slug":57,"full_slug":58,"sort_by_date":59,"position":60,"tag_list":61,"is_startpage":24,"parent_id":62,"meta_data":59,"group_id":63,"first_published_at":64,"release_id":59,"lang":65,"path":59,"alternates":66,"default_full_slug":59,"translated_slugs":59},"Help Center Header","2024-08-09T18:06:34.939Z","2024-10-21T21:58:39.217Z","2024-10-21T21:58:39.232Z",10082752,"3e9b88f7-c163-4657-a2f2-62532d600fad",{"_uid":11,"link":12,"badge":16,"items":17,"title":13,"buttons":50,"new_tab":24,"submenu":51,"alignment":13,"component":52,"badge_link":53,"top_menu_items":56},"e5645a1a-f991-40e8-8d67-e40ebc082b5a",{"id":13,"url":13,"linktype":14,"fieldtype":15,"cached_url":13},"","story","multilink","Help Center",[18,27,34,39,44],{"_uid":19,"link":20,"title":23,"new_tab":24,"submenu":25,"component":26},"5cbe2861-1f49-4166-97da-a4dddd8105e3",{"id":21,"url":13,"linktype":14,"fieldtype":15,"cached_url":22},"4c0a2d99-ec30-4579-8ef1-6bf5564d4839","help\u002Fcategories\u002F","Articles",false,[],"header___item",{"_uid":28,"link":29,"title":32,"new_tab":33,"component":26},"1c8edeb5-b9e9-4cb8-b1c6-c1f292f7d7cd",{"id":13,"url":30,"linktype":31,"fieldtype":15,"cached_url":30},"https:\u002F\u002Fwiki.foxycart.com\u002F","url","Documentation",true,{"_uid":35,"link":36,"title":38,"new_tab":33,"component":26},"8d7df70e-f087-4da0-b616-6f0e9a5af35c",{"id":13,"url":37,"linktype":31,"fieldtype":15,"cached_url":37},"https:\u002F\u002Fapi.foxycart.com\u002F","API Documentation",{"_uid":40,"link":41,"title":43,"new_tab":33,"component":26},"f76e7944-23d5-4652-87e4-cdae79272762",{"id":13,"url":42,"linktype":31,"fieldtype":15,"cached_url":42},"https:\u002F\u002Fstatus.foxy.io\u002F","System Status",{"_uid":45,"link":46,"title":49,"new_tab":24,"component":26},"0de16771-4c84-466c-a1da-d8568113c71f",{"id":47,"url":13,"linktype":14,"fieldtype":15,"cached_url":48},"01e4e370-f9b9-45af-8fa9-f15540699b0d","contact","Contact Us",[],[],"header",{"id":54,"url":13,"linktype":14,"fieldtype":15,"cached_url":55},"4a679eb7-662d-4ea4-a976-5a2acbf0b663","help\u002F",[],"help-header","navigation\u002Fhelp-header",null,20,[],10082747,"71b81c2e-5e09-48a1-a397-a3c72fcd344a","2022-09-21T14:50:25.655Z","default",[],{"name":68,"created_at":69,"published_at":70,"updated_at":71,"id":72,"uuid":73,"content":74,"slug":243,"full_slug":244,"sort_by_date":59,"position":245,"tag_list":246,"is_startpage":24,"parent_id":62,"meta_data":59,"group_id":247,"first_published_at":248,"release_id":59,"lang":65,"path":59,"alternates":249,"default_full_slug":59,"translated_slugs":59},"Default Footer","2024-08-09T18:06:59.024Z","2025-09-04T06:24:46.223Z","2025-09-04T06:24:46.241Z",10082753,"e59e67ac-248a-482f-84a1-53d4f318186a",{"_uid":75,"about":76,"logos":77,"socials":82,"sections":108,"component":225,"cta_title":226,"bottom_links":227,"cta_subtitle":241,"cta_button_link":242,"cta_button_text":183},"830983f5-c4c4-43c8-b150-86a5e3fa6dc8","Foxy’s hosted cart & payment page allow you to sell anything, using your existing website or platform.",[78],{"id":79,"alt":13,"name":13,"focus":13,"title":13,"filename":80,"copyright":13,"fieldtype":81},14760,"https:\u002F\u002Fa-us.storyblok.com\u002Ff\u002F1001040\u002Fx\u002F3b030847ec\u002Fb-corp.svg","asset",[83,90,96,102],{"_uid":84,"icon":85,"link":86,"name":88,"component":89},"faf0a618-ea94-42ea-9182-03be18c43216","fa-facebook",{"id":13,"url":87,"linktype":31,"fieldtype":15,"cached_url":87},"https:\u002F\u002Fwww.facebook.com\u002Ffoxycart","Facebook","footer___social",{"_uid":91,"icon":92,"link":93,"name":95,"component":89},"14309c18-7e79-423e-b375-34555bac0811","fa-instagram",{"id":13,"url":94,"linktype":31,"fieldtype":15,"cached_url":94},"https:\u002F\u002Fwww.instagram.com\u002Ffoxy_io","Instagram",{"_uid":97,"icon":98,"link":99,"name":101,"component":89},"8f7fe7cf-0dd3-4596-8334-226ea466716a","fa-linkedin",{"id":13,"url":100,"linktype":31,"fieldtype":15,"cached_url":100},"https:\u002F\u002Fwww.linkedin.com\u002Fcompany\u002Ffoxycart.com","LinkedIn",{"_uid":103,"icon":104,"link":105,"name":107,"component":89},"90a675b4-dd97-40b5-be09-00a87223d4c5","fa-youtube",{"id":13,"url":106,"linktype":31,"fieldtype":15,"cached_url":106},"https:\u002F\u002Fwww.youtube.com\u002Fuser\u002Ffoxycart","Youtube",[109,139,184,206],{"_uid":110,"name":111,"items":112,"component":138},"82849945-282f-488c-b18d-a8d2252f514a","Company",[113,120,126,132],{"_uid":114,"link":115,"title":118,"new_tab":24,"component":119},"1f699ab1-938b-4d9d-9825-aabcbe6f57fe",{"id":116,"url":13,"linktype":14,"fieldtype":15,"cached_url":117},"63634293-a749-4226-9439-9f38ee6dcda0","about-us","About Us","footer___menu_items",{"_uid":121,"link":122,"title":125,"new_tab":24,"component":119},"b26b00f1-a0e7-4be2-8ab3-428b8cc841f8",{"id":123,"url":13,"linktype":14,"fieldtype":15,"cached_url":124},"26cb7c55-faed-4a77-a291-1552d4111b3e","how-foxy-works","How Foxy Works",{"_uid":127,"link":128,"title":131,"new_tab":24,"component":119},"b40c68a0-1ceb-4226-9515-6176534f61fe",{"id":129,"url":13,"linktype":14,"fieldtype":15,"cached_url":130},"dc6657d7-7f4f-4c0d-b781-e971b038ee26","for-good","Foxy For Good",{"_uid":133,"link":134,"title":137,"new_tab":24,"component":119},"3ad0c134-bef9-4fff-b891-e09f16109036",{"id":135,"url":13,"linktype":14,"fieldtype":15,"cached_url":136},"23cae210-baf4-4588-9862-d09f4f52ccd2","brand-assets","Brand Assets","footer___section",{"_uid":140,"name":141,"items":142,"component":138},"a6805fa8-ac60-47f1-b8f0-f27aded0afbe","Product",[143,149,155,161,167,173,179],{"_uid":144,"link":145,"title":148,"new_tab":24,"component":119},"b39c8a4e-2383-486f-b76a-11fbb15d8134",{"id":146,"url":13,"linktype":14,"fieldtype":15,"cached_url":147},"bb04690f-fe98-4ce6-80be-05b950f2364f","features\u002F","Features",{"_uid":150,"link":151,"title":154,"new_tab":24,"component":119},"64f8a41f-c181-433d-bc0a-fc94e71ecbf6",{"id":152,"url":13,"linktype":14,"fieldtype":15,"cached_url":153},"c450c58d-761d-48c0-a9af-0b064611689b","pricing","Pricing",{"_uid":156,"link":157,"title":160,"new_tab":24,"component":119},"6e0b287f-fd8c-4146-9e0e-0ab0b5c9ce3c",{"id":158,"url":13,"linktype":14,"fieldtype":15,"cached_url":159},"fab20ad9-e76a-4947-b709-3a6fdfa88028","blog\u002Fcategories\u002Fproduct-updates","Product Updates",{"_uid":162,"link":163,"title":166,"new_tab":24,"component":119},"47e5a074-a6b5-4f1c-8c2f-89a2ae9f83eb",{"id":164,"url":13,"linktype":14,"fieldtype":15,"cached_url":165},"d2c83612-d611-47f3-a3b4-ca7fe08540b8","changelogs\u002F","Changelogs",{"_uid":168,"link":169,"title":172,"new_tab":24,"component":119},"b5c08774-542f-4ffd-b357-c94d674488b9",{"id":170,"url":13,"linktype":14,"fieldtype":15,"cached_url":171},"08876121-0df3-4ed9-aa11-902b3e41cd02","whats-next","What's Next",{"_uid":174,"link":175,"title":178,"new_tab":24,"component":119},"9c2704ed-6d9f-43e1-9e67-c8d91c083288",{"id":176,"url":13,"linktype":14,"fieldtype":15,"cached_url":177},"056a7857-b18f-4025-8f97-91a38fc19bc8","compare\u002F","Compare",{"_uid":180,"link":181,"title":183,"new_tab":24,"component":119},"5f2db35b-674b-406a-8fa7-d246633af9fe",{"id":13,"url":182,"linktype":31,"fieldtype":15,"cached_url":182},"https:\u002F\u002Fadmin.foxy.io\u002Fsign-up","Try Foxy Free",{"_uid":185,"name":186,"items":187,"component":138},"63fa1f29-4252-4640-9922-fe310e69e54a","Security",[188,194,200],{"_uid":189,"link":190,"title":193,"new_tab":24,"component":119},"1158ddb6-9eb0-466f-8eb6-7ca2ae66c8b8",{"id":191,"url":13,"linktype":14,"fieldtype":15,"cached_url":192},"1f58fb2c-8681-4742-b6e8-09999beae9f6","security-contact","Security Contact",{"_uid":195,"link":196,"title":199,"new_tab":24,"component":119},"9a79c54a-6022-4dfd-854b-766f5e4703ba",{"id":197,"url":13,"linktype":14,"fieldtype":15,"cached_url":198},"55cbfcc3-425a-4261-8037-54e919851d2d","pci","PCI Compliance",{"_uid":201,"link":202,"title":205,"new_tab":24,"component":119},"0b85f5b6-9534-4071-b323-b39d053dd4d7",{"id":203,"url":13,"linktype":14,"fieldtype":15,"cached_url":204},"c3ac0fe3-83e2-4879-afbd-d4c83e1590df","help\u002Farticles\u002Four-official-domains-public-code","Domains & Codebases",{"_uid":207,"name":208,"items":209,"component":138},"998ded67-d107-49f4-8154-ca6be51671ec","Support",[210,213,216,219,222],{"_uid":211,"link":212,"title":16,"new_tab":24,"component":119},"594ffd35-3049-4004-bb08-0db568ebd819",{"id":54,"url":13,"linktype":14,"fieldtype":15,"cached_url":55},{"_uid":214,"link":215,"title":32,"new_tab":33,"component":119},"0a1a55ab-a985-4f9d-8b42-26da714d0c1c",{"id":13,"url":30,"linktype":31,"fieldtype":15,"cached_url":30},{"_uid":217,"link":218,"title":38,"new_tab":33,"component":119},"61e0b7c8-aadf-419b-a339-b3ccabc65bf4",{"id":13,"url":37,"linktype":31,"fieldtype":15,"cached_url":37},{"_uid":220,"link":221,"title":43,"new_tab":33,"component":119},"fd67a89e-1c54-4d31-94b5-64be999062d6",{"id":13,"url":42,"linktype":31,"fieldtype":15,"cached_url":42},{"_uid":223,"link":224,"title":49,"new_tab":24,"component":119},"231a6f71-e996-4ad4-b033-d4d5542f34f0",{"id":47,"url":13,"linktype":14,"fieldtype":15,"cached_url":48},"footer","Get started with our *unlimited free trial*.",[228,235],{"_uid":229,"link":230,"text":233,"component":234},"f0b77210-2632-45a2-8436-e57cad84d01a",{"id":231,"url":13,"linktype":14,"fieldtype":15,"cached_url":232},"60ba16a2-c1f4-485f-b978-8d2eeeafbf5a","terms-of-service","Terms of Service","footer___bottom_links",{"_uid":236,"link":237,"text":240,"component":234},"4bd497b0-993f-4b4d-a5b7-8a49c7c8fec9",{"id":238,"url":13,"linktype":14,"fieldtype":15,"cached_url":239},"332302b9-1d18-4016-b9c8-9b33c72d782b","privacy-policy","Privacy Policy","No credit card required.",{"id":13,"url":182,"linktype":31,"fieldtype":15,"cached_url":182},"default-footer","navigation\u002Fdefault-footer",50,[],"11006268-07f9-41e9-96f3-c51fb723399d","2022-09-21T20:39:02.357Z",[],{"name":251,"created_at":252,"published_at":253,"updated_at":254,"id":255,"uuid":256,"content":257,"slug":279,"full_slug":282,"sort_by_date":59,"position":283,"tag_list":284,"is_startpage":24,"parent_id":62,"meta_data":59,"group_id":285,"first_published_at":286,"release_id":59,"lang":65,"path":59,"alternates":287,"default_full_slug":59,"translated_slugs":59},"Search","2024-10-21T22:08:54.973Z","2025-05-26T09:17:25.790Z","2025-05-26T09:17:25.804Z",13592003,"14cbc359-9ac1-4a7a-a8de-ad4ac8ef26d4",{"_uid":258,"name":251,"indices":259,"summary":13,"component":279,"primary_image":280},"5e4a56e8-76f1-4790-b3a7-70f1be97d042",[260,265,269,274],{"key":261,"_uid":262,"icon":13,"name":263,"component":264},"all","c12a3210-7323-4273-8217-5215e52efe84","All","index",{"key":266,"_uid":267,"icon":268,"name":23,"component":264},"help_center_article","5acff080-95e4-44d3-8dcf-1b19720af382","fa-file-alt",{"key":270,"_uid":271,"icon":272,"name":273,"component":264},"help_center_guide","b8fbc206-c083-471e-a1f0-0ebeb90a669d","fa-book","Guides",{"key":275,"_uid":276,"icon":277,"name":278,"component":264},"blog_post","23419e83-2e56-4c4c-8a05-9fd1b3c9a9bd","fa-file-image","Blog Posts","search",{"id":59,"alt":59,"name":13,"focus":59,"title":59,"source":59,"filename":13,"copyright":59,"fieldtype":81,"meta_data":281},{},"navigation\u002Fsearch",60,[],"11e1fd31-95cd-4fc9-b736-8b8910663e6c","2024-10-21T23:17:05.904Z",[],{"name":23,"created_at":289,"published_at":290,"updated_at":291,"id":292,"uuid":21,"content":293,"slug":307,"full_slug":22,"sort_by_date":59,"position":308,"tag_list":309,"is_startpage":33,"parent_id":310,"meta_data":59,"group_id":311,"first_published_at":312,"release_id":59,"lang":65,"path":59,"alternates":313,"default_full_slug":59,"translated_slugs":59},"2022-09-19T14:42:29.685Z","2024-07-30T18:17:22.506Z","2024-07-30T18:17:22.525Z",2660,{"_uid":294,"icon":13,"name":23,"guides":295,"pinned":24,"summary":296,"category":13,"component":297,"blog_posts":298,"content_hub":24,"icon_custom":299,"case_studies":300,"faq_sections":301,"help_articles":302,"featured_guides":303,"mailbox_category":13,"featured_articles":304,"featured_blog_posts":305,"featured_case_studies":306},"d6dae89a-907a-4bf7-82de-fe2ba875ee6e",[],"Get your questions answered with our browsable knowledge base.","help_center_category",[],{"id":59,"alt":59,"name":13,"focus":59,"title":59,"filename":13,"copyright":59,"fieldtype":81},[],[],[],[],[],[],[],"categories",530,[],2658,"19ebcdd2-027f-47f5-9a5b-a8992c959578","2022-09-19T16:24:39.219Z",[],{"name":315,"created_at":316,"published_at":317,"updated_at":318,"id":319,"uuid":320,"content":321,"slug":431,"full_slug":432,"sort_by_date":59,"position":433,"tag_list":434,"is_startpage":24,"parent_id":435,"meta_data":59,"group_id":436,"first_published_at":317,"release_id":59,"lang":65,"path":59,"alternates":437,"default_full_slug":59,"translated_slugs":59},"Add a dropdown with an \"other\" text option","2026-07-21T15:38:00.328Z","2026-07-22T17:45:01.523Z","2026-07-22T17:45:01.540Z",200534754673245,"9e6248ef-9dd6-4ccd-a4ed-4a2b04802da9",{"_uid":322,"body":323,"name":315,"image":426,"pinned":24,"summary":428,"category":429,"component":266,"related_articles":430},"0f282fbb-ab59-414b-8e0c-6abacd6895cd",{"type":324,"content":325},"doc",[326,333,340,345,351,356,361,366,371,383,415],{"type":327,"attrs":328,"content":329},"paragraph",{"textAlign":59},[330],{"text":331,"type":332},"The following snippet will display a dropdown list in the checkout, and will display an extra text box for “Other” input if “Other” is selected.","text",{"type":334,"attrs":335,"content":337},"heading",{"level":336,"textAlign":59},3,[338],{"text":339,"type":332},"Add javascript",{"type":327,"attrs":341,"content":342},{"textAlign":59},[343],{"text":344,"type":332},"On the Templates configuration page of your store's Foxy administration, under \"Cart\" look for \"Add custom header or footer code to your website\", check the box if not checked, and add this code into the \"Footer\" text area.",{"type":346,"attrs":347,"content":348},"code_block",{"class":59},[349],{"text":350,"type":332},"{% if context == \"checkout\" %}\n\u003Cscript>\n$(\"body\").on(\"change\", \"#referral_source\", function() {\n    setTimeout(FC.checkout.renderAdditionalFields, 500);\n});\n\u003C\u002Fscript>\n{% endif %}",{"type":334,"attrs":352,"content":353},{"level":336,"textAlign":59},[354],{"text":355,"type":332},"Add HTML",{"type":327,"attrs":357,"content":358},{"textAlign":59},[359],{"text":360,"type":332},"Next, and still on the configuration page, under \"Checkout\" look for \"Add custom form fields to your checkout\", enable it, and paste the following into the text box within:",{"type":346,"attrs":362,"content":363},{"class":59},[364],{"text":365,"type":332},"\u003Cdiv class=\"fc-form-group \">\n    \u003Cdiv class=\"col-md-8 col-md-offset-3\" data-fc-error-for=\"referral_source\" data-fc-error-class=\"fc-alert-container--error\">\n        \u003Cdiv class=\"fc-input-group-container fc-input-group-container--checkbox fc-input-group-container--active\">\n            \u003Clabel class=\"fc-input-group-container__title fc-input-group-container__title--forced fc-form-label\">\n                How did you find Us?… (required)\n            \u003C\u002Flabel>\n            \u003Cdiv class=\"fc-form-group\">\n                \u003Cp>Referred by?\u003C\u002Fp>\n                    \u003Cselect name=\"referral_source\" id=\"referral_source\" class=\"fc-form-control\" aria-required=\"true\" data-fc-required >\n                    \u003Coption value=\"Google\" {% if referral_source == \"Google\" %}selected{% endif %}>Google\u003C\u002Foption>\n                    \u003Coption value=\"Yahoo\" {% if referral_source == \"Yahoo\" %}selected{% endif %}>Yahoo\u003C\u002Foption>\n                    \u003Coption value=\"Bing\" {% if referral_source == \"Bing\" %}selected{% endif %}>Bing\u003C\u002Foption>\n                    \u003Coption value=\"Facebook\" {% if referral_source == \"Facebook\" %}selected{% endif %}>Facebook\u003C\u002Foption>\n                    \u003Coption value=\"Instagram\" {% if referral_source == \" Instagram \" %}selected{% endif %}> Instagram \u003C\u002Foption>\n                    \u003Coption value=\"Twitter\" {% if referral_source == \" Twitter\" %}selected{% endif %}> Twitter\u003C\u002Foption>\n                    \u003Coption value=\"Friend\" {% if referral_source == \"Friend\" %}selected{% endif %}>Friend\u003C\u002Foption>\n                    \u003Coption value=\"Amazon\" {% if referral_source == \"Amazon\" %}selected{% endif %}>Amazon\u003C\u002Foption>\n                    \u003Coption value=\"Email\" {% if referral_source == \"Email\" %}selected{% endif %}>Email\u003C\u002Foption>\n                    \u003Coption value=\"Returning Customer\" {% if referral_source == \"Returning Customer\" %}selected{% endif %}>Returning Customer\u003C\u002Foption>\n                    \u003Coption value=\"Other\" {% if referral_source == \"Other\" %}selected{% endif %}>Other\u003C\u002Foption>\n                    \u003C\u002Fselect>\n            \u003C\u002Fdiv>\n            {% if referral_source == \"Other\" %}\n                \u003Cdiv class=\"fc-form-group\">\n                    \u003Cinput type=\"text\"\n                    id=\"other_text\"\n                    name=\"other_text\"\n                    placeholder=\"Please enter 'Other'\"\n                    class=\"fc-form-control fc-form-control--new-customer-password\"\n                    data-fc-required\n                    value=\"\"\n                    \u002F>\n                \u003C\u002Fdiv>\n            {% endif %}\n        \u003C\u002Fdiv>\n    \u003C\u002Fdiv>\n\u003C\u002Fdiv>",{"type":334,"attrs":367,"content":368},{"level":336,"textAlign":59},[369],{"text":370,"type":332},"Customize",{"type":327,"attrs":372,"content":373},{"textAlign":59},[374,376,381],{"text":375,"type":332},"You can customize some information to fit your needs. You can change ",{"text":377,"type":332,"marks":378},"referral_source",[379],{"type":380},"code",{"text":382,"type":332}," wherever you see it to something more appropriate for your needs. Make sure you change it everywhere, including on the Javascript above.",{"type":327,"attrs":384,"content":385},{"textAlign":59},[386,388,392,394,398,400,404,406,413],{"text":387,"type":332},"You can also change \"How did you find Us?… (required)\" and \"Referred by?\" to suit your needs. Option values can also be changed, but you'll need to make sure you change them to match in the following Twig \"if\" statement and within the ",{"text":389,"type":332,"marks":390},"\u003Coption>",[391],{"type":380},{"text":393,"type":332}," and ",{"text":395,"type":332,"marks":396},"\u003C\u002Foption>",[397],{"type":380},{"text":399,"type":332}," tags that displays the option to the customer. We don't recommend changing anything on the ",{"text":401,"type":332,"marks":402},"other",[403],{"type":380},{"text":405,"type":332}," option unless you fully understand the snippet. You can feel free to ",{"text":407,"type":332,"marks":408},"contact us",[409],{"type":410,"attrs":411},"link",{"href":412,"uuid":59,"anchor":59,"target":59,"linktype":31},"https:\u002F\u002Ffoxy.io\u002Fcontact",{"text":414,"type":332}," for additional help.",{"type":327,"attrs":416,"content":417},{"textAlign":59},[418,420,424],{"text":419,"type":332},"This snippet sets the field to be required. If you don't want it to be required and need help changing that, please ",{"text":407,"type":332,"marks":421},[422],{"type":410,"attrs":423},{"href":412,"uuid":59,"anchor":59,"target":59,"linktype":31},{"text":425,"type":332},".",{"id":59,"alt":59,"name":13,"focus":59,"title":59,"source":59,"filename":13,"copyright":59,"fieldtype":81,"meta_data":427},{},"How to add a checkout dropdown that shows a text box when the customer selects Other.","3cb122dc-4180-4f38-bd81-4597e4c7dd46",[],"add-a-dropdown-with-an-other-text-option","help\u002Farticles\u002Fadd-a-dropdown-with-an-other-text-option",-4140,[],2659,"525d9c17-3d37-4ad6-b826-48d731b8e6f5",[],{"html":439,"sections":440,"segments":448},"\u003Cp>The following snippet will display a dropdown list in the checkout, and will display an extra text box for “Other” input if “Other” is selected.\u003C\u002Fp>\u003Csection id=\"add-javascript\" data-title=\"Add javascript\" data-title-node=\"H3\">\u003Ch3 data-anchor-id=\"add-javascript\">Add javascript\u003C\u002Fh3>\u003Cp>On the Templates configuration page of your store&#039;s Foxy administration, under &quot;Cart&quot; look for &quot;Add custom header or footer code to your website&quot;, check the box if not checked, and add this code into the &quot;Footer&quot; text area.\u003C\u002Fp>\u003Cdiv class=\"position-relative w-100 overflow-hidden rounded-2\" data-code-block>\u003Cdiv class=\"d-flex justify-content-end border-bottom\" style=\"background:#2b2c3b;\">\u003Cbutton type=\"button\" class=\"btn btn-link btn-sm text-light\" title=\"Copy\" data-code-button>\u003Cspan data-code-default style=\"\">\u003Ci class=\"fal fa-copy me-2\">\u003C\u002Fi> Copy \u003C\u002Fspan>\u003Cspan class=\"text-success\" data-code-success style=\"display:none;\">\u003Ci class=\"fal fa-check ms-2\">\u003C\u002Fi> Copied \u003C\u002Fspan>\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv class=\"small\">\u003Cpre class=\"hljs p-2\" data-code-content>{% if context == &quot;checkout&quot; %}\n\u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">script\u003C\u002Fspan>&gt;\u003C\u002Fspan>\u003Cspan class=\"language-javascript\">\n$(\u003Cspan class=\"hljs-string\">&quot;body&quot;\u003C\u002Fspan>).\u003Cspan class=\"hljs-title function_\">on\u003C\u002Fspan>(\u003Cspan class=\"hljs-string\">&quot;change&quot;\u003C\u002Fspan>, \u003Cspan class=\"hljs-string\">&quot;#referral_source&quot;\u003C\u002Fspan>, \u003Cspan class=\"hljs-keyword\">function\u003C\u002Fspan>(\u003Cspan class=\"hljs-params\">\u003C\u002Fspan>) {\n    \u003Cspan class=\"hljs-built_in\">setTimeout\u003C\u002Fspan>(\u003Cspan class=\"hljs-variable constant_\">FC\u003C\u002Fspan>.\u003Cspan class=\"hljs-property\">checkout\u003C\u002Fspan>.\u003Cspan class=\"hljs-property\">renderAdditionalFields\u003C\u002Fspan>, \u003Cspan class=\"hljs-number\">500\u003C\u002Fspan>);\n});\n\u003C\u002Fspan>\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">script\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n{% endif %}\u003C\u002Fpre>\u003C\u002Fdiv>\u003C\u002Fdiv>\u003C\u002Fsection>\u003Csection id=\"add-html\" data-title=\"Add HTML\" data-title-node=\"H3\">\u003Ch3 data-anchor-id=\"add-html\">Add HTML\u003C\u002Fh3>\u003Cp>Next, and still on the configuration page, under &quot;Checkout&quot; look for &quot;Add custom form fields to your checkout&quot;, enable it, and paste the following into the text box within:\u003C\u002Fp>\u003Cdiv class=\"position-relative w-100 overflow-hidden rounded-2\" data-code-block>\u003Cdiv class=\"d-flex justify-content-end border-bottom\" style=\"background:#2b2c3b;\">\u003Cbutton type=\"button\" class=\"btn btn-link btn-sm text-light\" title=\"Copy\" data-code-button>\u003Cspan data-code-default style=\"\">\u003Ci class=\"fal fa-copy me-2\">\u003C\u002Fi> Copy \u003C\u002Fspan>\u003Cspan class=\"text-success\" data-code-success style=\"display:none;\">\u003Ci class=\"fal fa-check ms-2\">\u003C\u002Fi> Copied \u003C\u002Fspan>\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv class=\"small\">\u003Cpre class=\"hljs p-2\" data-code-content>\u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;fc-form-group &quot;\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;col-md-8 col-md-offset-3&quot;\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">data-fc-error-for\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;referral_source&quot;\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">data-fc-error-class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;fc-alert-container--error&quot;\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n        \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;fc-input-group-container fc-input-group-container--checkbox fc-input-group-container--active&quot;\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n            \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">label\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;fc-input-group-container__title fc-input-group-container__title--forced fc-form-label&quot;\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                How did you find Us?… (required)\n            \u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">label\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n            \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;fc-form-group&quot;\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">p\u003C\u002Fspan>&gt;\u003C\u002Fspan>Referred by?\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">p\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">select\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">name\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;referral_source&quot;\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">id\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;referral_source&quot;\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;fc-form-control&quot;\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">aria-required\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;true&quot;\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">data-fc-required\u003C\u002Fspan> &gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Google&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Google&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Google\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Yahoo&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Yahoo&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Yahoo\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Bing&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Bing&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Bing\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Facebook&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Facebook&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Facebook\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Instagram&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot; Instagram &quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan> Instagram \u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Twitter&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot; Twitter&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan> Twitter\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Friend&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Friend&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Friend\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Amazon&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Amazon&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Amazon\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Email&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Email&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Email\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Returning Customer&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Returning Customer&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Returning Customer\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Other&quot;\u003C\u002Fspan> {% \u003Cspan class=\"hljs-attr\">if\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">referral_source\u003C\u002Fspan> == \u003Cspan class=\"hljs-string\">&quot;Other&quot;\u003C\u002Fspan> %}\u003Cspan class=\"hljs-attr\">selected\u003C\u002Fspan>{% \u003Cspan class=\"hljs-attr\">endif\u003C\u002Fspan> %}&gt;\u003C\u002Fspan>Other\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">option\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">select\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n            \u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n            {% if referral_source == &quot;Other&quot; %}\n                \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;fc-form-group&quot;\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-tag\">&lt;\u003Cspan class=\"hljs-name\">input\u003C\u002Fspan> \u003Cspan class=\"hljs-attr\">type\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;text&quot;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-attr\">id\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;other_text&quot;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-attr\">name\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;other_text&quot;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-attr\">placeholder\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;Please enter &#x27;Other&#x27;&quot;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-attr\">class\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;fc-form-control fc-form-control--new-customer-password&quot;\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-attr\">data-fc-required\u003C\u002Fspan>\n                    \u003Cspan class=\"hljs-attr\">value\u003C\u002Fspan>=\u003Cspan class=\"hljs-string\">&quot;&quot;\u003C\u002Fspan>\n                    \u002F&gt;\u003C\u002Fspan>\n                \u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n            {% endif %}\n        \u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n    \u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan>&gt;\u003C\u002Fspan>\n\u003Cspan class=\"hljs-tag\">&lt;\u002F\u003Cspan class=\"hljs-name\">div\u003C\u002Fspan>&gt;\u003C\u002Fspan>\u003C\u002Fpre>\u003C\u002Fdiv>\u003C\u002Fdiv>\u003C\u002Fsection>\u003Csection id=\"customize\" data-title=\"Customize\" data-title-node=\"H3\">\u003Ch3 data-anchor-id=\"customize\">Customize\u003C\u002Fh3>\u003Cp>You can customize some information to fit your needs. You can change \u003Ccode class=\"badge bg-soft-danger text-danger\">referral_source\u003C\u002Fcode> wherever you see it to something more appropriate for your needs. Make sure you change it everywhere, including on the Javascript above.\u003C\u002Fp>\u003Cp>You can also change &quot;How did you find Us?… (required)&quot; and &quot;Referred by?&quot; to suit your needs. Option values can also be changed, but you&#039;ll need to make sure you change them to match in the following Twig &quot;if&quot; statement and within the \u003Ccode class=\"badge bg-soft-danger text-danger\">&lt;option&gt;\u003C\u002Fcode> and \u003Ccode class=\"badge bg-soft-danger text-danger\">&lt;\u002Foption&gt;\u003C\u002Fcode> tags that displays the option to the customer. We don&#039;t recommend changing anything on the \u003Ccode class=\"badge bg-soft-danger text-danger\">other\u003C\u002Fcode> option unless you fully understand the snippet. You can feel free to \u003Ca href=\"https:\u002F\u002Ffoxy.io\u002Fcontact\" class=\"\">contact us\u003C\u002Fa> for additional help.\u003C\u002Fp>\u003Cp>This snippet sets the field to be required. If you don&#039;t want it to be required and need help changing that, please \u003Ca href=\"https:\u002F\u002Ffoxy.io\u002Fcontact\" class=\"\">contact us\u003C\u002Fa>.\u003C\u002Fp>\u003C\u002Fsection>",[441,444,446],{"id":442,"title":339,"level":443},"add-javascript","H3",{"id":445,"title":355,"level":443},"add-html",{"id":447,"title":370,"level":443},"customize",[449],{"type":450,"content":451},"html","\u003Cp>The following snippet will display a dropdown list in the checkout, and will display an extra text box for “Other” input if “Other” is selected.\u003C\u002Fp>\u003Ch3>Add javascript\u003C\u002Fh3>\u003Cp>On the Templates configuration page of your store&#039;s Foxy administration, under &quot;Cart&quot; look for &quot;Add custom header or footer code to your website&quot;, check the box if not checked, and add this code into the &quot;Footer&quot; text area.\u003C\u002Fp>\u003Cpre>\u003Ccode>{% if context == &quot;checkout&quot; %}\n&lt;script&gt;\n$(&quot;body&quot;).on(&quot;change&quot;, &quot;#referral_source&quot;, function() {\n    setTimeout(FC.checkout.renderAdditionalFields, 500);\n});\n&lt;\u002Fscript&gt;\n{% endif %}\u003C\u002Fcode>\u003C\u002Fpre>\u003Ch3>Add HTML\u003C\u002Fh3>\u003Cp>Next, and still on the configuration page, under &quot;Checkout&quot; look for &quot;Add custom form fields to your checkout&quot;, enable it, and paste the following into the text box within:\u003C\u002Fp>\u003Cpre>\u003Ccode>&lt;div class=&quot;fc-form-group &quot;&gt;\n    &lt;div class=&quot;col-md-8 col-md-offset-3&quot; data-fc-error-for=&quot;referral_source&quot; data-fc-error-class=&quot;fc-alert-container--error&quot;&gt;\n        &lt;div class=&quot;fc-input-group-container fc-input-group-container--checkbox fc-input-group-container--active&quot;&gt;\n            &lt;label class=&quot;fc-input-group-container__title fc-input-group-container__title--forced fc-form-label&quot;&gt;\n                How did you find Us?… (required)\n            &lt;\u002Flabel&gt;\n            &lt;div class=&quot;fc-form-group&quot;&gt;\n                &lt;p&gt;Referred by?&lt;\u002Fp&gt;\n                    &lt;select name=&quot;referral_source&quot; id=&quot;referral_source&quot; class=&quot;fc-form-control&quot; aria-required=&quot;true&quot; data-fc-required &gt;\n                    &lt;option value=&quot;Google&quot; {% if referral_source == &quot;Google&quot; %}selected{% endif %}&gt;Google&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Yahoo&quot; {% if referral_source == &quot;Yahoo&quot; %}selected{% endif %}&gt;Yahoo&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Bing&quot; {% if referral_source == &quot;Bing&quot; %}selected{% endif %}&gt;Bing&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Facebook&quot; {% if referral_source == &quot;Facebook&quot; %}selected{% endif %}&gt;Facebook&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Instagram&quot; {% if referral_source == &quot; Instagram &quot; %}selected{% endif %}&gt; Instagram &lt;\u002Foption&gt;\n                    &lt;option value=&quot;Twitter&quot; {% if referral_source == &quot; Twitter&quot; %}selected{% endif %}&gt; Twitter&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Friend&quot; {% if referral_source == &quot;Friend&quot; %}selected{% endif %}&gt;Friend&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Amazon&quot; {% if referral_source == &quot;Amazon&quot; %}selected{% endif %}&gt;Amazon&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Email&quot; {% if referral_source == &quot;Email&quot; %}selected{% endif %}&gt;Email&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Returning Customer&quot; {% if referral_source == &quot;Returning Customer&quot; %}selected{% endif %}&gt;Returning Customer&lt;\u002Foption&gt;\n                    &lt;option value=&quot;Other&quot; {% if referral_source == &quot;Other&quot; %}selected{% endif %}&gt;Other&lt;\u002Foption&gt;\n                    &lt;\u002Fselect&gt;\n            &lt;\u002Fdiv&gt;\n            {% if referral_source == &quot;Other&quot; %}\n                &lt;div class=&quot;fc-form-group&quot;&gt;\n                    &lt;input type=&quot;text&quot;\n                    id=&quot;other_text&quot;\n                    name=&quot;other_text&quot;\n                    placeholder=&quot;Please enter &#039;Other&#039;&quot;\n                    class=&quot;fc-form-control fc-form-control--new-customer-password&quot;\n                    data-fc-required\n                    value=&quot;&quot;\n                    \u002F&gt;\n                &lt;\u002Fdiv&gt;\n            {% endif %}\n        &lt;\u002Fdiv&gt;\n    &lt;\u002Fdiv&gt;\n&lt;\u002Fdiv&gt;\u003C\u002Fcode>\u003C\u002Fpre>\u003Ch3>Customize\u003C\u002Fh3>\u003Cp>You can customize some information to fit your needs. You can change \u003Ccode class=\"badge bg-soft-danger text-danger\">referral_source\u003C\u002Fcode> wherever you see it to something more appropriate for your needs. Make sure you change it everywhere, including on the Javascript above.\u003C\u002Fp>\u003Cp>You can also change &quot;How did you find Us?… (required)&quot; and &quot;Referred by?&quot; to suit your needs. Option values can also be changed, but you&#039;ll need to make sure you change them to match in the following Twig &quot;if&quot; statement and within the \u003Ccode class=\"badge bg-soft-danger text-danger\">&lt;option&gt;\u003C\u002Fcode> and \u003Ccode class=\"badge bg-soft-danger text-danger\">&lt;\u002Foption&gt;\u003C\u002Fcode> tags that displays the option to the customer. We don&#039;t recommend changing anything on the \u003Ccode class=\"badge bg-soft-danger text-danger\">other\u003C\u002Fcode> option unless you fully understand the snippet. You can feel free to \u003Ca href=\"https:\u002F\u002Ffoxy.io\u002Fcontact\" class=\"\">contact us\u003C\u002Fa> for additional help.\u003C\u002Fp>\u003Cp>This snippet sets the field to be required. If you don&#039;t want it to be required and need help changing that, please \u003Ca href=\"https:\u002F\u002Ffoxy.io\u002Fcontact\" class=\"\">contact us\u003C\u002Fa>.\u003C\u002Fp>",{"name":453,"created_at":454,"published_at":455,"updated_at":456,"id":457,"uuid":47,"content":458,"slug":48,"full_slug":48,"sort_by_date":59,"position":637,"tag_list":638,"is_startpage":24,"parent_id":59,"meta_data":59,"group_id":639,"first_published_at":640,"release_id":59,"lang":65,"path":59,"alternates":641,"default_full_slug":59,"translated_slugs":59},"Contact","2022-09-23T19:56:58.957Z","2025-05-08T18:24:40.382Z","2025-05-08T18:24:40.392Z",3138,{"seo":459,"_uid":462,"title":463,"action":464,"fields":465,"method":613,"columns":614,"subtitle":628,"component":48,"button_text":634,"submit_title":635,"submit_subtitle":636},{"_uid":460,"title":453,"plugin":461,"description":13},"24ff7574-3bcc-48d2-85b5-e529dfea1cc4","meta-fields","8f54f1da-9d8f-49b2-89e7-840e886491cb","We're here to help.","https:\u002F\u002Fusebasin.com\u002Ff\u002F029f48d65402",[466,471,475,584,587,592,607],{"_uid":467,"name":468,"type":332,"label":469,"options":13,"required":33,"component":470,"placeholder":13},"9a70b226-2036-4f90-a052-b3efa61c5896","name","Name","form___field",{"_uid":472,"name":473,"type":473,"label":474,"options":13,"required":33,"component":470,"placeholder":13},"86ba35be-ff43-4a28-8633-14052a8f6622","email","Email Address",{"_uid":476,"name":477,"type":478,"label":479,"options":480,"required":33,"component":470,"conditions":481,"placeholder":13},"3f827475-492c-4f97-aa1e-2386ac263b6c","topic","select","Topic","Presales, Support, Billing, Partnerships, Order Enquiry, Other",[482,538,548,555,563,571,577],{"_uid":483,"equals":484,"fields":485,"component":537},"e21d97dd-e68e-4fa6-ba97-bc40f3041dde","Order Enquiry",[486],{"_uid":487,"body":488,"type":535,"title":13,"component":536},"b64992bc-6d53-48b8-b7a0-d81e5a062e50",{"type":324,"content":489},[490],{"type":327,"content":491},[492,494,501,503,505,506,511,513,518,526,528,533],{"text":493,"type":332},"We are ",{"text":495,"type":332,"marks":496},"Foxy.io",[497],{"type":410,"attrs":498},{"href":499,"uuid":59,"anchor":59,"custom":500,"target":59,"linktype":31},"http:\u002F\u002FFoxy.io",{},{"text":502,"type":332},", an ecommerce platform powering ecommerce for other merchants. We do not sell products, and are unable to assist with questions about order statuses or refunds for any merchants using our platform. Please contact the merchant you ordered from for assistance. If you’d like to report a store using Foxy for fraudulent practices, please select ‘other’ in the subject.",{"type":504},"hard_break",{"type":504},{"text":507,"type":332,"marks":508},"NOTE:",[509],{"type":510},"bold",{"text":512,"type":332}," We are ",{"text":514,"type":332,"marks":515},"not ",[516],{"type":517},"italic",{"text":519,"type":332,"marks":520},"Foxy.in",[521,525],{"type":410,"attrs":522},{"href":523,"uuid":59,"anchor":59,"custom":524,"target":59,"linktype":31},"http:\u002F\u002FFoxy.in",{},{"type":517},{"text":527,"type":332},". We are not in any way affiliated with ",{"text":519,"type":332,"marks":529},[530],{"type":410,"attrs":531},{"href":523,"uuid":59,"anchor":59,"custom":532,"target":59,"linktype":31},{},{"text":534,"type":332},", and cannot help in any way with your order from that website.","danger","global___alert","form___condition",{"_uid":539,"equals":540,"fields":541,"component":537},"8765c3e1-25cf-44aa-b8ea-fc6094acf9c3","Presales",[542],{"_uid":543,"name":544,"type":545,"label":13,"options":13,"required":24,"component":470,"conditions":546,"placeholder":13,"default_value":547},"cf464f8e-d643-4f6e-af29-d3abffaf7380","department_email_address","hidden",[],"hello@foxy.io",{"_uid":549,"equals":208,"fields":550,"component":537},"4007b6d8-77e5-421d-bd1e-6f336dd853fb",[551],{"_uid":552,"name":544,"type":545,"label":13,"options":13,"required":24,"component":470,"conditions":553,"placeholder":13,"default_value":554},"7b4c6aa5-a68c-45e0-9ce1-0a36af10c0c2",[],"help@foxy.io",{"_uid":556,"equals":557,"fields":558,"component":537},"1dbb8f11-613d-43cd-9e09-1b94f6e19219","Billing",[559],{"_uid":560,"name":544,"type":545,"label":13,"options":13,"required":24,"component":470,"conditions":561,"placeholder":13,"default_value":562},"a0ac0d1b-bc4f-4a6c-a682-581d450b0b73",[],"help+billing@foxy.io",{"_uid":564,"equals":565,"fields":566,"component":537},"a0a53a50-7172-4a29-ba58-181e38874e12","Partnerships",[567],{"_uid":568,"name":544,"type":545,"label":13,"options":13,"required":24,"component":470,"conditions":569,"placeholder":13,"default_value":570},"7aa011d9-f374-4aed-b5a5-929b54aaf152",[],"partners@foxy.io",{"_uid":572,"equals":484,"fields":573,"component":537},"a4cd431f-25d5-41c7-bfdc-02c908c8fb47",[574],{"_uid":575,"name":544,"type":545,"label":13,"options":13,"required":24,"component":470,"conditions":576,"placeholder":13,"default_value":547},"f5d52168-d6ae-451b-94ee-2ced1cbd28ad",[],{"_uid":578,"equals":579,"fields":580,"component":537},"25aba1ed-eb41-4bbc-aa89-f7a7167ea86e","Other",[581],{"_uid":582,"name":544,"type":545,"label":13,"options":13,"required":24,"component":470,"conditions":583,"placeholder":13,"default_value":547},"f40dfaef-c203-4b71-bf4e-e1b43cef192b",[],{"_uid":585,"component":586},"e9c53a05-f40a-4510-aaf8-bc072a235a0c","form___subject",{"_uid":588,"name":589,"type":590,"label":591,"options":13,"required":33,"component":470,"placeholder":13},"a4c4d385-fff4-4978-99fb-b68cfea623d6","message","textarea","Message",{"_uid":593,"name":594,"type":478,"label":595,"options":596,"required":33,"component":470,"conditions":597,"placeholder":13},"8a3c9f85-f438-427d-9c7a-d7b295a14b5b","existing_user","Are you an existing user?","No, Yes",[598],{"_uid":599,"equals":600,"fields":601,"component":537},"115933d6-262a-4b59-8fa8-579c5ad73de1","Yes",[602],{"_uid":603,"name":604,"type":332,"label":605,"options":13,"required":33,"component":470,"conditions":606,"placeholder":13},"44b6ff23-98f0-4e95-b7f5-c23e06415c2d","subdomain","Store Subdomain",[],{"_uid":608,"name":609,"type":478,"label":610,"options":611,"required":33,"component":470,"conditions":612,"placeholder":13},"922a5cef-3af2-4113-8855-36c7910e3ee3","user_type","What type of user are you?","Developer, Designer, Merchant",[],"POST",[615],{"_uid":616,"text":617,"title":626,"component":627},"7323b90d-a93a-4bf1-baa9-20d0b7ead61b",{"type":324,"content":618},[619],{"type":327,"content":620},[621,623,624],{"text":622,"type":332},"855.369.9227",{"type":504},{"text":625,"type":332},"9:30am-6pm Central M-F","Pre-sales, Sales, & Partnerships","contact___footer_column",{"type":324,"content":629},[630],{"type":327,"content":631},[632],{"text":633,"type":332},"Get in touch to get help from our friendly support team.","Submit","Success!","Your email has been received. We'll get back to you as soon as we can, but it might take a business day. If you don't hear back from us in a timely manner, please check your spam folder to ensure our reply didn't go there.",-80,[],"2fd9fb7d-a48a-4184-acfd-30022d8d6f08","2022-09-23T20:10:45.360Z",[],[288,643,672],{"name":644,"created_at":645,"published_at":646,"updated_at":647,"id":648,"uuid":649,"content":650,"slug":665,"full_slug":666,"sort_by_date":59,"position":667,"tag_list":668,"is_startpage":24,"parent_id":310,"meta_data":59,"group_id":669,"first_published_at":670,"release_id":59,"lang":65,"path":59,"alternates":671,"default_full_slug":59,"translated_slugs":59},"Checkout","2024-11-06T19:56:29.907Z","2026-07-02T22:04:34.438Z","2026-07-02T22:04:34.451Z",14898631,"60b73dc2-7635-487c-bd1f-fd7fba18ab4d",{"_uid":651,"icon":13,"name":644,"type":652,"guides":653,"pinned":24,"summary":654,"category":13,"component":297,"blog_posts":655,"content_hub":24,"icon_custom":656,"case_studies":658,"faq_sections":659,"help_articles":660,"featured_guides":661,"mailbox_category":13,"featured_articles":662,"featured_blog_posts":663,"featured_case_studies":664},"0a484217-201f-4f60-a813-d8d8bda736e4","simple",[],"How the checkout works, configuration options, customizations, and advanced integrations.",[],{"id":59,"alt":59,"name":13,"focus":59,"title":59,"source":59,"filename":13,"copyright":59,"fieldtype":81,"meta_data":657},{},[],[],[],[],[],[],[],"checkout","help\u002Fcategories\u002Fcheckout",0,[],"b3bfcd1f-8386-4ed8-9218-2f4c2989a1b2","2024-11-06T19:56:44.870Z",[],{"name":673,"created_at":674,"published_at":675,"updated_at":676,"id":677,"uuid":429,"content":678,"slug":690,"full_slug":691,"sort_by_date":59,"position":692,"tag_list":693,"is_startpage":24,"parent_id":310,"meta_data":59,"group_id":694,"first_published_at":675,"release_id":59,"lang":65,"path":59,"alternates":695,"default_full_slug":59,"translated_slugs":59},"Custom Checkout Fields","2026-07-02T20:09:31.264Z","2026-07-02T20:10:29.634Z","2026-07-02T20:10:29.643Z",193877488751878,{"_uid":679,"icon":13,"name":673,"type":652,"pinned":24,"summary":680,"category":649,"component":297,"blog_posts":681,"icon_custom":682,"case_studies":684,"faq_sections":685,"featured_guides":686,"mailbox_category":13,"featured_articles":687,"featured_blog_posts":688,"featured_case_studies":689},"ce0f4c6a-abc9-4e6e-bf6e-74a6e0c769e8","Add, validate, and manage custom input fields on your checkout, from simple text inputs to multilingual and sensitive fields.",[],{"id":59,"alt":59,"name":13,"focus":59,"title":59,"source":59,"filename":13,"copyright":59,"fieldtype":81,"meta_data":683},{},[],[],[],[],[],[],"custom-checkout-fields","help\u002Fcategories\u002Fcustom-checkout-fields",-570,[],"0254bc69-c069-4130-866c-ac97b8f25471",[],{},1784742856486]