FolioStop Help

Your menu is the way in which users of your website can navigate through your various pages or sections. This menu is represented in the PAGES section of your main edit window by a series of icons representing the different page or menu section types. 

You can reorder your menu, rename the various pages, add text pages, image galleries, movie galleries or audio galleries by simple drag and drop of the various icons in the main edit window.

Below is a description of what each icon represents:

 

Text Page Icon - represents a page that can only display text.

Multimedia Page Icon - represents a page which can display text, image, video, and audio all on the same page.

Image Gallery Icon - represents a page that displays single or multiple images.

Movie Gallery Icon - represents a page that displays single or multiple movies.

Audio Gallery Icon - represents a playlist which will be displayed on your website in a special 'juke box'.

Folder Icon - represents a menu heading. Further icons can be placed inside the folder so they appear under the same heading on your website.

Once in place, these pages and folders constitute the menu structure. This is found in the PAGES section, and can easily be rearranged by drag and drop.

In order to add a new page to your website, open the PAGES tab at the top of the main FolioEdit window as shown:



Drag the relevant icon from the bottom of the main edit window into the area above. To name the menu item, double click the current name and replace it with the new one. This name will appear as a menu heading on your website.

Unwanted pages in your menu can simply be dragged into the waste bin in the bottom right of the main edit window.

NB: You will need to hit SAVE CHANGES once you are happy with your new menu structure and then refresh the website in order to see the updated website.

It is advisable to keep your menu as well organised as possible in order to facilitate user navigation, and using folders is a good way of doing this.

Menu items placed within a folder will appear on your website under that folder's heading. For example, a folder titled 'Illustrations' could then contain various different sub-headings entitled 'Children's illustrations', 'Comic book', '3D' etc...

In order to add a new folder to the menu drag the folder icon -  - from the bottom of the Main FolioEdit Window in to your menu structure. Double click the page title in order to rename it.

As always, when you have created your menu headings and sub headings click SAVE CHANGES and refresh.

In order to add a new text page to your menu, open the PAGES tab at the top of the main FolioEdit window and drag the text page icon -  - from the bottom of the window and drop it into your menu.

Once you have added text pages to your menu and saved changes, you can then add text to the text page. Double click the text page icon -  - (not the page heading itself) representing the page you wish to edit. This will open the text editor window for that page as shown below:

INSERT SCREEN HERE
 

Text can either be typed in directly, or pasted from another document. Existing text can be edited or deleted as you wish.

Text can be styled using the tools at the bottom of the text page edit window. You can select fonts, different font sizes, font colour, bold or italic styling and set text alignment.

You are also able to set a text style, enabling you to use these styles whenever you are adding text. Please see Text Styles.

NB: If you edit the style of the text after setting the text style, the default text style set will no longer apply to the text on this page.

You can add four different types of links:

External - to a page on a completely different website.
Internal - to another page on your website.
Email - if you wish people visiting your website to email you.
File - download files from your website

External

To add an external link, highlight the word(s) you wish to make into a link, and hit ADD/EDIT LINK.
 
Enter the URL into the field labelled 'http://'. NB make sure you don't enter the 'http://':

Internal

To add an internal link, highlight the word(s) you wish to make into a link, click ADD/EDIT LINK, choose the 'Internal link' option in the link window and choose the page on your website you wish the link to take you to:

Email

To make an email link follow the steps above but choose the EMAIL option in the link window. Then add the email address, and a subject if you wish:

File

To make a file link, which will allow visitors to your website to download files (e.g CV.pdf, Image.jpg etc), you will need to first upload a file by opening the FILES tab in the main FolioEdit window as shown below:




Click the ADD button and select the file you wish to upload. Once uploaded, this file will be stored in your account.

To create a link in your text (i.e 'Click here to download my CV'), highlight the word(s) you wish to make into a link, click ADD/EDIT LINK, choose the 'FILE LINK' option in the link window and then choose the file you want to link to:




When you have selected the file you wish to link to, hit SAVE.


You are able to style the links individually in the link window, or set a default style by setting a TEXT STYLE.

When you have entered your text hit SAVE.

An image gallery is a page that displays one or many images which visitors to your website can browse.

To upload images, it's necessary to add an image gallery to your menu. Open the PAGES tab at the top of the main FolioEdit window and drag a new image gallery icon -- from the bottom of the main edit window into your menu structure. Double click the image gallery icon to open the gallery editor as shown below:




To add images to your gallery, drag and drop your images directly into the gallery window. They will reduce into thumbnails, which can then be reordered by drag and drop. Hit SAVE CHANGES when you are happy with the contents and order of your gallery.

To delete an image, drag its thumbnail to the wastebin at the bottom of the gallery window.

 

Editing Individual Images

Each image can have a title, caption and some info text. To access all of these settings, double click on the image thumbnail that you want to edit. This will open a new window as shown below:

 

INSERT SCREEN HERE

 

Title
Be sure to set the title of your image. This affects the name of the page that represents this image and will form the url address of this page. It is important for search engine optimisation.

Caption
Each image can have a caption associated with it, which will appear when the mouse hovers over the thumbnail. To add a caption to an image, double click on the thumbnail in the image gallery and add the caption in the caption box.

Info
Each image can have info text associated with it. This text will sit alongside the image when someone browses your gallery. To add image info, double click on the thumbnail in the image gallery and add the information in the info box.

 

Image Gallery Browsing Options

Each gallery can be browsed in one of three ways:

Thumbnails - small representations of each image in a scrollable row
Arrows - next and Previous image arrows
Numbers - numbers representing each image in a scrollable row

For instructions on how to choose your browsing method please see the Show Advanced section.

A video gallery is a page that displays one or many videos which visitors to your website can browse.

To add videos to your site, first create a video gallery in you menu by opening the PAGES tab at the top of the main FolioEdit window. Now drag a new video gallery icon -  - from the bottom of the main edit window into your menu structure. Double click the video gallery icon to open the video editor as shown below:





Once this new window has opened, you can drag and drop videos from your computer into the video editor.

NB: videos must be in .flv format. No other video formats will be accepted. If your videos are in another format such as .mov or .mpeg, you will need to convert them to .flv format before you can add them to your site. Click here for more information about converting your videos to .flv format.

Once dropped into the video editor, each video is represented by a thumbnail. Each video is given a default name based on a timestamp and this shows on the thumbnail. You can (and should) edit the name as described later.

If you have more than one video you can drag and drop the thumbnails to re-order the videos. Hit SAVE CHANGES when you are happy with the contents and order of your gallery.

To delete a video, drag its thumbnail to the wastebin at the bottom of the gallery window.

 

Editing Individual Videos

Each video can have a title, caption and some info text. To access all of these settings, double click on the video thumbnail that you want to edit. This will open a new window as shown below:

 

INSERT SCREEN HERE

 

Title
Be sure to set the title of your video. This affects the name of the page that represents this video and will form the url address of this page. It is important for search engine optimisation.

Caption
Each video can have a caption associated with it, which will appear when the website visitors mouse hovers over the thumbnail (only visible when thumbnail browsing is selected). To add a caption to a video, double click on the thumbnail in the video gallery and add the caption in the caption box.

Info
Each video can have info text associated with it. This text will sit alongside the video when someone browses your gallery. To add video info, double click on the thumbnail in the video gallery and add the information in the info box.

 

Video Gallery Browsing Options

Each gallery can be browsed in one of three ways:

Thumbnails - small representations of each video in a scrollable row
Arrows - next and Previous video arrows
Numbers - numbers representing each video in a scrollable row

For instructions on how to choose your browsing method please see the Show Advanced section.

Creating a video thumbnail

We have created a very simple system that allows you to choose a thumbnail for your video which your website visitors will see when browsing the gallery. To create a thumbnail for a video, double click on the thumbnail in the video gallery, click on PLAY to play the video, and when you get to the frame you want to use, Click on CHOOSE THIS FRAME. This frame will then be applied as the thumbnail for this video.

NB: only when using thumbnail browsing will this thumbnail be visible.

An audio gallery will appear as a 'juke box' style window on your website. This can contain a list of tracks which visitors to your website are able to browse and control (volume, play/pause etc).

To add audio to your site, first add an audio gallery to your menu. To do this, open the PAGES tab at the top of the main FolioEdit window and drag a new audio gallery icon -  - from the bottom of the main edit window into your menu structure. Double click the audio gallery icon in the menu structure to open the audio gallery editor as hown below:




You can drag your mp3 tracks directly into the gallery window. They will reduce into thumbnails, which can then be reordered by drag and drop. Hit SAVE CHANGES when you are happy with the contents and order of your gallery.

NB: audio tracks must be in mp3 format. You will not be able to add audio tracks that do not have a .mp3 file extention. Click here for more information about converting your tracks to .mp3 format.

To delete a track, drag its thumbnail to the wastebin at the bottom of the audio gallery window.

 

Editing Individual Tracks

Each track can have a title, artist name and some info text. To access all of these settings, double click on the track thumbnail that you want to edit. This will open a new window as shown below:

 

INSERT SCREEN HERE

 

Title and Artist Name
The title and artist name that you give to your track will appear in the music player and acts as the link that visitors to your website click to listen to that track.

Info
Each track can have info text associated with it. This text will sit alongside the track when someone browses your music player. To add track info, double click on the thumbnail in the audio gallery and add the information in the info box.

A multimedia page is a page which will allow you to display images, movies, text and sound, in any order, on the same scrollable page.

In order to set up a multimedia page, open the PAGES tab at the top of the main FolioEdit window and drag a multimedia page icon from the bottom of the menu edit window and place it in the menu structure. Once placed, save changes, double click on the icon and your multimedia page will open, as shown below:

 

INSERT SCREEN SHOT HERE

Adding Text

With the window open as above, text can either be typed in directly, or pasted from another document.

Text can be styled using the tools at the bottom of the window. You can select fonts, different font sizes, font colour, bold or italic styling and set text alignment.

You can create links in your text and you can use Text Styles to easily change the formatting of the text you enter.

Adding Images, Video and Audio

Images, Video and Audio can be added at any stage by simply clicking the ADD IMAGE, ADD VIDEO or ADD AUDIO buttons at the bottom of the window. When these buttons are clicked, a placeholder will appear:

INSERT SCREEN HERE


Click this placeholder and then drag and drop your file(s) from your computer.

These placeholders act in the same way as the normal image, video or audio gallery editing windows do, allowing you to reorder, delete and edit individual images, videos and tracks.

Your multimedia page content can be reordered by either cutting and pasting the text or selecting the placeholder you want to move and using the UP and DOWN arrows at the bottom of the placeholder to move it above or below the adjacent section.

Once you're happy with your content, hit SAVE CHANGES.

FolioEdit allows you to upload documents and files to your account in order that visitors to your website can download these from your website pages. This feature is useful to those who wish to have their CV as a downloadable document, for example.

Common files which can be uploaded include PDFs, Word docs, JPEGs etc. In order to upload a file and make it available to your website visitors, open the FILES tab in the main FolioEdit window as shown below:



Click the ADD button and select the file you wish to upload. Once uploaded, this file will be stored in your account. Once you have uploaded the file, it is time to choose the method with which you want visitors to download it from your site.

Links in your text

To create a link in your text (i.e 'Click here to download my CV'), highlight the word(s) you wish to make into a link, click ADD/EDIT LINK, choose the 'FILE LINK' option in the link window and then choose the file you want to link to:




When you have selected the file you wish to link to, hit SAVE.

Graphic Layer Links

Another way of linking to your file to enable your website visitors to download it, is to create a foreground image layer and turn this into a 'clickable layer'. For instructions on how to create the foreground layer, please see Image Layers: Background, Content and Foreground

Once you have created the foreground image layer, this can be edited in order that it can be clicked as a link. To do this, click PREVIEW AND EDIT LAYER (only possible once you've saved the image) and the following screen will appear:




Select 'Link' under the Mouse click/rollover options, click ADD/EDIT LINK and in the window that appears, choose the 'FILE LINK' option and then choose the file you want to link to:




When you have selected the file you wish to link to, hit SAVE.