How To add Images To Your Website

One of the easiest ways to add some flare to your website is to add images. But how do you add images to your Virteom website? In this article we'll cover all the bases on just that. 

Preparing your image for upload

First things first, we'll need you to prepare your image for upload. There are a few things you should do to your image before uploading your image to your website:

  1. Make sure your image name does not have any spaces in it. We suggest replacing any spaces in your file name with dashes (-) or underscores (_). 
  2. Optimize your image for the web. To keep your website running at top speed, you'll want to optimize your image for web. How do you do this? Use an image optimizer like this one.
     

Uploading your new Image into Virteom Editor

Now that you have prepared your image to be uploaded, you're locked in loaded to upload it to the Virteom CMS. 

  1. Go to your website and log into your Virteom editor.
  2. Once you are logged in go to the page you want to edit and select 'Editor' off the top toolbar.


     
  3. Put your cursor in the editable area at the spot that you would like the image to appear.
  4. On the Virteom toolbar click on the 'Image Tool'. (image icon
  5. Once you click that icon a popup will appear. Click 'Browse Server'
     
  6. On this next step you will want to consider organizing your photos into folders to they do not become a mess over time.  So either select a folder you would like to upload the image into or create a new folder and then select it.  Once you have the folder selected click on 'Upload File'   
     
  7. The file uploaded box will open up. Click on 'Browse File' to upload one or more images. This will allow you to search your computer for the photo. Find it and then click 'Upload Now' at the bottom of the popup screen. This will start to upload your file(s).  Once it is complete it will close and go back to the file browser. You should now see your file in the list. 
     
  8. Select the file you just uploaded by clicking he check mark to the right of the name. 
     
  9. You should now see the screen below. If you are concerned about SEO, make sure to add a description in the 'Alternative Text' field about your photo and then click 'OK'
     

Photo Tips

  1. If you need to modify a photo, just make sure you are in edit mode and double click on the image will reveal the photo dialog. Once you see that repeat steps 5-9 again to replace the image. 
  2. If you want to delete a photo simple select it and hit the delete button on your keyboard.
  3. If you would like your photo to float to the right or left of your image select the 'Align' drop-down as seen on the image above and then adjust your 'HSpace' and 'VSpace' with some padding, adding '20' in each is probably fine.  Then drag your photo around on the screen until it's in the perfect position.
  4. Make sure to save often by clicking on 'Save Content'

 

Want to make sure your image is the right size?

After you've added your photos you may have noticed that when you view the page on your mobile device, it gets a bit stretched out. Click here to read how to resize your images


Revised 8/10/2017

Most Recent

How To Set A Social Share Image for a Page

By Alesha Wireman
May 01, 2020 Category: Learning, Modules, How To

Need to know how to you upload a social share image on your RocketSite? It's easy! You can upload or change a social share image for every individual page on your website in no time!

How to Add, Edit and Delete Photos Using the Masonry Module

By Olivia Justice
March 23, 2020 Category: Learning, Modules

Is your Virteom powered website utilizing the Masonry Photo Module? Adding new photos to your gallery is really simple and even allows you to upload multiple images at one time. The one real advantage of using the masonry module is so that you can display images in groupings or categories on a singular webpage. This allows you to separate images out into different galleries so like photos can appear together. For example:Say youre a landscaper and you have a webpage entitled Hardscapes. You may want to output multiple galleries on this single page to break out each type of hardscape youve done: walkways, patios, pergolas, steps, fire pits, etc. The masonry photo module allows you to accomplish this. You can set multiple categories, and multiple galleries in that one category - all to output on one single webpage. In this how-to article, we explain how to add a new category, add a new gallery, edit an existing category, edit an existing gallery (adding images to an existing gallery), and

How to Create Private Pages with Virteom

By Olivia Justice
August 21, 2019 Category: How To

Sometimes you don't want everypage on your website accessible to the general public. That's why we offer the ability to create private pages that are only accessible to a designated user.

Address

  • Virteom LLC
  • 7017 Pearl Road, PO Box 10
  • Middleburg Heights, OH 44130
  • Come visit us on the 2nd Floor!