GETTING STARTED WITH FishNET

WELCOME TO FishNET. BUILD AND EDIT YOUR OWN PROFESSIONAL WEBSITE. CLEAR, READABLE, RESPONSIVE AND USER-FRIENDLY.

DISCOVER, LEARN AND CREATE WITH THE FishNET TUTORIAL IN JUST FOUR STEPS:

PLAN YOUR SITE, SITE SETUP, CREATE YOUR PAGES AND EDIT CONTENT.

STEP 1  |  Plan your site

 

Creating a successful website requires some planning. Before you start building, think about what your website needs to do for you.

Time spent thinking about the information you want to display and how your visitors will use your site will lead to a better and more usable site for you and your site visitors.

Think about how users will navigate your site to find the information they want. FishNET sites can be split into pages with elements, (sections), within them. These can be displayed in the menu bar.

Try to think about what your users will know. Are they the general public, or specialists in your field? Will they understand industry terms or acronyms?

Try to keep text blocks short. Many users don't (like to) read long blocks of text on a screen.

 

STEP 2  |  Site settings

 

To access the FishNET administration part of your website, simply type the following into the address bar of you browser:

[your_domain_name]/admin

Where [your_domain_name] is the address of your website, for example: www.woodenfish.nl

You should log in with the username and password that you were given when you registered for your FishNET site.

In order to allow your site to function, you first need to set a few basic settings. These will allow the site to place documents on your web server (FTP), or send e-mails on your behalf (SMTP).

They also control the display of the site in various languages and allow you to add links to your social media accounts.

 
FTP server

The FTP (File Transfer Protocol) settings allow your website to place and remove files on your web server. This allows you to add pages, images and documents to your site. The correct entry of this setting is vital to allow the site to function correctly.

The FTP server name will refer to computer where your website is hosted. For example: ftp.your_domain.co.uk

An IP address, (IPv4), is made up 4 blocks of numbers. Each block is a number between 0 and 254. The blocks are separated with a point or full stop symbol. For example:123.123.123.123

The server username and password are case sensitive. Take care to enter them correctly.

The server name/IP and the ftp username and password are encrypted before being stored within FishNET.

The website root folder is the location of your site on the FTP server. Leave blank if the site is not found in a sub folder. For example: /www of /http

If you are unsure of your FTP settings, your site hosting company will be able to provide you with the relevant details.

 
SMTP server

The SMTP (Simple Mail Transfer Protocol) settings allow your website to send emails on your behalf via your email server. This allows you to send emails to your site users and to receive emails from the site. The correct entry of this setting is vital to allow the site to function correctly.

The SMTP server name will refer to computer where your email is hosted. For example: smtp.your_domain.co.uk

An IP address, (IPv4), is made up 4 blocks of numbers. Each block is a number between 0 and 254. The blocks are separated with a point or full stop symbol. For example:123.123.123.123

If your SMTP server requires, (or allows), authentication and/or encryption of the connection to the e-mail server, enter the correct details.

The server username and password are case sensitive. Take care to enter them correctly. The server name/IP and the smtp username and password are encrypted before being stored within FishNET. If you are unsure of your SMTP settings, your email hosting company will be able to provide you with the relevant details.

 
Logo

The site logo settings page allows you change the logos which are displayed in the website and/or the administration pages.

Click on the button ‘Edit logo’ for the logo that you wish to change. Choose an image file from the ‘browse file’ dialog. You will see a file preview of the chosen image, (Unless you choose a .gif image type). Click on the ‘Upload file’ button. The file will be uploaded to the website. A progress bar will show you how the upload is progressing.

Once the file is uploaded, you will be able to edit the uploaded file using crop, zoom and rotate functions. Once you are happy with the uploaded file, click on the ‘Edit settings’ button to save your changes.

 
HTML META Keywords

The HTML Keywords META tag is used by search engines to help categorize your website. They are one piece in a large algorithmic puzzle that major search engines look at when deciding which results are relevant to show users who have typed in a search query.

Don't add hundreds of keywords in the hopes of higher search engine rankings. Keep them concise and relevant to what you do.

You can add keywords for each display language of your website. Once you have finished editing, click on the 'Edit settings' button to save your changes.

You can also add a page specific keyword tag to each page via the page settings.

 
HTML META description

The HTML description META tag is used by search engines to help categorize your website. They are one piece in a large algorithmic puzzle that major search engines look at when deciding which results are relevant to show users who have typed in a search query.

For the search engine to understand what your page is about, you need to write a good description. When Google's algorithm decides a description is badly written or inaccurate, it will replace that description with its own version of what is on the page.

Keep your description short and relevant. It will then show up in the search engine results. You can add a description for each display language of your website. Once you have finished editing, click on the 'Edit settings' button to save your changes.

You can also add a page specific description tag to each page via the page settings.

The HTML description META tag is used by search engines to help categorize your website. They are one piece in a large algorithmic puzzle that major search engines look at when deciding which results are relevant to show users who have typed in a search query. For the search engine to understand what your page is about, you need to write a good description. When Google's algorithm decides a description is badly written or inaccurate, it will replace that description with its own version of what is on the page. Keep your description short and relevant. It will then show up in the search engine results.

 
HTML title

The HTML title META tag is used by search engines to help categorize your website. They are one piece in a large algorithmic puzzle that major search engines look at when deciding which results are relevant to show users who have typed in a search query.

Think of title tags like the title of the chapter of a book. It tells people and search engines what your page is about. Title tags are also part of what makes people decide whether to visit your site when it shows up in the search results.

The title tag should contain important keywords to help the search engine determine what the page is about. Keep you title short, (max 70 characters). Include your most important keywords, but don't 'stuff' the title tag full of them.

You can add a title for each display language of your website. Once you have finished editing, click on the 'Edit settings' button to save your changes.

You can also add a page specific title tag to each page via the page settings.

 
Website email

The website email address setting is used by the site in conjunction with the SMTP server settings to send emails from the site to your site users.

Use a real email address for this setting to avoid problems with messages being seen as spam mails. The correct entry of this setting is vital to allow the site to function correctly.

Add the email address and the name you wish to use. Once you have finished editing, click on the 'Edit settings' button to save your changes.

 
Contact email address

The contact form email address setting is used by the site in conjunction with the SMTP server settings to send you the completed contact forms from the website.

If you do not have a contact form on your website, you do not need to enter this setting. Add the email address and the name you wish to use.

Once you have finished editing, click on the 'Edit settings' button to save your changes.

 
Favicon and app icons

A 'favicon' is an icon that is associated with a particular website and which web browsers display in various places: next to the URL in the address bar, next to the website’s name in a list of bookmarks and next to the page title in those browsers that have tabbed browsing.

When a visitor sees one on your website it helps them be sure that they came to the right place.

Upload your icon design to:

http://www.favicon-generator.org

Save the resulting file onto your computer. Upload this file to the website using the favicon setting page to replace your current favicon.

 
Email text

Use this setting to change the text of the e-mails which are set out by FishNET in response to various events, such as a new user registration.

The text is edited in place and can de saved by clicking the 'Edit settings' button. Some parts of the email may be non editable as these contain information inputted by the user during registration.

 
Languages

There are two parts to the language settings.

To add a language click on the '+' button in the 'Available languages'. To remove a display language click on the 'x'button in the 'Language - Website' list. The default display language is the first language in the list. You can change the order by clicking and dragging the options in the 'Language - Website' list.

‘The Language - Administration’ determines which languages are available in your administration website. You can change the default language by clicking and dragging on the options in the list. To save your changes click on the 'Edit settings' button.

 
Site background colour

To change the background colour for the whole site, choose a colour from the colour picker.

Remember that page elements can also have their own background colour, which is defined by their template and theme.

 
Social Media

To link your social media sites with your website, enter the public URL of your social media account into the relevant box.

The social media block uses these settings to display social media links. It omits any social media sites where the URL is blank.

 
Template themes

Themes can be used to change the look of a page element. You can define your own colours for text, buttons and backgrounds. To change the defined colour click on the relevant colour block and select your desired colour. Click on 'Add/Edit theme' to save your changes.

 
Documents

You can add documents to your site here, of by uploading them withing a text block. Documents uploed here kan be linked to within a text block by using the link button in the text editor.

 
Users

To allow multiple people to edit your site, you need to add them as users. By choosing the user type, you can decide what level of access you wish each user to have.

‘Administrators’ have access to all FishNET features and can create/edit the site structure, manage users and change the settings

‘Editors’ can add and edit content only.

‘Users’ is a user type reserved for special blocks in websites where a membership option is required.

Using the Change User Password section you can reset the password of a user. The user receives an automatic email advising them of the new password.

The last administrator user cannot be deleted.

 

STEP 3  |  Create your pages

 

Pages are the top structural level of your website. You can decide to have a linear site with only one page, (a structure that is popular on mobile sites), or you can split your site up into multiple pages. Pages themselve can be further split into page elements which contain the content blocks used to display your content. Using these elements you can quickly and simply create your site structure.

You cannot delete the first page in the list, (the site homepage). This ensures your visitors always receive some content when visiting your site. Your new site will contain one page with a 'Site under maintenance' element. To remove this page, you must first create a new page with some content and move this into the first position within the page list. You them have two options, either to delete the holding page, or to set it offline within the page options so that you can re-use it later should you wish.

Pages can be edited by clicking on the 'Edit page' button

Pages can be deleted by clicking on the 'x' button.

Pages shown in red are offline in all display languages and are thus not visible to your site visitors. Pages shown in grey are online in some of the possible display languages. You can choose yourself which pages and/or elements are shown by setting them online/offline.

You can also add/edit the menu text for the page in each display language.

For each page you can add a specific title, keyword and description meta tag for each display language. (It is a good idea to do this to improve your SEO (Search Engine Optimalisation). Remember to keep your tags short and relevant).

You can also add/edit and delete template themes and background images for your page elements.

 
Adding pages

Pages are the top structural level of your website. New pages can be added by clicking on the 'Add page' button.

Editing pages

Have you added a page? You can now edit it.

At the end of the form you can start adding your page elements. Page elements allow you to split your page up into smaller elements, each of which can be styled and placed in your desired order. Add them by clicking on the '+ Add page element' button. Save your changes by clicking on the 'Save' button.

Editing page elements

Added a page element? You can now edit it.

Page elements can be filled with content blocks. These blocks allow you to display specif sorts of content. Add them using the '+ Add content block' button. Save your changes by clicking on the 'Save' button.

Content blocks are the placeholders for your website content and the content within them can be edited via the 'Content' (STAP 4) section of the index page.

You can use any number of blocks in any combination in a page element. You can set them on and offline whenever you want. FishNET will keep developing new blocks and will add these to your site as they become available. That way your options develop with us, without extra cost to you.

The following blocks are available:

Text block

The text toolbar offers many options for styling text and adding other sorts of content into you text.

Image block

Allows you to display images.

Video block

Allows you to display videos from Youtube or Vimeo.

Image wall block

Display multiple images in a gallery.

Image carousel block

Display images in a carousel format

(N.B.: You can add whatever size of image you want to the carousel. If you want your image to occupy less than the screen width on a mobile it will need to have a width of somewhere around 300-350 pixels. Wider images will flow of the right of the screen on a mobile.)

Image/Video slider block

The image/video slider block allows you to add images and videos to a slider.

Full width image/video slider block

The full width image/video slider block allows you to add image and videos to a slider wich stretches the full width of your site.

Blog block

Display your own blog messages.

Content introduction block

Add teasers/eyecatchers to your website and link them to other content.

Product block

The product block gives the option to display your products on your site. You can couple with an external webshop page in your text using a link.

Social Media block

The Social media block allows you to link to all of your social media accounts.

Contact form block

The contact form block allows you to receive enquiries from your website users.

 

STEP 4  |  Edit content

 

Added all your pages, elements and content blocks?

Using the 'Content' section, you can quickly edit your site content. This is where your site really comes to life. In order to effectively edit content, FishNET uses a system of in-place editing. This allows you to directly see the effect of your edit, (What You See Is What You Get).

You can change the language by clicking on the flag icons at the top of the content edit page. The content displayed is determined by the settings within the page and page element sections for the selected display language.

 
Text toolbar

Click on your editable site text and the toolbar becomes visible. Click outside a text area and it disappears again and your changes are automatically saved. The text toolbar offers you all sorts of options to style and format your text. It also allows you to add pictures and link to other websites or pages and documents within your site.

Using this button you can cut, copy and paste text. You can also paste text withour formatting, or from Microsoft Word.

Using this button you can style your text, adding bold, italic, underline and strikethough. With the 'Style' button you can format your text as: title, big text, body text(normal) en small text.

Use these buttons to format your comments, (indent and outdent), or to format your paragraphs left, centered, right of justify.

Use these buttons to make, edit or remove links. Links kan be added to documents, to external websites (an external link), or to part of your own site (an internal link).


With these buttons you can add/edit images, tables, horizontal rules and iframes in your text. Adding an image? Use the button 'Browse Server'. Change the width attribute to 100% to insure your image is correctly displayed on all devices.

Use these buttons to search, replace, to select all and for the spell checker. The spelchecker is multi-lingual.