How do I use Spekit's Rich Text Editor?

SKIP AHEAD TO: Spek View and Edit Settings Use Spekit's Rich Text Editor  What are the key differences with the new editor? New Toolbar Functionality  Image Enhancements How to embed content with iframes  What happened to the Spek Business Process field?  How to add tables to a Spek Table Actions  How to delete a table  How to add a Gif How to Embed a PDF   How to delete a PDF

Learn how to edit Speks and use Spekit's new Rich Text Editor. 

 

Spek View and Edit Settings

1. Copy Content to Clipboard
   • Copy the content of a Spek, including images and videos, to save time rewriting the exact details.
2. Spek Analytics
3. Clone Spek
4. Hide Spek
5. Delete Spek
6. Edit Spek
7. Share Spek
   • You may have 2 share options available: 
     • Users will be able to share the Spek with other Spekit Users
     • Admins have the ability to share Speks internally or externally.

 

Use Spekit's Rich Text Editor

We are launching our Rich Text Editor in Speks. 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 
• Image Enhancements
• Table Actions
• Embedding Content and iframes

 

New Toolbar Functionality 

With the new Rich Text Editor toolbar, you will have the following available functions: 

 

1. Undo 
   • The Ctrl+Z shortcut will work
2. Text Formatting
   • Font Style (Paragraph/Header) 
   • Font Family
   • Font Color
   • Font Background Color
3. Text Emphasizing (Bold, Italics, Underline, & Strikethrough) 
   • Keyboard shortcuts will work here
4. Lists (Bulleted Lists & Numbered Lists)
5. 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.
6. Text Alignment
7. Remove Format
8. Special Characters (Emojis)
9. Insert Table
10. Insert Code Block
11. Insert Block Quote
12. Horizontal Line
13. Hyperlink 
14. Embed PDF
15. 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.

1. Toggle Captions On 
   • You will be able to enter a caption on the image
2. Change Image Text Alternative  
3. Align Image Location (Left Align, Center Align, Right Align) 
4. Resize Image (Original Size, 75% Original Size, 50% Original Size) 
5. 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
• Vidyard
• Wistia
• Box
• Loom
• YouTube
• Vimeo
• Spotify
• Scribe

NOTES:

• 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. 

 

Table Actions

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.

1. Edit Columns
   • Select a Header Column
   • Insert Column to the Left or Right
   • Delete Column
   • Select Column
2. Edit Rows
   • Select a Header Row
   • Insert Row Above or Below
   • Delete Row
   • Select Row
3. 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.
4. 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. 

 

Related Articles

• Spek Overview & Setup
• How do I create Speks?
• Understanding Spek Analytics
• Troubleshooting Speks
• Spek FAQs