Formatting messages with Markdown

What is Markdown?

Our tools support Markdown so that you can control the formatting of your study messages and questions by adding bold or italic text, creating lists, adding links, images and tables.

You can either directly use the Markdown formatting text when editing or you can use the format buttons as a great way to get you started. For each edit function, we have highlighted the appropriate button for you. High five! 

Formatting text and images with Markdown.

Emphasis

This text will be boldStrong_text_final.png

This text will be italicItalic_Final.png

You can combine them  Combined_final_2.png

Lists

Unordered listUnordered_Text_final.png

Ordered listOrdered_text_final.png

ImagesImage_text_2.png

The square brackets allow you to place the Alt Text of the image that you are uploading. This text will not show up in your message/question - only your image will. However, the alt text will display if your image is no longer available.

Example:Example_image.png

Finished product:Image_presented.png

We have now added a brand new Image Manager so that you can add images to all of your studies messages and questions. High five!

When you click the image format button - you will bring up the Image Manager for you to use.

image7.png

There are two ways you can add an image to markdown. You can use an external URL (Make sure this image is hosted for the duration of your study) or you can upload a locally stored image from your computer.

Via external URL:

To use an image URL -  click on the 'By URL' tab and copy and paste a valid URL into the 'Image URL' field and wait for the image to display like below:

image3.png

The alternate text can also be added in the ‘Image alternate text’ field if you would like.

This text will not show up in your message/question - only your image will. However, the alt text will display if your image is no longer available.

image1.pngOnce you’re happy with the image and alternate text, you can click on the 'Insert' button and insert the image tag into the markdown format.

image6.pngYour image will proudly display accordingly when you click the 'Preview' button.

image4.png

Uploading locally stored image on your computer:

To upload an image locally stored on your computer to use in your study’s message / question - select the ‘Upload’ tab and either drag and drop the image into the area or click the 'browse for a file' link to search for an image file stored on your computer to upload.

image9.png

The ‘Images’ tab will now store all of the markdown images you have uploaded for that study.

You can then add these stored images to any further subsequent messages / questions by opening the image uploader for each question and clicking on the 'Select image' button. 

image2.pngYou can also delete your uploaded images out of the ‘ Image’ tab if you wish by clicking on the ‘Delete image’ link.

However, doing so will delete this image out of your entire study. If you have used an image in previous messages / questions and then delete it, it will no longer display in those previous questions.

We provide a handy little warning message to remind you of this - just in case!

Screen_Shot_2017-12-04_at_3.43.00_PM.pngIn the ‘Images’ tab you can edit the alternate text used with the image if you wish. Any subsequent uses of the image will have the new alternate text.

image5.pngIn the ‘Images’ tab you can edit the alternate text used with the image if you wish. Any subsequent uses of the image will have the new alternate text.

Links

The Markdown formatting for links operates in similar way as adding images outlined above! Except in the case of links, the square brackets provide the space for the link text.

Link_2_final.pngTables

You can create tables with pipes '|' and hyphens '-'. Hyphens are used to seperate the header row from the cell rows, while pipes separate each column. You must include a blank line before your table in order for it to correctly display.

Make sure that you have a |---| for every column and that each cell has content in order for the table to display properly.

Table_final.png

Cells can vary in width and do not need to be perfectly aligned within columns. There must be at least three hyphens in each column below the header row.

Table_final_2.png

Here is 3 x 3 example:

EX1.png

EX2.png

Enjoy using Markdown to edit your studies to perfection. If you have any questions then please get in touch with a friendly customer success person at support@optimalworkshop.com

Ask Us a Question

If you couldn't find the information your were looking for within our knowledge base, email your question to support@optimalworkshop.com.