Custom HTML & embedding
Custom and inline HTML are available only on some Shorthand plans. To discuss adding these features, please get in touch.
Shorthand allows you to add HTML to stories, enabling the addition of custom components and creation of custom layouts that aren't natively supported by the Shorthand editor.
HTML can be added inline (into any text column), or via a standalone full-width section (Custom HTML section).
INLINE CUSTOM HTML
Inline HTML can be added to text blocks in any section. Content added via inline HTML will usually be confined to the width of the corresponding text column, so it's a good option for when you need the content to fit within a specific context, for instance, in between paragraphs of text or in a grid item.
CUSTOM HTML SECTION
Custom HTML sections behave like any other Shorthand section, for instance, they can be reordered, deleted, linked to, and saved as section templates. Content added to a Custom HTML section will be subject to the full width of the page, which may require more care and coding to ensure that the content fits well within your story design.
TIP: We recommend writing and editing your code in a dedicated code editor (such as Visual Studio Code) and pasting into Shorthand. This will be much more efficient and provide better formatting and debugging options, and you'll also have access to tools and revision tracking that are not available in Shorthand.
If you're embedding content from a third-party and they provide you with a URL for embedding, you can try using that URL with our Rich Embed feature, which may provide better results or be easier to use then embedding code.
For tips on third-party tools to explore, see Other Resources.
Note on responsive design: Whether you're using an embed code for a third-party tool or your own custom coding, please ensure that you thoroughly test how it behaves in your story and that it's fully responsive across screen sizes. You may find Embedresponsively.com helpful in fixing code that isn't responsive.