Website User Guide | Web Design & Digital Marketing In Chorley & Bolton

Creating A New Page

Follow the steps and images below to find out how you can create a new page and assign a header slider.

To add a new page simply go to your dashboard and select the pages tab and click the Add New button.
Now give your page a title by filling in the highlighted field.
Your Page Attributes work from preset styles. Here you can select the grid of the structure. If you want the page to be full width then select 100% Width in the Template dropdown options.
To add a large slider to the page you will first need to create a slideshow, you can do this in the below section Add/Edit Slides. Once the slideshow has been created simply select the slider type your using (normally Slider Revolution) and then select the slideshow title that you want to show.

Now that you have learnt how to create a new page and assign a slideshow. You can now start to add text and image content from the sections below.

Add/Edit Text

Follow the steps and images below to find out how you can add your own text.

To add text to your website you’ll need to start off by creating a container on your selected page. Click on the +Container button.
Select how many columns you want. (in the example we have selected 2 containers).
Click on the +Element button.
Search ‘text’ to find the Text Block element.
Select the Text Block element.
Now you can insert your text in the main section.
The bar at top of the main section will allow you to; create headers, use bold & italic fonts, align your text and include hyperlinks.
After you’ve added your text you can now save your progress by clicking the Save button.
To make the changes permanent you’ll have to either Save Draft or Publish. You can also preview the changes before you publish by clicking on the Preview button.
Please see an example of the preview page in the slideshow below.
If you would like to edit, copy, or delete your text block, simply hover over the Text Blockelement and click on one of the following icons. Pen icon to edit, + icon to copy and the trash icon to delete.
You can also edit, copy, or delete the entire container by using the icons in the top left.

Add/Edit Images

Follow the steps and images below to find out how you can upload your own imagery.

To add an image to your website you’ll need to start off by creating a container on your selected page. Click on the +Container button.
Select how many columns you want on your page. (in the example we have selected 2 containers).
Click on the +Element button.
Search ‘image’ to find the Image Frame element.
Select the Image Frame element.
Now click on the Upload Image button.
Here you can select an image that has already been uploaded to your media library or you can upload a new image by clicking on the Upload Files button.
After you’ve selected the Upload Files tab, now you can click on the Select Files button and source the image from your computer.
When the image has been uploaded, simply select it in your media library and click the Insert Into Page button.
Preset Frame Styles can be added to the image including Hover Types. Just select the style and effect in the area highlighted. You can also include a border line around your image and determine the thickness of the line via the Border Size slider.
Additional edits can be applied such as alignment, picture links and image enlargement. To enlarge an image simply click Yes on the Image Lightbox option. Once you have made all edits and are happy to continue, just click Save.
To make the changes permanent you’ll have to either Save Draft or Publish. You can also preview the changes before you publish by clicking on the Preview button.
Please see an example of the preview page in the slideshow below.
If you would like to edit, copy, or delete your image, simply hover over the Image Frame element and click on one of the following icons. Pen icon to edit, + icon to copy and the trash icon to delete.
You can also edit, copy, or delete the entire container by using the icons in the top left.
If you would like to edit, copy, or delete your image, simply hover over the Image Frame element and click on one of the following icons. Pen icon to edit, + icon to copy and the trash icon to delete.
You can also edit, copy, or delete the entire container by using the icons in the top left.

Add/Edit Sliders

Follow the steps and images below to find out how you can add and edit your own slider.

Let’s start by creating a new slider. Click on the New Slider button located at the end. If you only want to edit a slide, then select the slider from this menu and skip to step 8.
Give your slider a title under the Slider Title & ShortCode tab.
To edit the styling of the slider you can select the Layout & Visual tab. This allows edits to the appearance, spinner (loader), mobile view and position.
You can change the arrows and bullet styling on the slider by editing the Navigation tab. This section also allows you to edit slider tabs, thumbnails and other navigation options.
If you would like to apply scroll effects to your slider then click on the Scroll Effects tab and switch on the desired effect.
To adjust your slider for other devices, you can manually edit the dimensions for each device in the Slide Layout section. This uses pixels only so make sure you’re familiar with this size format.
After you are happy with the settings, click the Save Settings button in the top right.
Here you are now in the Slide Editor. This will allow you to create and edit each slide on the slider. First we will need to add a Main Background, which can either be; an image from your Media Library, a video from a YouTube/Vimeo link or it can be a Solid Colour from the colour palette.
After you have chosen your background, it’s time to add layers of text, imagery, video or buttons. This can be done in the section below.
Simply click on the Add Layer button and choose what type of content you would like to add.
In our example we have selected the Text/HTML option from the Add Layer button. This will be a large headline for our slide.
To edit the font size, colour, typeface and thickness, all you need to do is click on the text box and under the Style tab, select the options you wish to change. You can simply drag the text around the slide to your desired position or double click to edit the text.
Again we have added another Text/HTML element in order to create a description piece in the slide.
To add a button click on Add Layer and click on the Button option. Once selected you can change the background, typeface and font colours under the Idle State tab.
You can also edit the hover colours simply click on the Hover State tab and apply changes here.
To change button the text click on the Text tab and edit the field below. To save changes click on an option under the Buttons tab.
To add a button link, select the button on the slide and click on the Actions tab in the top menu. Now select the + > Click > Simple Link and then type in your link.
To Add a new slide onto the slider, just select the Add Slide button to the right. Or you can simply Duplicate an existing slide and edit the content to include new links and messages.
After you are happy with your slide, click on the Save Slide to make the changes permanent.
To apply a slider to your web page, navigate to the page and scroll down to the Fusion Page Options section. Now click the Sliders tab and select Slider Revolution and select your slider.
Here is an example of the slide that we have just created.