[{"data":1,"prerenderedAt":111},["ShallowReactive",2],{"help-article-\u002Fhelp\u002Fexpressions-and-logic\u002Fguide-if-else-logic":3},{"id":4,"title":5,"body":6,"category":98,"description":99,"extension":100,"keywords":101,"meta":102,"navigation":103,"order":104,"path":105,"rawbody":106,"seo":107,"stem":108,"updated":109,"__hash__":110},"help\u002Fhelp\u002Fexpressions-and-logic\u002Fguide-if-else-logic.md","Guide: IF \u002F ELSE logic",{"type":7,"value":8,"toc":95},"minimark",[9,22,53,59,64,67,74],[10,11,12,13,17,18,21],"p",{},"The ",[14,15,16],"code",{},"IF"," function picks between two values based on a condition: ",[14,19,20],{},"IF(condition, valueIfTrue, valueIfFalse)",". With it, parts of a design can respond to what users enter.",[10,23,24,28,29,32,33,38,39,42,43,45,46,48,49,52],{},[25,26,27],"strong",{},"Show or hide an element."," Connect an element's ",[25,30,31],{},"Visibility"," to a true\u002Ffalse value. With a ",[34,35,37],"a",{"href":36},"\u002Fhelp\u002Finput-fields\u002Fcheckbox-input-fields","checkbox"," whose variable is ",[14,40,41],{},"showBadge",", just use ",[14,44,41],{},": the element appears only when the box is ticked. The ",[14,47,16],{}," form ",[14,50,51],{},"IF(showBadge, true, false)"," does the same thing and is handy when the condition is more involved.",[10,54,55,58],{},[25,56,57],{},"Switch a value."," Change a colour based on a choice:",[10,60,61],{},[14,62,63],{},"IF(isDark, `#ffffff`, `#000000`)",[10,65,66],{},"This sets text white on a dark theme and black otherwise.",[10,68,69],{},[70,71],"img",{"alt":72,"src":73},"","https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002F363d0ade-dd02-47eb-68f7-d34e4a07b400\u002Fmax",[10,75,76,79,80,83,84,87,88,90,91,94],{},[25,77,78],{},"Test a condition."," The condition can be a comparison like ",[14,81,82],{},"price > 100",", or a check such as ",[14,85,86],{},"IS_EMPTY_STRING(subtitle)"," to hide a subtitle when it is left blank. For more than two outcomes, nest one ",[14,89,16],{}," inside another or use the ",[14,92,93],{},"SWITCH"," function.",{"title":72,"searchDepth":96,"depth":96,"links":97},2,[],"expressions-and-logic","Show, hide, and switch elements based on what users enter.","md",[],{},true,80,"\u002Fhelp\u002Fexpressions-and-logic\u002Fguide-if-else-logic","---\ntitle: \"Guide: IF \u002F ELSE logic\"\ndescription: \"Show, hide, and switch elements based on what users enter.\"\ncategory: expressions-and-logic\norder: 80\nkeywords: []\n---\nThe `IF` function picks between two values based on a condition: `IF(condition, valueIfTrue, valueIfFalse)`. With it, parts of a design can respond to what users enter.\n\n**Show or hide an element.** Connect an element's **Visibility** to a true\u002Ffalse value. With a [checkbox](\u002Fhelp\u002Finput-fields\u002Fcheckbox-input-fields) whose variable is `showBadge`, just use `showBadge`: the element appears only when the box is ticked. The `IF` form ``IF(showBadge, true, false)`` does the same thing and is handy when the condition is more involved.\n\n**Switch a value.** Change a colour based on a choice:\n\n``IF(isDark, `#ffffff`, `#000000`)``\n\nThis sets text white on a dark theme and black otherwise.\n\n![](https:\u002F\u002Fimagedelivery.net\u002FmudX-CmAqIANL8bxoNCToA\u002F363d0ade-dd02-47eb-68f7-d34e4a07b400\u002Fmax)\n\n**Test a condition.** The condition can be a comparison like `price > 100`, or a check such as `IS_EMPTY_STRING(subtitle)` to hide a subtitle when it is left blank. For more than two outcomes, nest one `IF` inside another or use the `SWITCH` function.\n",{"title":5,"description":99},"help\u002Fexpressions-and-logic\u002Fguide-if-else-logic","2026-06-16","PXNgNyjyF43k309dIj9J-ZpUZeb-QhyUbU65bipPbsY",1789292811959]