Skip to main content

HTML

There are two formats in Snippety that allow you to paste the formatted text: Rich Text (RTF) and HTML. Both offer a preview. RTF is simpler as it provides an easy-to-use editor and a preview in the Live Template. On the other hand, HTML is more flexible and allows you to use the full power of HTML and CSS. You can use it to create complex layouts and styles.

HTML Preview​

Snippety supports both code syntax highlighting and HTML preview, so you can see the final result of your snippet as you edit it. You can enable it by clicking on the HTML Preview button in the editor. The preview is also supported on the snippets list and in the full screen preview.

Use the CMD + Shift + H shortcut to quickly toggle the preview.

Compatibility With Other Applications​

When using HTML, Snippety will set two formats in the clipboard: HTML and plain text with the raw code. The HTML format will be used when pasting into applications that support HTML, otherwise the plain text format will be used.

When using RTF, Snippety will set three formats in the clipboard: RTF, HTML, and plain text. Most applications will use the RTF format, but if the application doesn't support RTF, it will fall back to HTML. The HTML is generated automatically from the RTF. If you need more control, you should use HTML directly.

Conversion Between RTF And HTML​

Snippety allows you to convert between RTF and HTML. You can do this by simply changing the format in the editor.

It can be useful to quickly design the snippet using the RTF editor and then convert it to HTML for more advanced styling. You can also use the HTML editor to create the snippet and then convert it to RTF for easier editing.

Images​

When you convert from RTF to HTML, Snippety will automatically convert the images to base64 format. This allows you to use images in your HTML snippets without worrying about the file paths. The images will be embedded in the HTML code and will be displayed correctly when pasting into other applications.

Placeholders​

You can use all placeholders in HTML as usual.

When HTML preview is enabled, placeholders are displayed as 🔤 and key simulations as ⬇️.