editing your site
As part of the design and development process of your site, there may be dummy text or stock images that you wish to replace. This is really simple and straightforward to do using our intuitive CMS...
site editorWith the site editor you can make any changes to your site, as well as add new elements. On the left hand side of the screen is the 'tools' section in the grey box, and the main view is made up of the live preview of your site.
Your site is made up of many 'elements', which could be text boxes, images or buttons etc, and each of these elements can be edited. As you move your mouse around the screen, these elements are highlighted in blue. Once highlighted, you can 'copy' the element with the arrow tab on the top left of the highlighted box, or 'delete' it with the X tab on the top right. You can also move the element by dragging the middle handle. |
Editing text
Any text you see can be edited, this can be titles, body text and captions. Hover your mouse over the text to highlight it in blue, then click it to enter into 'edit mode', you'll then need to click into the text box, and you can start typing. A tool box will also appear, so you can change the text colour, size, alignment etc. Once you're happy with your changes, click away from the element to exit edit mode. |
images
Images are placed on your website in different ways, these include single images, background images, gallery images, and even slideshows. Here you'll learn how to edit each of them.
Pro tip: To keep your site performing well, make sure your images are optimised for web and saved at 72dpi
|
Single images
Single images are just one image, placed anywhere on the page - usually to accompany text to illustrate the content. Click on the image element to enter 'edit mode', then click on the image to bring up the options dialogue box. From here you can edit the image, replace it, and adjust the parameters. You can click 'edit image' to crop, apply filters and play around with the colours. To change the image click 'replace image' then 'upload photo from your computer' where you can select your own image and replace the existing one. Once your changes are complete, click away from the element to exit 'edit mode'. |
Image gallery
A gallery is a preview grid of images, which when clicked on shows a full size version, and can be scrolled through. The image gallery element has 2 edit modes. You can edit each image and edit the gallery settings. To edit the images, click on the image gallery element to enter 'edit mode', then click on the image to bring up the options dialogue box. From here you can delete the image, add a link, add a caption and move it by dragging it around. Once your changes are complete, click away from the element to exit edit mode. To change the gallery settings, click on the image gallery element to enter 'edit mode', then click anywhere within the element (being sure NOT to click any of the images) to bring up the options dialogue box. From here you can add images, change the columns and adjust other parameters to customise the appearance of your gallery. Once your changes are complete, click away from the element to exit edit mode. |
Image slideshow
An image slideshow allows you to display multiple images in one place, with customisable transitions. To add images, change the order and add links and captions, click on the image slideshow element to enter 'edit mode', then click on the element to bring up the options dialogue box. From here you can add images by clicking 'add/edit photos', which takes you to the slideshow editor. Here you can add images, delete, and caption them by clicking the corresponding icons. You can also change the order by dragging the images. Once you have finished your changes, click 'save' in the top right of the dialogue box. To change the slideshow settings, click on the slideshow element to enter 'edit mode', then click anywhere within the element to bring up the options dialogue box. From here you can adjust the slideshow parameters to customise the appearance of your slideshow. Once your changes are complete, click away from the element to exit edit mode. |
Pro tip" If you move your mouse over the grey bar and scroll down, you'll be able to access even more exciting and useful tools...
|
Adding elementsAll of your site's 'elements' can be found on the left hand side of your builder, in the grey box. Each one is clearly labeled, and can be easily placed on your site. Just drag and drop by left clicking and holing the mouse down on the element you wish to place, move it over to your website preview, and a blue indicator bar will appear. This blue line highlights all the positions your element can be placed. You may wish for it to go above, below, or next to another element. Once you are happy with the position, let go of the mouse and it will automatically align.
|
editing the site structureYour website is made up of a 'header' at the top, 'sections' in the middle, and a 'footer' at the bottom. To edit the properties of each section, just click on the background space. This will bring up a new dialogue box which allows you to edit the background, move, or delete the section. You can also change the size of a section by dragging the blue dot handle at the bottom.
|
Edit the background
Clicking the 'edit background' tab brings up a new options panel. From here you can add and image, colour, gradient, or even a background video. Select the type of background you would like, and if applicable, you can upload your own image or video. Pro tip: enhance your website with our new 'scrolling effect' options found in the edit background dialogue box |
Move a section
You can completely move an entire section including its contents. Click on the background, then click 'move'. You'll then get the option to move the section to a different part of the page you're currently working on by selecting 'move up' or 'move down'. To move the section to another page click 'to another page' and select the page you wish to move it to. Copy a section To copy a section click on the background, then click 'copy', then select the page you wish to copy the section to. Delete a section To delete an entire section including all of its contents, click the background then click 'delete', where you'll get a prompt to make sure you wish to delete everything. If you delete a section by mistake, it cannot be recovered, and your work will be lost. |
Edit the footer
The footer is the very last section of your site, and can be edited by clicking the section. This enters into 'edit mode' and allows you to make all the changes like you would on any other section, only this time when you click the orange 'save footer' button, all the changes apply across all of the pages on your website. |