Inserting images in articles

You can insert images in the body of your Help Center knowledge base articles. When you insert images, they are added as attachments to the article. Large images are automatically resized to fit the width of the article.

Be sure to insert the image, as opposed to copying and pasting the image from another source, to avoid image issues. As an alternative to inserting images directly in your articles, you can host your images on a public file server and link to them.

To insert an image in an article

1. In Help Center, create a new article or edit an existing article.
2. Place the cursor where you want the image to appear.

3. Do one of the following:

   • Drag and drop the image into the body of the article.
   • Click the Insert image button on the toolbar, then click Upload images and select your image.

   

   The image file size limit is 20 MB.

   Images are automatically adjusted to fit the width of the article, using a compression feature within CSS. It’s a good idea to manually resize images that are more than 1600px wide, as the compression might cause the image to appear distorted in the published article. You also might want to manually resize images if you are using Web Widget (see Optimizing images for Web Widget below).

4. Click Insert in the dialog that appears.

   The image appears in your article.

5. Click Save.

If you have a closed Help Center that requires all users to sign-in, article images will appear broken in email notifications sent to users who are following your Help Center. This is a known issue.

Optimizing images for the Web Widget

To make sure the images in your Help Center articles display correctly in the Web Widget, it’s important that the images are added to the article at the desired size.

When Help Center articles are converted for viewing in the Web Widget, the article’s images are stripped of their attributes in the HTML tags (except for the src and alt attributes), and custom CSS rules are ignored. For most images this isn’t a problem, however if the original images are very big they can appear awkwardly large.

Resizing the original image to the size you want, rather than manipulating the size using CSS or width and height attributes, ensures that images will be displayed properly.