About This Tool

This page is intended to help create HTML for images that are used on our knowledge base.

Image Path Reference

Here is a quick reference to remind you which folder to put your image in.

  • KB Article
    • /kb/<article_id_number>/<image_name_and_extension>

Reminder, images should only use lowercase letters, numbers, hyphens, and underscores in their file names, as well as lowercase file extensions.

Image Description and File Information

Avoid using special characters, other than hyphens and basic punctuation, in this description. It is recommended to use less than 125 characters.

Looks good! This text helps search engines and users with visual impairments.

Do not include the image extension. Do not use capital letters in image names when uploading them.

Looks good!

Only enter a numerical value. Do not enter other characters.

Looks good!

Image Location Details

Only enter a numerical value. Do not enter other characters.

Looks good!

Only enter a SKU. Make sure that your image is in the folder named 'other' under your SKU in Google Drive.

Looks good!

Only enter a page ID. Images must be located in a folder with this ID number, under the 'pages' folder in Google Drive.

Looks good!

Only enter a blog post article ID. Images must be located in a folder with this ID number, under the 'blog' folder in Google Drive.

Looks good!

Image Alignment

Custom HTML

Please do not use these options unless you know what you're doing.

The current class applied to the <img> tag will be removed.

Accepted!

Adds custom CSS to the <img> element. Better know what you're doing!

Accepted!

Adds a width attribute to the <img> tag.

Accepted!

Adds sizes attributes to the <img> element. Better know what you're doing!

Accepted!

The current class of the <div> that is the immediate parent to the <img> element will be overwritten!

Accepted!

Adds custom CSS to the <div> that is the immediate parent of the <img> element. Better know what you're doing!

Accepted!

Image HTML

Image Preview w/Surrounding Text

About This Tool

This page is intended to help create HTML for images that are used on our knowledge base, non-templated product page areas, blog posts, and on landing pages.

Image Path Reference

Here is a quick reference to remind you which folder to put your image in.

  • KB Article
    • /kb/<article_id_number>/<image_name_and_extension>
  • Product Page (Other than the 'Features' tab and image gallery)
    • /products/<sku>/other/<image_name_and_extension>
  • Pages
    • /pages/<page_id_number>/<image_name_and_extension>
  • Blog Article
    • /blog/<article_id_number>/<image_name_and_extension>

Reminder, images should only use lowercase letters, numbers, hyphens, and underscores in their file names, as well as lowercase file extensions.

Image Description and File Information

Avoid using special characters, other than hyphens and basic punctuation, in this description. It is recommended to use less than 125 characters.

Looks good! This text helps search engines and users with visual impairments.

Do not include the image extension. Do not use capital letters in image names when uploading them.

Looks good!

Only enter a numerical value. Do not enter other characters.

Looks good!

Image Location Details

Only enter a numerical value. Do not enter other characters.

Looks good!

Only enter a SKU. Make sure that your image is in the folder named 'other' under your SKU in Google Drive.

Looks good!

Only enter a page ID. Images must be located in a folder with this ID number, under the 'pages' folder in Google Drive.

Looks good!

Only enter a blog post article ID. Images must be located in a folder with this ID number, under the 'blog' folder in Google Drive.

Looks good!

Image Alignment

Custom HTML

Please do not use these options unless you know what you're doing.

The current class applied to the <img> tag will be removed.

Accepted!

Adds custom CSS to the <img> element. Better know what you're doing!

Accepted!

Adds a width attribute to the <img> tag.

Accepted!

Adds sizes attributes to the <img> element. Better know what you're doing!

Accepted!

The current class of the <div> that is the immediate parent to the <img> element will be overwritten!

Accepted!

Adds custom CSS to the <div> that is the immediate parent of the <img> element. Better know what you're doing!

Accepted!

Image HTML

Image Preview w/Surrounding Text

Page ID 47913926720