HTML formatting
Last updated
Last updated
Common tags you'll need for importing questions and EMQs via CSV
For longer questions, you may need to use paragraphs. To create new paragraphs for new ideas or points, use the <p> element to define a new paragraph. You always need a closing </p>tag at the end of your paragraph.
Use headings tags to have text display as settings <h1> being the largest <h6> being the smallest. You can use line breaks <br> to leave a gap between all html elements.
Use ordered <ol> lists to list from 1 onwards and unordered <ul>lists which display as bullet points show different options in a question. Remember to us <li> tags for each list item
When using images in questions or answer options you'll need to upload them to either a content management system (CMS) or something else that can host your image and create a public permalink that points to that image. There are a few ways to generate these links:
Upload images to an Amazon S3 bucket
Uploading images to Wordpress or other website you have
Modify Google Drive share links (see below)
You will need to modify links from Google Drive in order for them to work on Synap
1) Get a share URL from Drive
Make sure the visibility is set to 'Anyone with the link' and copy that link
2) Modify link
The share URL link structure needs to be modified, see the long string after /d/ that is the {FileID} modify the link
Click here to download an excel template for how to modify Google Drive image links.
🧠 Note: If you don't want to generate image links with any of the methods above mentioned - use the Synap question editor to upload directly onto the platform. When you export these questions links will have been automatically generated by the system.
Any image URL then needs to be used in <img> tags. You can use style elements to alter the width and height. More on HTML images W3 schools
🧠 Note: If you don't want to generate image links with any of the methods above mentioned - use the Synap question editor to upload directly onto the platform. When you export these questions links will have been automatically generated by the system.
Create hyperlinks using <a> tags and the href element for different URLs
Use HTML tags to add emphasis to different parts of text
In HTML, special characters are typically those that can't be easily typed into a keyboard or may cause display issues if typed or pasted into a web page. If you want to use special characters in your questions or answers, you should use either the HTML entity name or the HTML entity number. This will ensure that it displays correctly in most/all browsers.
A Trademark (™) symbol will require special characters, use ™(entity number) and ™ (entity name) will both display The entity name and number will always start with an & and end with a semicolon. To find a full list of special characters you can insert with HTML, try this website.
<p>
Paragraphs
<h1> <h2>....<h6>
Headings
<br>
Line breaks
<ol>
Ordered list (ie 1,2,3...)
<ul>
Unordered list (bullet points)
<li>
List item
<a>
Creates a link
<strong> or <b>
Makes text bold
<u>
Underlines text
<mark>
Highlights text
<i>
Makes text italic
<sup>
Puts characters in superscript (eg powers)
<sub>
Puts characters in subscript
Use HTML preview tools to check your text before you put it on platform or into a sheet - htmledit.squarefree.com
Tutorial sites like W3 Schools to find other HTML tags and when to use them
Always preview your questions before you give access to students!
Not all HTML tags are allowed in the importer or in the question editor. This is to keep your content scalable and accessible for users
