Uploading files to your website

You can upload image and text files in all common formats for use on your website. Shopify stores your file uploads in the Files page of your admin.

Basic procedure

Files page channels

To add image and text files to your product or collection descriptions, website pages or blog posts:

  1. Upload the file to your Files page.
  2. Insert the uploaded file where you want it to appear on your website.

Uploading files to your admin

You will need to upload files to the Files page before you add them to blog posts, products, collections and pages. To upload:

  1. From your Shopify admin, click Settings, and then click Files.

  2. Click on Upload files.

    Add file 3
  3. You have the option of either uploading each file one at a time or in bulk. To upload one file, navigate to and select the file you want to upload. Click Open.

    To upload bulk images, locate the files you want to upload and joint select them by holding down the Cmd key (Mac) or Ctrl key (Windows). Click Open.

Note

  • Shopify accepts .jpg, .png, and .gif image files. If you upload .svg files, they will be converted to .png.
  • Assets and uploaded files must be smaller than 20mb. If you get an error when trying to upload a new file, check to make sure it doesn't exceed this size limit.

Uploading files to your root folder

It is not necessary to upload any file to the root folder of your site.

To verify your website with a third-party service such as Google Webmaster Tools, you don't need to upload a file to the root folder of your website. Shopify recommends using the meta tag method.

Add image files to your product or collection descriptions, pages, or blog posts

  1. On any of these pages, locate the Rich Text Editor.
  2. On the Rich Text Editor, you will see a small toolbar. Hover over each button in the toolbar until you come across one with the text: "Insert image." Click this button.

    Add image 1
  3. You can insert your image in one of three ways:

    • Uploaded images: Select one of the images that you uploaded. These are the images that are stored in the Files section of your admin.
    • Product images: Select one of the images that you gave your products. These are the images that you associated with your product when you created it.
    • URL: Input the URL to your product image. Your product image must already be up on the Shopify servers. You can copy the URL from your Files page in your shop admin.
  4. Once you have chosen the way you want to upload your image, click Insert image.

Add text files to your product, collections, pages and blog posts

  1. From your Shopify admin, click Settings, and then click Files.

  2. In the URL column, find the text file that you want to add to your product, collection, page or blog post. Copy the URL (Cmd + C for Mac users, or Ctrl + C for Windows users).

  3. Navigate to the appropriate Products, Collections, Blog posts or Pages. On their information page, locate the Rich Text Editor.

  4. In the Rich Text Editor, type in the text that you want to appear to direct customers to your link. For example, "Click here to download our sizing chart."

    Add text 2
  5. Highlight this text by taking your mouse and holding the right-hand button down as you drag it across the text.

    Add text 3
  6. In the Rich Text Editor, you will see a small toolbar. Hover over each button in the toolbar until you come across one with the text: "Insert link." Click this button.

    Add text 4
  7. In the Link to editable text field, paste the link that you copied (Cmd + P for Mac users or Cntrl + P for Windows users), and then click Insert link.

  8. Your text should look like it is linked (by changing to blue and being underlined.)

    Add text 6

Insert downloadable PDF or Microsoft Word documents

Here's how you insert a link to a .pdf or a Microsoft Word document in your content:

  1. Upload the file to your Uploaded Files page.

  2. Once you have successfully uploaded your file, copy the URL of your document.

    Note

    The URL must begin with http://cdn.shopify.com/ and not http://static.shopify.com. If you see http://static.shopify.com, replace that with http://cdn.shopify.com.

  3. Choose where you want to add your pdf file (it may be to a page or to a product page).

  4. In the Rich Text Editor, highlight some text in your content and click on the Link button in the Rich Text Editor bar:

    Insert pdf

  5. Paste the URL of the document into the URL field:

    Note

    In the URL field http:// is already typed in. Paste your URL over that text. You don't want to have an URL that begins with http://http://.

  6. Save your changes.

Searching for a file

You can search for any file from the Files Settings page. In addition to searching for a filename, you can also search for files of a certain type, such as .jpg or .pdf. This is useful if, for example, you want to update all your product image files.

To search for a file or file type:

  1. From your Shopify admin, click Settings, and then click Files.

  2. In the Search bar:

  • type all or part of a file name
  • type the file extension you're looking for (for example, .jpg or .pdf.)
  1. Files that match the search are displayed in A-Z order under a new tab. You can click Save this search to preserve the results.

Filtering your file list

Your file storage space is not unlimited, so it's a good idea to maintain your file list regularly. In particular, you should make sure you're not storing large files that you no longer need:

  1. From your Shopify admin, click Settings, and then click Files.

  2. Click the Filter files drop-down menu.

    Filter dropdown
  3. Leave the first filter menu unchanged (MB is the only option). In the second and third filter menus, set:

    • greater than or less than
    • a size limit (lower or upper).
  4. Click Add filter:

    Add filter button

All the files that match your filter are displayed.

Changing the sort order of displayed files

By default, files are shown in descending order of creation, which means the most recently-created files are shown first, and the oldest last.

If you want to change this, you can sort your files by alphabetical order or by size.

From the displayed list of files, click on:

  • File to sort the files in alphabetical name order (that's A to Z.)
  • Size to sort the files by size, from largest to smallest.

To reverse the sort order, click on File or Size again.

Edit uploaded image files

You can edit your uploaded images using Aviary. Aviary is a simple photo-editing software that is available through your Files page.

  1. From your Shopify admin, click Settings, and then click Files.

  2. Click on the link to the image you would like to edit.

  3. Click on the Edit button:

    Edit 1

  4. Use the Aviary toolbar to make changes to your image. The Aviary editor allows you to:

    • Crop: The crop tool allows you to cut out excess area of an image.
    • Resize: The resize tool allows you to enlarge or shrink an image. This tool is useful for making small adjustments to an images' size. This tool should not be used to create a significantly larger image.
    • Reorient: The reorient tool adjusts the orientation of the image.
    • Red eye: The remove red eye tool mutes the reddish tint in photos.
    • Blemish: The remove blemish tool can tone down the look of spots, wrinkles and other imperfections in a photo.
    • Saturate: The saturate tool is used to enhance colors in a photo.
    • Brightness: The brightness tool is used to make an image in the photo look like its radiating light.
    • Contrast: The contrast tool shows the difference between color and light in part of an image.
    • Draw: The draw tool allows you to draw on your image.
    • Text: The text tool allows you to add text to your image.
    • Whiten: The whiten tool allows you to lighten areas.
    • Effect: The effect tool adds a filter to the image.
  5. After you are done editing your image, click Save.

Edit text files

You will have to edit text files externally and re-upload them to Shopify.

To edit your uploaded text file:

  1. From your Shopify admin, click Settings, and then click Files.

  2. Click on the link to the text file you would like to edit. The file will be downloaded. Save it somewhere on your desktop.

  3. Make all of the necessary changes. Then, follow these steps to upload your file.

Delete files one at a time

  1. From your Shopify admin, click Settings, and then click Files.

  2. Locate the file you would like to delete

  3. Click on the trash can icon next to the file URL.

  4. A confirmation message will appear. Click Delete.

Delete many files at once

To delete many files at once, click the Bulk actions button. Bulk actions let you do the same action to many files at once.

Want to discuss this page?

Visit the Shopify Community

Ready to start selling online with Shopify?

Try it free