Adding a Photo to a Content Area

Adding photos to your content is an important part of putting together an attractive, engaging website. The content editor on SCRUMPY enables you to add images in a number of ways alongside other images, videos, tables, links and text.

Adding an Image

It's easy to add an image within a content page, first start by clicking the area that you would like to insert it - whether this is in between two paragraphs or at the end of your passage of text.

Next, you'll need to select the Image icon from the toolbar - this looks like two mountains and the sun within a box. Clicking this will open a small new window with the title Image Properties. You will notice that the URL field is empty and highlighted blue, click the Browse Server button to the right of this to continue.

After you've clicked on Browse Server you'll be presented with a window where you choose from images you've previously uploaded, or can choose to upload a new image. To upload a new image just click Upload and then select the file from your computer. 

After you've selected your image and pressed OK you should see that the image has successfully uploaded and will be with any other previously added images - simply click the one you'd like to use.

After selecting an image you'll be taken back to the Image Properties window, clicking the green OK button will add the image to the content area.

If you'd like to make further amendments and customise the image you have just added, just double click it to reopen the Image Properties window, to be able to adjust the following:

Alternative Text (Alt Text)

Search Engines use Alt Text to help figure out what an image contains, and to help achieve good search engine positioning, it's important to supply a description of your images within content areas. You can add Alt Text from the Image Properties window, it sits just underneath the URL tab and above the Preview of your image.  

Advisory Title

Whilst Alt Text gives content to an image in the background, an Advisory Title is visible to users on the front end and displays when your cursor hovers over the image. So if you'd like to provide a small caption to your pictures, you can use the Advisory Title field to add one. Simply double click the image from the editor, go to Advanced, and enter your text into the Advisory Title field. 

Full Width Images

There may be times when you want an image to completely fill the content area, and span from one side of the page to the other. From within Image Properties, select the Advanced tab in the top right corner. At the bottom, you'll see the Style field - insert 'width: 100%' and press the green OK button. This is preferable for landscape or banner images.

Image Alignment

You may wish for your image to sit in a particular place in relation to other content like written text. The Alignment dropdown in the bottom left corner will show as <not set> by default, just click to be able to choose Left or Right and to change where the image will be displayed on the page.

Deleting an Image

To remove an image from a content area, you need to first click and select it. Next, simply press the Delete or Backspace button on your keyboard.

As when making any amendments in content areas, always click the blue Update Content button in the bottom right corner to save any changes.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us