Add the code to the text on the product’s description field.
Don't worry, you will see the code in the app but on the catalog your customers will see only the customized text.
💡 If you don't like too much information on the screen, separate each feature by line, this won’t affect the final result. To test your code as you go, write it on the W3 Coding Platform and tap on Run to see the final result.
- Use headings to create a hierarchy. Make the code the first item on the sentence and use <h1> your text here </h1> for the largest text. Go up for the smaller texts, like <h2> your text here </h2>, <h3> your text here </h3> and so forth;
- To break lines you need to use <br> at the end of the sentence and if you want more distance, add a second or third <br>;
- To separate the text in paragraphs, use <p> your text here </p>;
- If you use specific fonts, use <font style="font-family: font name here">;
- To change the size of the text, use <font style="font-size: font size here px">;
- If you want your text to be double spaced between words, add <tt> your text here </tt> to it;
- To make the classic text styles, use <b> your text here </b> for bold, <i> your text here </i> for italic and <u> your text here </u> to underline the words;
- Colours can be added to your text by using <font color=" add colour here "> at the beginning of the sentence. You can use the HEX of the colour or its name in English;
- To strike information like prices, add <strike> your text here </strike>;
- You can list items by using <li> your text here </li>. On the top of the list, specify if it is <ol> for numbers ou <ul> for bullet points;
- Emojis or emoticons can be used throughout the text without code, just add them to the text and make sure they are not personalized as they might not be recognized in some browsers;
- GIFs can also be used but they need to be inserted on the code <a><img src="image link here"></a>. To get the image link just right click on it and select Open image in new tab, copy the link and paste it on the code. And remember to make sure it is a free source GIF.
Ready for a test? Copy and paste the text below to a product description in your app or to the W3 Coding Platform to see the code in action. 😎
