Sections & Elements

Does FolioWebsites integrate with SHOOTQ?

Yes, FolioWebsites allows for you to integrate your contact form with ShootQ.

Once I delete a section, is there any way to get it back?

No. There is no other way to get it back but to redo it by going through Add Section.

How do I remove the footer mentioning “Folio Websites”?

1.  Please note that this only applies if you are on an upgraded plan. On the Main page, scroll down to the bottom of the page and click on the gear settings located on the lower right corner to bring up the Footer Setting that will appear on the upper left hand side of the screen.

 

2. Under the Footer Settings, select None to remove the footer mentioning “Folio Websites”.

How do I insert a link menu into my website?

1. Go to the main menu, click on the Pages and Menus.

 

2. Click on Add Page.

 

3. After that the Select Page window will pop up on your screen. Click Link.

 

4. Under Pages, in the Display Name textbox, put in the Display Name and URL and hit SAVE CHANGES down at the bottom.

 

 

 

How do I set up my social media links to the correct icon?

1. Scroll all the way down and hover the footer section.

 

2. Hover on the social media and click on it to bring up the EDIT SOCIAL MEDIA window.

 

3. Select from the list of the social media you want to be displayed by the footer.

 

4. Click on the double arrow icon to Browse Footer Style. Each click will display different kinds of style on your social media icon.

 

How do I set up my messages to be direct to a specific email address?

1. On the header menu, click on Contact.

 

2. Hover anywhere on the body of the email section and then click to bring up the contact form.

 

3. Click on the pen icon to bring up the EDIT CONTACT window.

 

4. In the Email Recipient field, put in your email address. Then hit the blue X button to close the window.

Can I add an image as my background?

1. Go to the main screen then hover on the Header and click on the gear icon/settings. You will notice that the HEADER SETTING will appear on the left hand side of the screen.

2. Click on image.

3. Then click on UPLOAD to browse image as your background.

 

What is a column?

Columns defines one of two or more vertical sections of a web page. Websites often view content in multiple columns (like a newspaper). With FolioWebsites, when you put in a column on your web page, you can customize and add in a title, paragraph, photo, map, contact form, button, space and line. Take a look below to see how to add a column to your web page.

 

1. Go to Add Section and click on the columns icon.

 

2. Select the number of columns you would like to add.

 

3. Choose what you would like to add in your new column section.

What is a slider?

A slider is utilize for adding a photo slideshow into a web page. With FolioWebsites, you can add a slider for photos and album. Please take a look below to see how to add a slider to your web page.

 

1. Go to Add Section and click on Slider icon.

 

2. Choose slider and then select which slider you want on your web page.

 

3. When you select “photo”, a list of all albums will pop-up on the right hand side of your screen.

 

4. Click on the album title and select one or more photo to display to your slider and go to another album and select another photo.

 

5. When you select “album”, a list of all albums will pop-up on the right hand side of your screen. This time, you will select one or more album you want to display to your slider.

What is a separator?

A separator is commonly used to visually separate sections on a web page. With Foliowebsites, you can either put a space or add a line separator to enhance the look of your web page. Take a look below to see how to add a separator to your web page.

 

1. Go to Add Section and click on the “separator” icon

 

 

2. Choose and then select the separator you like to add on your web page. (space or line)

 

How to add a title and customize?

 

1. When you want to add a Title on your page, click on Add Section icon   and select Column.

 

 

2. Select a Column and click on your choice.

 

 

3. A Column will be added on the page. Click on the Column custom section to bring up the elements.

 

 

4. Click on Title.

 

 

5. Type in your title and click on the formatting toolbar to customize.

 

How to add a Video?

1. To add Video on your page, click on Add Section icon   and select Column.

 

 

2. Select a Column and click on your choice.

 

 

3. A Column will be added on the page. Click on the Column custom section to bring up the elements.

 

 

4. Select and click on Video.

 

 

5. Click on the link and paste the URL of the video you want to show on the page.

 

How to add a Photo?

1. To add a photo on your page, click on Add Section icon    and select Column.

 

 

2. Select a Column and click on your choice.

 

 

3. A Column will be added on the page. Click on the Column custom section to bring up the elements.

 

 

4. Select and click on Photo.

 

 

5. Click on the upload here and choose from the photos you have saved on your computer.

 

How to add a Button link?

1. To add a Button link on your page, click on Add Section icon  and select Column.

 

2. Select a Column and click on your choice.

 

3. A Column will be added on the page. Click on the Column custom section to bring up the elements.

 

4. Select and click on Button.

 

5. You can rename the button itself, browse button style and choose alignment. You can edit the link with a website URL.

 

6. You can also edit the button with a page on your site. Click on the page set as the link.

 

7. You can upload file (jpeg,gif,png) for the button to view images.

 

8. Lastly, you can also add a button link for email.

How to add a Paragraph?

1. To add a Paragraph on your page, click on Add Section icon  and select Column.

 

2. Select a Column and click on your choice.

 

3. A Column will be added on the page. Click on the Column custom section to bring up the elements.

 

4. Click on Paragraph.

How to add a Contact Form?

1. To add a Contact Form on your page, click on Add Section   icon and select Column.

 

2. Select a Column and click on your choice.

 

3. A Column will be added on the page. Click on the Column custom section to bring up the elements.

 

4. Click on Contact Form.

How to add a Map?

1. To add a Map on your page, click on Add Section icon   and select Column.

 

2. Select a Column and click on your choice.

 

3. A Column will be added on the page. Click on the Column custom section to bring up the elements.

 

4. Click on map.

How do I adjust the spacing of my header, footer and other sections?

1. Hover over your selected section and click on the Settings button in the upper right-hand corner.

 

2. Under HEADER SETTINGS, drag the Top Spacing and Bottom Spacing scales until you reach the spacing you desire.

 

3. Alternatively, you can directly type in the numerical amount of spacing you desire.

How do I duplicate or copy a text, image, video, or other elements?

Click on your selected element and click on the Duplicate button the two overlapping squares icon.

To duplicate a Text section:

 

To duplicate an image/photo section:

 

To duplicate a video section:

How do I rearrange the order of my columns?

1. Hover over your selected section and click on the Swap Columns button.

 

2. Click and hold onto the column you wish to move.

 

3. You are able to relocate the column into the areas bordered with blue lines.

 

4. Drop the column onto your chosen area.

How do I create a Pricing page?

1. On the main menu, click on Pages and Menus.


2. Click on the Add Page button near the top left-hand corner.


3. Click on Services.


4. Choose the layout you prefer for your Pricing Page.


5. Click on a text box within a section and type in a description of your service.


6. Once you’ve finished your description, click on the Add Element button on the rightmost side of the section tab - depicted by the icon of a plus sign inside a blue square.


7. Choose the column containing your service description.


8. Add a Button.


9. You may customize the Button text to fit the action that you want it to take.


10. You can link an existing Contact page from your Folio website to lead clients or customers to you. Do this by clicking Select from Pages and typing in the page name. You can repeat this process for your other services on the page.



11. You are able to change the page name to Pricing.

How do I duplicate or copy a slider, gallery, or custom section?

1. Hover over your selected section and click on the Duplicate button.


2. The duplicated section will appear directly below the original one.

How do I resize my logo?

1. Hover over the logo you wish to resize.


2. Hover over the resize button, depicted by the icon of two white arrows inside a blue circle.


3. This will bring up the current size of the logo.


4. Click and drag the resize button as needed.

How do I resize an image or photo on my website?

1. Hover over the image or photo you wish to resize.


2. Hover over the resize button, depicted by the icon of two white arrows inside a blue circle.


3. This will bring up the current size of the image or photo.


4. Click and drag the resize button as needed.

Tips on How to Design an Engaging About Page

 

1. Start by clicking on Pages & Menus under the main menu, and click on ADD PAGE. Choose About.

 

2. Choose the layout you prefer for your About Page.

 

3. Start designing your page to your liking. Make use of columns to be able to add images, videos, text descriptions, and more. Select the Element you want for the individual columns as you go about customizing the page.

 

4. Let’s add a sample gallery to our photographer’s About Page. To do this, click on the ADD SECTION button – the “+” icon inside a blue circle – at the bottom right-hand corner. Choose Slider, then Photo.

 

5. Once the Photo Slider section appears, click on the Select Photos button, depicted by a camera icon, on the section tab. Select which of the existing images on your website builder you would like to feature in your gallery.

 

6. You can change the layout of any of your sections by clicking on the Browse [Section] Style button to the right of the section tab. In this case, let’s explore a few of the different layouts available for your Slider.

 

7. Your gallery is now ready to go! Notice now that there is no space between the Photo Slider column and the Custom column above it. To add space, click on the ADD SECTION button again and choose Separator. You can choose either Space or Line. You can adjust the amount of separation between sections by dragging the blue icon at the bottom of the Separator Section.

 

8. If you wish, you can also rearrange the order of the sections on the page. You can do this by dragging the section from either the dotted icon or the name of the section. Both can be found on the leftmost end of the section.

 

9. Now let’s add a video to the About Page. Create another column by clicking on ADD SECTION and choosing Columns. It’s always a good idea to keep your page dynamic by adding variety in the designs of the different sections. This time, let’s choose the One-Third option for our new column.

 

10. Let’s add a text description on the left column by adding a Paragraph element, and link a video on the right column by adding a Video element.

 

11. Click on Link Video and copy-paste your video’s URL into the given text box. You are able to adjust the size of the video by dragging the Video Size scale below the link.

 

12. Continue to customize and build on your About Page by exploring the different sections and elements available to you.

How do I Adjust the Section Background Image?

1. Hover over the section of your choice and click on Settings – depicted by the gear icon – to the right of the section tab.

 

2. Head to GALLERY SETTINGS on the left-hand side, scroll down, and hit the toggle for Background Image. Drag-and-drop an image, or click on Upload Image to choose your background image.

 

3. Click on any part of the image in the GALLERY SETTINGS menu to serve as its focus point.

 

4. You can change the Scaling of your image to Fit, Fill, or Tile.

 

5. You can add a Color Overlay to your background image. Select the color of your choice, and adjust its transparency by adjusting the tiled scale.