SKIP AHEAD TO:
Learn how to use Spekit's new Rich Text Editor.
Use Spekit's Rich Text Editor
We are launching our new Richt Text Editor. It will provide you with an improved Spek creation process and editing experience. Copying and pasting content from other sites should work seamlessly - formatting and numbered/unnumbered lists should be retained.
This is what the new toolbar will look like:
What are the key differences with the new editor?
There is a couple of key differences with this new editor:
New Toolbar Functionality
With the new Rich Text Editor toolbar, you will have the following available functions:
- The Ctrl+Z shortcut will work
- Text Formatting
- Font Style (Paragraph/Header)
- Font Family
- Font Color
- Font Background Color
- Text Emphasizing (Bold, Italics, Underline, & Strikethrough)
- Keyboard shortcuts will work here
- Lists (Bulleted Lists & Numbered Lists)
- Indent (out/in)
- Indent works for lists and non-lists.
Allowed in our RTE: The first line starts with the left-most option, the second line can go in 1 indent, the third line can go in another indent, and you can go back as many as you want.
Not allowed in our RTE: Starting with a list that's indented and indenting multiple times for the second line.
- Text Alignment
- Remove Format
- Special Characters (Emojis)
- Insert Table
- Insert Code Block
- Insert Block Quote
- Horizontal Line
- Embed PDF
- Upload Files or Images
- Accepted file types: ai, bmp, csv, doc, docx, gif, jpeg, jpg, odp, ods, odt, pdf, png, ppt, pptx, rtf, SVG, tif, tiff, txt, xls, & xlsx
NOTE: Images can also be added by pasting directly into the editor, or dragging and dropping from a file folder.
Image Re-sizing and Alignment
We’ve introduced the ability to re-size and align images within the editor. It’s also now possible to add captions to images and hyperlink images to external URLs.
Simply select the image after adding it to the Spek and you will see the image toolbar display with available functions.
- Toggle Captions On
- You will be able to enter a caption on the image
- Change Image Text Alternative
- Align Image Location (Left Align, Center Align, Right Align)
- Resize Image (Original Size, 75% Original Size, 50% Original Size)
- Image Resizing Frame
- Select the image and resize it by clicking and dragging the purple box around the image
- 💡 Pro Tip: If you click on the arrows in the Image Resizing Frame, you will be able to add space above or below the image.
How to embed content with iframes
For the supported web applications, users can simply paste the iframe code (<iframe>embed code</iframe>) directly into the editor, and the video or presentation content will automatically display. Spekit supports the following platforms:
- Google Drive / G-Suite
- Microsoft Stream
- Microsoft SharePoint
- Wistia, Sharepoint, and MS Stream will require iframe code to be pasted.
GSuite embeds will require the published URL or iframe code to be pasted.
- NOTE: To preview Google Drive/Gsuite documents, they must first be published on the web. Click here to learn how to make Google Drive/Gsuite documents public.
- Vidyard, Box, Loom, YouTube, Vimeo, Spotify, and Scribe support iframe code OR sharing URLs.
- The iframe embed URLs will mostly work from unsupported sources but may cause some issues.
1.) Open the video you would like to embed on a Spek.
2.) Find the embed code. This can be found in different places depending on the website, we suggest looking at the share options.
3.) Paste the code directly into the Spek.
What happened to the Spek Business Process field?
We have removed the Business process field from the Spek edit experience, so creators will no longer be able to add content in this separate field.
- What if customers had content in this field in the past?
- Any content that was present in the Business process field has been migrated to the bottom of the Spek description (main) field, under a “business process” header.
- No content will be lost, and to an end viewer, the experience will effectively remain the same.
How to add tables to a Spek
1.) Open the Spek you would like to add a table to.
2.) Click the Table Icon.
3.) Select the size of the table you would like.
NOTE: Tables will be center aligned by default. This alignment cannot be changed.
We've introduced inserting tables into Speks within the Editor!
Simply insert a table into the Spek and you will see the table toolbar display with available functions.
- Edit Columns
- Select a Header Column
- Insert Column to the Left or Right
- Delete Column
- Select Column
- Edit Rows
- Select a Header Row
- Insert Row Above or Below
- Delete Row
- Select Row
- Merge Cells
- Merge Cell Up, Down, Right, or Left
- Merge Cell Down
- Split Cell Vertically
- Split Cell Horizontally
- NOTE: You cannot select multiple cells at once. You have to select a single cell and then use the allowed cell merge actions.
- Table Resizing Frame
- The Table Resizing Frame will allow you to resize from the right side of the table. You will be able to adjust the width of the columns.
- If you click on the arrows in the Table Resizing Frame, you will be able to add space above or below the table.
How to delete a Table
1.) Open the Spek you would like to delete a table from.
2.) Click Edit.
3.) Add a space below the table.
4.) While in the space below the table, backspace to delete the table.
How to add a Gif
To add a Gif to a Spek, you will need to follow the following instructions. You will not be able to copy and paste animated Gifs at this time.
1.) Download the Gif.
2.) Upload the Gif into the Spek by either:
- Uploading the Gif into the Spek
NOTE: Dragging and dropping only works in the Web App (not the extension create modal) due to browser limitations.
- Dragging and dropping the Gif into the Spek.
How to Embed a PDF
1.) Download the PDF.
2.) Open the Spek you would like to upload a PDF to.
3.) Click the Embed PDF button.
4.) Select the PDF, and click Open.
NOTE: PDFs will be center aligned by default. This alignment cannot be changed.
How to delete a PDF
1.) Open the Spek you would like to delete the PDF from.
2.) Click Edit.
3.) Add a space below the PDF.
4.) While in the space below the PDF, backspace to delete the PDF.