Adding an Image to a Web Page in Virteom
This article will explain how to upload an image into your Virteom powered website.
Login
First login to your website. You should see the Virteom administration toolbar at the top. Then click on the page in your site you want to add the image to.
Make Page Editable
Make the page editable by:
1. Clicking on the "Editor" option on the top toolbar.
2. You should see an editable zone, this will have a dotted outline around it. In here you can add text and images to your website.
Focus your Cursor
Place your cursor inside the editable zone where you want the image to appear.
Click on Add Image Icon
Click on the add image icon. It will look like a little photo of a house and it's next to the flag icon. This will open a new window.
Image Properties Box
After you click the icon this image properties box will show up. Now you need to browse for the image that you want to place on the page. Click the "Browse Server" button to browse for an image.
File Browser
Once you click "Browse Server" the Image File Browser will appear. In here you can either select an image that you previously uploaded or you can upload one from your computer to the site. We are going to show you how to upload one from your computer. Click "Upload File".
Upload a File
After you click "Upload File" a new box will appear. This is the file uploader box. To browse for a file on your computer click the "Browse File" box.
Select File(s)
Now go tot he folder on your computer that has the image that you want to upload. You can select one or more images and upload them all at the same time. Once you find the image(s) click the "Open" button to load them into the uploader window.
Verify the Images
All of your images should be ready to upload. When you are ready, click the "Upload" button to get the images to the server.
Find Images
Now that you've uploaded the images, browse to the folder that you loaded the image(s) to and select the image by clicking on the blue check next to the image to select it to insert into the webpage.
Add Alternative text to the image
After you click on the check the dialogue window will show your image. Fill out the Alt text with an image description for better SEO. Then click the "OK" button to finish.
floating images to the right or left
After you load your image in, you may find that you want it to appear to the right or left of your text. In web development, we call this floating an image.
Floating images to the right or left of text is relatively easy in Virteom CMS. When you're on the Image Properties Screen (in the steps prior to this) there is an option for Alignment on the bottom left-hand side of the window.
Floating images to the left
If you would like to float an image to the left, choose 'Left' from the Alignment box.
Floating Images to the right
If you would like to float an image to the right of your text, choose 'Right' from the Alignment box.
adding space
Adding whiteSpace to the left or right of your photo
If you find that the text is too close to the left or right of your photo, add in 'HSpace'. H Space is short for Horizontal space. The number entered into this box goes by pixels.
Adding whitespace to the top and bottom of your photo
If you find that the text is too close to the top or bottom of your photo, add in 'VSpace'. V Space is short for Vertical space. The number entered into this box goes by pixels.
You're Done
Now your image is on the webpage. Make sure to hit "Save Page" to save the image to the webpage. That's it you are done.
Want to know more about images in virteom cms?
Check out How to Add Images and Other Photo Tips by Clicking Here
Want to know how to resize images the right way? Click Here
Article revised 06/26/2018 by Olivia Justice