1. Tithely
  2. Help Center
  3. Sites
  4. Content

Embedding an Image in the Text Area

Updated:

Summary: While using standard Image Blocks is the easiest way to add visuals to your site, you may sometimes want to place an image directly within a paragraph or text area. This advanced guide provides two methods for embedding images inline with your text: uploading the image as a file attachment, or using a direct link from Tithely Media.

Before You Begin

  • ❗ Important Note for Users: This is an advanced technique that requires multiple steps. For most cases, we recommend using a standard Image Block for simplicity. Please contact support if you have any questions.

  • You must have Admin access to your Tithely Site.

  • Your image file should be prepared and saved in a .jpg, .png, or .gif format.

Method 1: Using the File Upload Workaround

This method involves uploading your image to a hidden page on your site to generate a link, which you can then use to embed the image elsewhere.

Part A: Upload the Image to Get a Link

  1. From your Site Admin menu, navigate to Pages.

  2. Create a new, hidden page for your file uploads. You can name it "Image Uploads" or "File Library." Do not add this page to your main navigation menu.

  3. On this new page, add a File Downloads block.

  4. Click Add File Attachment and upload the image file (.jpg, .png, or .gif) you want to embed.

  5. Click Save Page. Your image is now hosted on your site.

Part B: Embed the Image Using the Link

  1. On your "Image Uploads" page, find the file you just uploaded in the File Downloads block.

  2. Right-click on the file name/link and select Copy Link Address.
    copylinkaddress.gif

  3. Navigate to the page and text area where you want to place the image.

  4. Place your cursor in the desired location and click the Insert/edit image icon in the text editor's toolbar.

  5. In the dialog box that appears, paste the link you copied into the Source field.

  6. Click OK, then Save Changes.
    insertimagesource.gif

Method 2: Using Tithely Media

If you use Tithely Media, the process is more direct as your images already have a shareable link.

  1. In your Tithely Media library, locate and click on the image you want to embed.

  2. Right-click on the External Link option and select Copy Link Address.
    Screenshot 2024-07-11 at 11.40.56 AM.png

  3. In your Tithely Site, navigate to the page and text area where you want the image.

  4. Place your cursor in the desired location and click the Insert/edit image icon in the toolbar.
    insertimagesource.gif

  5. Paste the copied link into the Source field.

  6. Click OK, then Save Changes.

Frequently Asked Questions

  • My embedded image is showing as a broken link. This usually means the link was copied incorrectly or the original file was deleted. Double-check that you copied the correct link address and that the image still exists on your "Image Uploads" page or in Tithely Media.

  • How can I resize the embedded image? In the "Insert/edit image" dialog box, you can manually enter a new width or height in the Dimensions fields. Keep the "Constrain proportions" box checked to avoid distorting the image.

Related Articles

 
 

Articles in this section

See more