{
    "componentChunkName": "component---src-templates-article-page-template-js",
    "path": "/concepts/microcopy/",
    "result": {"data":{"markdownRemark":{"frontmatter":{"title":"Microcopy in Flex","slug":"microcopy","updated":"2022-06-14T00:00:00.000Z","category":"concepts-content-management","ingress":"This article introduces microcopy in Flex and how it is modified and edited in Flex Console","skills":null},"htmlAst":{"type":"root","children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Microcopy refers to all the small pieces of text in your marketplace's\ndynamic pages – button labels, error messages, and help texts are all\nexamples of microcopy. Modifying microcopy to match your marketplace's\ntheme and tone of voice is a key task in customizing any marketplace.\n"},{"type":"element","tagName":"a","properties":{"href":"/docs/legacy/operator-guides/"},"children":[{"type":"text","value":"Read more about marketplace microcopy"}]},{"type":"text","value":"."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"In the FTW templates, microcopy is not written directly into the source\ncode. Instead, the source code uses\n"},{"type":"element","tagName":"a","properties":{"href":"https://formatjs.io/docs/intl#formatmessage","target":"_blank","rel":["noopener","noreferrer"]},"children":[{"type":"text","value":"React Intl message formatting"}]},{"type":"text","value":"\nthat defines keys for each meaningful piece of content, and a translator\nor a content creator can then define the message (i.e. the value) for\neach key in their language. The end user only sees the content creator's\nwords, not the key itself, unless the key is missing a value in the\nselected language."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"The key - value syntax is as follows:"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"json"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","property"]},"children":[{"type":"text","value":"\"<component name>.<microcopy key>\""}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"<microcopy>\""}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"For example:"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"json"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","property"]},"children":[{"type":"text","value":"\"ManageListingCard.editListing\""}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"Edit listing\""}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"The key is then used in the code, so that the code does not need to be\nchanged even if the value ends up changing."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"js"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","comment"]},"children":[{"type":"text","value":"// ManageListingCard.js uses the variable to identify the message"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"<"}]},{"type":"text","value":"FormattedMessage id"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"ManageListingCard.editListing\""}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"/"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":">"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Starting from 2022-05, marketplace operators can modify the wording of\nmicrocopy in Flex Console. This means that operators can make changes to\nthe marketplace texts without the need for code changes. In addition,\nthe same microcopy can now be used from several different client\napplications, making it easier to make centralized changes."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 635px; "},"children":[{"type":"text","value":"\n      "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/docs/legacy/static/a55785606e712053bba3a5d1f6307953/f2957/microcopy_simple.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n    "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 22.0125786163522%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAECAYAAACOXx+WAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAiklEQVQY052O0Q7CIAxF9/+/aYyT4QJubFAKR5kkJhpffDi5vW1y0sF7j3OOUgoVqJVX/qLW77llZ1AtZK3sUYhbRFJGkiCx03pM793RP2bJh6Mx5FxIosSUWY1lOZ0JZiIYy3oZCdONdTQEOxOuE8Ev7O7OZucj2y0uAa10Yf+wSXMB/ZPm0KfwAbnAObHo+Jl3AAAAAElFTkSuQmCC'); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n  "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/a55785606e712053bba3a5d1f6307953/82e29/microcopy_simple.webp 159w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/ef33f/microcopy_simple.webp 318w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/f1837/microcopy_simple.webp 635w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/29549/microcopy_simple.webp 953w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/c5420/microcopy_simple.webp 1270w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/b7e40/microcopy_simple.webp 5669w"],"sizes":"(max-width: 635px) 100vw, 635px","type":"image/webp"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/a55785606e712053bba3a5d1f6307953/8b9b5/microcopy_simple.png 159w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/fa108/microcopy_simple.png 318w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/53fb6/microcopy_simple.png 635w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/5a426/microcopy_simple.png 953w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/91155/microcopy_simple.png 1270w","/docs/legacy/static/a55785606e712053bba3a5d1f6307953/f2957/microcopy_simple.png 5669w"],"sizes":"(max-width: 635px) 100vw, 635px","type":"image/png"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/docs/legacy/static/a55785606e712053bba3a5d1f6307953/53fb6/microcopy_simple.png","alt":"Simple Console microcopy","title":"Simple Console microcopy","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n        "}]},{"type":"text","value":"\n  "}]},{"type":"text","value":"\n    "}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"h2","properties":{"id":"how-microcopy-is-handled-in-flex","style":"position:relative;"},"children":[{"type":"element","tagName":"a","properties":{"href":"#how-microcopy-is-handled-in-flex","ariaLabel":"how microcopy is handled in flex permalink","className":["anchor","before"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]},{"type":"text","value":"How microcopy is handled in Flex"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"With Console-editable microcopy, Flex introduces a concept of\n"},{"type":"element","tagName":"a","properties":{"href":"/docs/legacy/references/assets/"},"children":[{"type":"text","value":"assets"}]},{"type":"text","value":". Assets provide a way to define\nmarketplace content and configurations using JSON files without needing\nto include the actual content in the client application codebase."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"For the microcopy file version being edited in Flex Console, the asset\nin question is "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"content/translations.json"}]},{"type":"text","value":". In other words, Flex Console\nhas a dedicated view – \"Build\" > \"Content\" – for modifying the\n"},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"content/translations.json"}]},{"type":"text","value":" asset. The asset refers to translations\nbecause the language-specific microcopy files allow the marketplace to\nfairly easily be translated to languages other than English."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 635px; "},"children":[{"type":"text","value":"\n      "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/4a8b1/microcopy_start.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n    "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 67.9245283018868%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAOCAYAAAAvxDzwAAAACXBIWXMAABYlAAAWJQFJUiTwAAABrklEQVQ4y42Sb0/bMBDG80k3QQevEHQV0lAL2ut9yG0M0S5t0sT5Z/t8dp7JdlKyETQs/fTc2b5HF1+Sx6ctvv98wo/HX/i9z5AeMuyzPHIYmOaDpod/81ibfLy6w9n1GherB9x+/Rb00+d7LJYbnN+sA4ubDS5W9zFebrBYrk9nl6uHoB+uvsB7JUVZoRQNdmmG5+0ez7sDjkUFvz9lupcXFfLjQNivTyTMDtb26DqFLC9DgbN9wFp3imPu1UGRRasimiwsO/BAorWB1gRrLYwxYOZg5PM5nHPo+x7oezjXw7AL9Sr4mGhIxFBKQggRVEoJpVTQrusCY0xE8MubjujBzPsMhgZkGK0kdMrAGA6djh17HfFdTtfbhmTi+PcZiqJEXbdomhZ13UziSFU1AR8z21A7Y0jY7lKkaZyyEDWEqFCWMY467r/wpqGf1u6osM018sp/nv0vRHbe0MN2OKCXJ5jiC+P0/8ZPffYNtbGoOotaDkxjadEo94paOpBxkw79b0M8GDoUrYPoHMo52tf4+4pGQ44dSklQSkNqxrFmFM378fc7xbFeaihF+AOXAh5WXTIo+AAAAABJRU5ErkJggg=='); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n  "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/82e29/microcopy_start.webp 159w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/ef33f/microcopy_start.webp 318w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/f1837/microcopy_start.webp 635w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/29549/microcopy_start.webp 953w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/c5420/microcopy_start.webp 1270w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/81f25/microcopy_start.webp 2002w"],"sizes":"(max-width: 635px) 100vw, 635px","type":"image/webp"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/8b9b5/microcopy_start.png 159w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/fa108/microcopy_start.png 318w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/53fb6/microcopy_start.png 635w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/5a426/microcopy_start.png 953w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/91155/microcopy_start.png 1270w","/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/4a8b1/microcopy_start.png 2002w"],"sizes":"(max-width: 635px) 100vw, 635px","type":"image/png"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/docs/legacy/static/6d502ba1d1bd1d39177dc5ee630c7fe1/53fb6/microcopy_start.png","alt":"Content view for editing microcopy","title":"Content view for editing microcopy","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n        "}]},{"type":"text","value":"\n  "}]},{"type":"text","value":"\n    "}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can add one or more microcopy key-value pairs in JSON format into\nthe Microcopy field. You can copy them from the linked microcopy\nresources in the FTW templates, or your existing marketplace microcopy\nfile."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 635px; "},"children":[{"type":"text","value":"\n      "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/c62c3/microcopy_console.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n    "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 62.893081761006286%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAANCAYAAACpUE5eAAAACXBIWXMAABYlAAAWJQFJUiTwAAABwklEQVQ4y5WR3W/TMBTF8z8isQ+eQPviBbYO8cAT/x8SiGnTWFm0qlS01ZracezE9rVz0HXatB2TEJF+Ob7nOif+yL5f/8DXqxt8+XaF2585hvkocZc/YJg/9Nr5m/Hd/dPeCNe3Q2R7xxc4OB3g7cfPeP3+E/aPL3B4dgn2908GvbK3rg9PL7F3dJ7GBycDvDr7gJdH53jx5h0yWWosCtlTLEuwJ8tqF7kZC1lhKToK0dVdTyMLoYXWNcaTKUbj3yiVRggR3gfQc1CAcwHKeFSGoAylmigmsqZxiDGibVvEGJL+m24+2rb7OQVY62CtR8Yv5xyklKjrGtbaBHusTdP03ppVVk+MbQp0jjjQwROh0gba1DB1nYI7TFKtdVJjTCKtbuvhug/kLVOIqIyDUDW0sSBP6aw27Na8zW34yHYC2dDaQCmFSlWpyR/yxXhPCdrCP4FDU6BdBYYQ4HyAdZRomMahsR6WfQ4OLagFKGKj7IV2d4W2cWnyojCY3v/CLJ8k5pNHzMdzPM5Ex5RZYjGTWMwEisJAmAihAxzF1S2vA4kbBKF8R+kgKoKoturSYcmqXN+XKTA+H8jN/0aHvwL/AIcIy5srb7qOAAAAAElFTkSuQmCC'); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n  "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/82e29/microcopy_console.webp 159w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/ef33f/microcopy_console.webp 318w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/f1837/microcopy_console.webp 635w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/29549/microcopy_console.webp 953w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/c5420/microcopy_console.webp 1270w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/8c7c1/microcopy_console.webp 2036w"],"sizes":"(max-width: 635px) 100vw, 635px","type":"image/webp"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/8b9b5/microcopy_console.png 159w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/fa108/microcopy_console.png 318w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/53fb6/microcopy_console.png 635w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/5a426/microcopy_console.png 953w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/91155/microcopy_console.png 1270w","/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/c62c3/microcopy_console.png 2036w"],"sizes":"(max-width: 635px) 100vw, 635px","type":"image/png"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/docs/legacy/static/cc5356cfbeb26ce38f7b253fd135516e/53fb6/microcopy_console.png","alt":"Add microcopy key-value pairs","title":"Add microcopy key-value pairs","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n        "}]},{"type":"text","value":"\n  "}]},{"type":"text","value":"\n    "}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"When the asset has been created, you will need to fetch the microcopy to\nthe client application. Microcopy is fetched through Asset Delivery API\nin JSON format. Assets can be retrieved by the latest version, or by a\nspecific version. Read more:"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"ul","properties":{},"children":[{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"element","tagName":"a","properties":{"href":"/docs/legacy/references/assets/"},"children":[{"type":"text","value":"Marketplace assets"}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"element","tagName":"a","properties":{"href":"/docs/legacy/ftw/hosted-microcopy/"},"children":[{"type":"text","value":"Handling hosted asset microcopy in the FTW templates"}]}]},{"type":"text","value":"\n"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"h2","properties":{"id":"format-for-editing-microcopy-in-console","style":"position:relative;"},"children":[{"type":"element","tagName":"a","properties":{"href":"#format-for-editing-microcopy-in-console","ariaLabel":"format for editing microcopy in console permalink","className":["anchor","before"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]},{"type":"text","value":"Format for editing microcopy in Console"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"A piece of microcopy using the\n"},{"type":"element","tagName":"a","properties":{"href":"https://formatjs.io/docs/intl#formatmessage","target":"_blank","rel":["noopener","noreferrer"]},"children":[{"type":"text","value":"React Intl formatMessage formatting"}]},{"type":"text","value":"\ncan, at its simplest, consist of a phrase."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"json"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":"\n  "},{"type":"element","tagName":"span","properties":{"className":["token","property"]},"children":[{"type":"text","value":"\"ManageListingCard.editListing\""}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"Edit listing\""}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"In the FTW template, the phrase is then passed to the UI element that\nshows the value."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"js"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","comment"]},"children":[{"type":"text","value":"// ManageListingCard.js uses the variable to identify the message"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"<"}]},{"type":"text","value":"FormattedMessage id"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"ManageListingCard.editListing\""}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"/"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":">"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 518px; "},"children":[{"type":"text","value":"\n      "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/docs/legacy/static/91a24717422606177b3b1f149a170e57/70543/microcopy_UI_simple.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n    "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 35.22012578616352%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAHCAYAAAAIy204AAAACXBIWXMAABYlAAAWJQFJUiTwAAABRElEQVQoz42Sa0/CMBiF9///iQkfNUSCEDABKci4BxyggEPAsTnoxroBj1kT+GA0scnJ6enbPk0vhtr5bBs1HFHB7TRxWw28fofFcsl6tcK2bSaTCZ7ncTqdSJKE4/H4p4xYSnaDrtb+ZchuOGD/OmZkWXxuNsznc7rdLr7v/xMYx8hIsY8iAqUIk4QgUhyCgCiKkFKSzknbFZZ6kuh80RXo7yWFUol8ochNJoN4bvIk6uQKBcrlMvl8nl6vdwX+BFx0GTPi7YbwfUa4XLAZDVArm3hlaz+EASqOUUrp457PZ70o7f8GS93YmTVE9pZ6Loslqoj7O1qlIsvHB77WH1RrNcxmk3a7TaVSwbIsfaemaeoshNA+nU71RoZ8m+CO+njjEZ411Fr3Ozi9FjL9AdutluM4zGYz/dppdl33WrvUwzDkG6PfCvLnKVz/AAAAAElFTkSuQmCC'); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n  "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/91a24717422606177b3b1f149a170e57/82e29/microcopy_UI_simple.webp 159w","/docs/legacy/static/91a24717422606177b3b1f149a170e57/ef33f/microcopy_UI_simple.webp 318w","/docs/legacy/static/91a24717422606177b3b1f149a170e57/9e980/microcopy_UI_simple.webp 518w"],"sizes":"(max-width: 518px) 100vw, 518px","type":"image/webp"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/91a24717422606177b3b1f149a170e57/8b9b5/microcopy_UI_simple.png 159w","/docs/legacy/static/91a24717422606177b3b1f149a170e57/fa108/microcopy_UI_simple.png 318w","/docs/legacy/static/91a24717422606177b3b1f149a170e57/70543/microcopy_UI_simple.png 518w"],"sizes":"(max-width: 518px) 100vw, 518px","type":"image/png"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/docs/legacy/static/91a24717422606177b3b1f149a170e57/70543/microcopy_UI_simple.png","alt":"Simple microcopy phrase in UI","title":"Simple microcopy phrase in UI","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n        "}]},{"type":"text","value":"\n  "}]},{"type":"text","value":"\n    "}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Read more about\n"},{"type":"element","tagName":"a","properties":{"href":"/docs/legacy/ftw/how-to-change-ftw-bundled-microcopy/#using-the-microcopy"},"children":[{"type":"text","value":"using microcopy in the FTW templates"}]},{"type":"text","value":"."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"h3","properties":{"id":"simple-argument","style":"position:relative;"},"children":[{"type":"element","tagName":"a","properties":{"href":"#simple-argument","ariaLabel":"simple argument permalink","className":["anchor","before"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]},{"type":"text","value":"Simple argument"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"In addition, the format supports passing parameters as arguments to the\nmicrocopy string. Passing a\n"},{"type":"element","tagName":"a","properties":{"href":"https://formatjs.io/docs/core-concepts/icu-syntax/#simple-argument","target":"_blank","rel":["noopener","noreferrer"]},"children":[{"type":"text","value":"simple argument"}]},{"type":"text","value":"\nallows showing context-specific information as a part of the microcopy\nstring."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"json"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":"\n  "},{"type":"element","tagName":"span","properties":{"className":["token","property"]},"children":[{"type":"text","value":"\"ManageListingCard.pendingApproval\""}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"{listingTitle} is pending admin approval and can't be booked.\""}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Using the microcopy message then requires that the code passes parameter\n"},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"listingTitle"}]},{"type":"text","value":" to the element that renders the value. The\n"},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"{ listingTitle }"}]},{"type":"text","value":" parameter will then be replaced with whatever the\nlisting's title is."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"jsx"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-jsx"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-jsx"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","tag"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","tag"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"<"}]},{"type":"element","tagName":"span","properties":{"className":["token","class-name"]},"children":[{"type":"text","value":"Overlay"}]}]},{"type":"text","value":"\n  "},{"type":"element","tagName":"span","properties":{"className":["token","attr-name"]},"children":[{"type":"text","value":"message"}]},{"type":"element","tagName":"span","properties":{"className":["token","script","language-javascript"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","script-punctuation","punctuation"]},"children":[{"type":"text","value":"="}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":"intl"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"element","tagName":"span","properties":{"className":["token","function"]},"children":[{"type":"text","value":"formatMessage"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"\n    "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","literal-property","property"]},"children":[{"type":"text","value":"id"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"'ManageListingCard.pendingApproval'"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":"\n    "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","literal-property","property"]},"children":[{"type":"text","value":"listingTitle"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" title "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"text","value":"\n  "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"/>"}]}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 567px; "},"children":[{"type":"text","value":"\n      "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/docs/legacy/static/633214fc9083062eecc1caaa227df650/882b0/microcopy_UI_parameter.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n    "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 89.30817610062893%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAASCAYAAABb0P4QAAAACXBIWXMAABYlAAAWJQFJUiTwAAACQ0lEQVQ4y5WT63LaMBBG/f6v1pBSjIODTRKTQrCk1dU2MZd8HUkGQlqm7Y8zO6uVjnblcWJcA20djG2ucTGGmmv+Qhti222R+ETb0+INbtXPF8Y8CofNttnCuu5CE3GfabcXTvmnerd9R6KNgbEOSttLp3bAXaJ1l3i60LjrWhAqLSGVgJQCUhGU1mEMO4zkvnQZhINMGwdlbBzdNGjaDomUHFzU4LwG4xv4C6rlK2b5HEW5wMMsx7wo8TgvAj6fZg/gQoapiBSUNkEe3pAkAxEDY1Fa1zUm6RR3o/sQ77+PkU6ngfGPCSaTNNTKchGeSioThdqg9R2qMC4LIwvBIHiN5bLCer3C09MCo9EI2UOGNE1Dd5uaYf22AWMc2tgg851yLuCci0LGNiDiZ5QkSEnYvK1RFHMsFgsURYGXlxf4jxg5ySJSaTRN69+Q4KyGMRpEAkQEkhLCRyJo/5GMr8exiGTcQ/5SCSkVlNKDsEEiOIfxh7QKG5SK+Iv8ISHEFScRDbJIzIOQc4bVagUfpd88cOqCvGQQfRWfu1RRGoSSBARnIMHhuz0jODi/RoQ94pIPnOTWOiTbrkPXtvCx73vs+j7ErmvR+do/su22eH/vkZg8h55MIGc51huB6nWFavkTx+MRh4Pn8Edi/ff1ZCcreHp6QiuXcKKCUzX2+wP2+/1/kxxkigO/w1FlgPgG0BgfzRIfAI7H253cIpmXFR7LCtmsxLqWWK4YZo8lxuMxnp+fkec5siz+KdbacGi3293kF/uwVoPI5e76AAAAAElFTkSuQmCC'); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n  "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/633214fc9083062eecc1caaa227df650/82e29/microcopy_UI_parameter.webp 159w","/docs/legacy/static/633214fc9083062eecc1caaa227df650/ef33f/microcopy_UI_parameter.webp 318w","/docs/legacy/static/633214fc9083062eecc1caaa227df650/97423/microcopy_UI_parameter.webp 567w"],"sizes":"(max-width: 567px) 100vw, 567px","type":"image/webp"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/633214fc9083062eecc1caaa227df650/8b9b5/microcopy_UI_parameter.png 159w","/docs/legacy/static/633214fc9083062eecc1caaa227df650/fa108/microcopy_UI_parameter.png 318w","/docs/legacy/static/633214fc9083062eecc1caaa227df650/882b0/microcopy_UI_parameter.png 567w"],"sizes":"(max-width: 567px) 100vw, 567px","type":"image/png"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/docs/legacy/static/633214fc9083062eecc1caaa227df650/882b0/microcopy_UI_parameter.png","alt":"Microcopy phrase with parameter in UI","title":"Microcopy phrase with parameter in UI","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n        "}]},{"type":"text","value":"\n  "}]},{"type":"text","value":"\n    "}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Do note that even if the microcopy message uses a simple argument, you\ncan choose to not use it. For instance, you could replace the microcopy\nmessage in the previous example with\n"},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"\"ManageListingCard.pendingApproval\": \"This listing is pending admin approval and can't be booked.\""}]},{"type":"text","value":".\nHowever, if you later decide you do want to use the title, it is\nrecommended to double check the original microcopy file in your client\napplication to see the names of the attributes available in the message."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"h3","properties":{"id":"pluralization","style":"position:relative;"},"children":[{"type":"element","tagName":"a","properties":{"href":"#pluralization","ariaLabel":"pluralization permalink","className":["anchor","before"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]},{"type":"text","value":"Pluralization"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"One important factor in creating natural microcopy is handling\npluralization in a text. The ICU format makes it possible to define\ndifferent wordings for singular and plural options."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"json"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":"\n  "},{"type":"element","tagName":"span","properties":{"className":["token","property"]},"children":[{"type":"text","value":"\"ManageListingsPage.youHaveListings\""}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"You have {count} {count, plural, one {listing} other {listings}}\""}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"When you use plural in the microcopy string, you will need to specify"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"ul","properties":{},"children":[{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"the variable determining which option to use (here: "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"count"}]},{"type":"text","value":")"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"the pattern we are following (here: "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"plural"}]},{"type":"text","value":")"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"the options matching each alternative you want to specify (here: "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":"\n– there could be several options specified)"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"an "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" option that gets used when none of the specified\nalternatives matches"}]},{"type":"text","value":"\n"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"js"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"<"}]},{"type":"text","value":"FormattedMessage\n  id"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"ManageListingsPage.youHaveListings\""}]},{"type":"text","value":"\n  values"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","literal-property","property"]},"children":[{"type":"text","value":"count"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" pagination"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"totalItems "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"/"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":">"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 635px; "},"children":[{"type":"text","value":"\n      "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/1bfb4/microcopy_UI_plural.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n    "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 57.861635220125784%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAACXBIWXMAABYlAAAWJQFJUiTwAAACWElEQVQoz63R7UuTURzG8fsP6S8JQiPYC0W3tDlNtjEfcmqSWlaIClmECQq9qKBExkKpdAUtKLK0Fy7rVcx0SxFRNtvmdj9vbu62vrE7eoAQgjrw4XDOgev6wRHKy8v5F2VlZVgsFmw2GxUVFQizs7McZmZmxtwDgcChSu9zc3OEQiEWFhYQ+M9L2NzcZGNjg2g0SiQSYW1tjZWVFcLhsGl7exvDMNjby3+X/1PeVKBQKCCIYoZkMkki8ZmdeJx0Os1uKsXOzg7r6+skEgng699PWCwa7BcNisaBaf+3s3HwhaJhkC8UmF/6wJOXiwTnlwi+XuLpqxDP3rwnuPCO4Pxb8z78aRNB03PIahZFy6Hqv2jZPRQti6pl0bM5rt16yNlhH70jfnpGfJwf9dE3dp/LNx/QN+an+/pdHj1fRFBVBUkSUVQNWdFQVB1Z1ZFkFUXTUbUcejbLwPAFHG47PUM3GBzz0z86weC4n4FxP71X79B95TaBF4sIsiKSyaSIx2OsrK4SDi+zvPyR1UiU3XTGLNE0na4eK8eOHqHWXoOnsxdXWyfO9h6c3ot4OvtxtvXhn35cmlBGkjKImTSpVJKt7S1isRiiJCHJCrKioigqw4PtuBos2G0nqKw8Tn1jHQ1uD66WDrxdfbhau7k3OYUgSxKln5ZKAZKELJcKZERRNEmyjKwodLQ2UV9ThbPRgb22FmuVlepqK9XWkzgcp6lvcDIx6UNQFQVJFM0g2QwVf4b/KMjlcgxd6sVVd4pz3jN4m900e9y0NHnwuN00NzXT4fUyPfWAb7da/dXd6mpYAAAAAElFTkSuQmCC'); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n  "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/82e29/microcopy_UI_plural.webp 159w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/ef33f/microcopy_UI_plural.webp 318w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/f1837/microcopy_UI_plural.webp 635w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/29549/microcopy_UI_plural.webp 953w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/c5420/microcopy_UI_plural.webp 1270w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/8cfb2/microcopy_UI_plural.webp 1775w"],"sizes":"(max-width: 635px) 100vw, 635px","type":"image/webp"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"source","properties":{"srcSet":["/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/8b9b5/microcopy_UI_plural.png 159w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/fa108/microcopy_UI_plural.png 318w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/53fb6/microcopy_UI_plural.png 635w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/5a426/microcopy_UI_plural.png 953w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/91155/microcopy_UI_plural.png 1270w","/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/1bfb4/microcopy_UI_plural.png 1775w"],"sizes":"(max-width: 635px) 100vw, 635px","type":"image/png"},"children":[]},{"type":"text","value":"\n          "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/docs/legacy/static/6d6ef6bf66293d9495be01070ee903a9/53fb6/microcopy_UI_plural.png","alt":"Microcopy message with pluralization in UI","title":"Microcopy message with pluralization in UI","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n        "}]},{"type":"text","value":"\n  "}]},{"type":"text","value":"\n    "}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Since different languages have different pluralization rules,\npluralization is defined per language. You can see the full list of\npluralization arguments ("},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":", "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":", "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":", "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" etc.) in the\n"},{"type":"element","tagName":"a","properties":{"href":"https://formatjs.io/docs/core-concepts/icu-syntax/#plural-format","target":"_blank","rel":["noopener","noreferrer"]},"children":[{"type":"text","value":"ICU syntax documentation"}]},{"type":"text","value":"."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"h3","properties":{"id":"selection","style":"position:relative;"},"children":[{"type":"element","tagName":"a","properties":{"href":"#selection","ariaLabel":"selection permalink","className":["anchor","before"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]},{"type":"text","value":"Selection"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"In addition to pluralization options, you can build logic to the\nmicrocopy strings using\n"},{"type":"element","tagName":"a","properties":{"href":"https://formatjs.io/docs/core-concepts/icu-syntax/#select-format","target":"_blank","rel":["noopener","noreferrer"]},"children":[{"type":"text","value":"select formatting"}]},{"type":"text","value":".\nThe current FTW template microcopy does not have an existing example of\nthis pattern, however you can of course modify your code to include this\nformatting as well."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"When you use "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"select"}]},{"type":"text","value":" in the microcopy string, you will need to specify"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"ul","properties":{},"children":[{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"the variable determining which option to use (here: "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"mode"}]},{"type":"text","value":")"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"the pattern we are following (here: "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"select"}]},{"type":"text","value":")"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"the options matching each alternative you want to specify (here:\n"},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"class"}]},{"type":"text","value":" – there could be several options specified)"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"an "},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" option that gets used when none of the specified\nalternatives matches"}]},{"type":"text","value":"\n"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"json"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-json"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":"\n  "},{"type":"element","tagName":"span","properties":{"className":["token","property"]},"children":[{"type":"text","value":"\"BookingBreakdown.description\""}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"{mode, select, day {You are booking the following time span:} night {You are booking the following time span:} other {You are booking the following {unitType}:}}\""}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can then use the microcopy message in the code e.g. with the\n"},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"formatMessage"}]},{"type":"text","value":" function:"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"js"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","comment"]},"children":[{"type":"text","value":"// mode: the types of bookings or products available on the listing page, e.g. class, package, day, night"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"const"}]},{"type":"text","value":" mode "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"'class'"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":";"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"const"}]},{"type":"text","value":" unitType "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"'yoga class'"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","comment"]},"children":[{"type":"text","value":"// For { mode: 'class', unitType: 'yoga class' }, the message will read \"You are booking the following yoga class.\"."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"const"}]},{"type":"text","value":" description "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" intl"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"element","tagName":"span","properties":{"className":["token","function"]},"children":[{"type":"text","value":"formatMessage"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"\n  "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":" id"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"BookingBreakdown.description\""}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":"\n  "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":" mode"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" unitType "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":";"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can use select for cases where you have a predetermined list of\noptions you will encounter that require different microcopy strings."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"h2","properties":{"id":"can-i-have-a-multilanguage-marketplace","style":"position:relative;"},"children":[{"type":"element","tagName":"a","properties":{"href":"#can-i-have-a-multilanguage-marketplace","ariaLabel":"can i have a multilanguage marketplace permalink","className":["anchor","before"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]},{"type":"text","value":"Can I have a multilanguage marketplace?"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Having several language-specific microcopy files enables using a single\napplication for multiple languages. However, editing microcopy in\nConsole only supports one language at a time, so you will need to modify\nany other languages using bundled microcopy files within your client\napplication."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Having multiple languages in a single marketplace may, however, cause a\nproblem in terms of user-generated content. Even though listings and\nuser profiles could include both language versions by saving the content\nof language-specific input fields to a listing's extended data, users\nare rarely capable of providing content for several languages."}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"With email notifications and built-in emails, you would need to save the\nuser's language to extended data and then have an if-statement that\nshows the correct language, for example:"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"js"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-js"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"text","value":"#eq recipient"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"private"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"-"}]},{"type":"text","value":"data"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"language "},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"en\""}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"text","value":"Hello"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"else"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"text","value":"Bonjour"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"{"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"/"}]},{"type":"text","value":"eq"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"}"}]}]}]}]},{"type":"text","value":"\n"},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Read more about what to consider when\n"},{"type":"element","tagName":"a","properties":{"href":"/docs/legacy/ftw/how-to-change-ftw-language/#developing-ftw-into-a-multilanguage-marketplace"},"children":[{"type":"text","value":"building a multilanguage Flex marketplace on top of a FTW template"}]},{"type":"text","value":"."}]}],"data":{"quirksMode":false}},"headings":[{"value":"How microcopy is handled in Flex","depth":2},{"value":"Format for editing microcopy in Console","depth":2},{"value":"Simple argument","depth":3},{"value":"Pluralization","depth":3},{"value":"Selection","depth":3},{"value":"Can I have a multilanguage marketplace?","depth":2}]}},"pageContext":{"slug":"microcopy","category":"concepts-content-management"}},
    "staticQueryHashes": ["3794076007","439097193","717698143"]}