You can manage your website content through the Content Management System (CMS).

To access the CMS, go to Website > Content within the main menu.

Click to jump straight to the action you're looking to perform:


Changing text size, fonts and branding style

Firefish will already be set up with your chosen fonts, colours, header sizes and page formatting.

We don't recommend changing your existing headers as they follow your existing website styling. They've also been added in a way that makes it easier for search engines to read your website.

However, you can add in new headers or change the style of your text.

To do this, highlight the text you'd like to change then select the appropriate Format from the dropdown menu.

Use this drop down to change text formatting

You'll notice there are also options to edit the styling of your font.

To preview what the font will look like, click on the Style Check page, then hit Preview to see how the different headers will look on your site.

Use the Style Check page to preview different formatting and styles

Please note: If you would like to change your standard font throughout your website, please raise this with the Customer Success Team.


Removing inline styling

Sometimes, style changes that work in desktop view don't look the same on mobile view, or vice versa.

Here's an example:

Content not appearing correctly on mobile

To quickly address this, you can remove all of the unwanted styling by highlighting all of the content and clicking the Remove Format button.

This will instantly strip out all of the formatting and sizing for the text you have highlighted, taking it from this:

Before using the remove format button

to this:

When the remove styling has been used

This process is known as Removing Inline Styling. You can then begin re-adding styling until you find a style that you're happy with.


Adding images

To add images to a page, select that page in the CMS and click on the Images tab.

Depending on your web template, you may want to include a banner image or side images on your page. Pick the relevant area, then click Select Image.

Choose whether to add a Banner or side image

Choose your image from the Image Browser or Upload a new image and then click Attach.

Pick your image from the list or upload a new image

You can edit the width and height of your image using the Media Details icon. However, we recommend resizing the image before you upload it rather than resizing the image in Firefish.

To get your images looking exactly how you want them, check out the below article on how to create the best images for your website.

You can also add Alt Text, Title Text and a Link to your image:

Use the Media Details option to make changes to the dimensions of your image

Clicking the red cross will remove an image.

Removing images from a web page

Embedding an image

You can also choose to upload an image straight from your computer into the content area of your page and Firefish will host it for you.

To do this, select the picture icon.

Click the picture icon to embed an image

Select Browse Server and choose or upload your image.

Add the number of pixels if you would like to have a border

If you’d like to add a Border around the image, just enter the number of pixels (how thick) you'd like it to be.

You can then enter the Width and Height for the image if you’d like to resize it (again, we recommend resizing the image before you upload it to Firefish).

You can also choose to resize the image on the page itself. To do this, just right click on the image and select Image Properties.

Right click for image properties

Use the Align dropdown to align your image right or left.

Use the Align drop down to change the image alignment

Once you are happy with all of your changes, click OK.


Embedding videos

If your web design includes a slot for video, select the Embedded Video/Map option from the Type drop down on the Images tab of a web page.

Then, add the embed code for the video which you'll find on the channel the video is hosting on (e.g. YouTube, Vimeo, Wistia or Sprout). You’ll usually find this in the 'share options' section.

Here's an example from YouTube:

Copying the embedded script from a YouTube video

Paste your video embed code into the Embed Script box then click Preview to see your video.

If you want to change or remove your video use the Media Details icon to access the video script.

Paste the embedded script into the Embed Script box

Embedding a video directly in the content

Once you've created or selected the page you want to add a video to, click the Source button.

Click the source button to display the code for your content

Paste the video script in the position you would like it to appear; for example, below the existing text.

Paste your video script in the desired location

You can use Preview button to check how it will appear on your live web page and once you are happy click Source to return to content view.

Finally, click Save (don’t worry if you can’t see the video here – as long as you see an iFrame image like the one below, your video will be there).

As long as an IFRAME image appears your video will display when live

Your video may give you a suggestion of what to watch next; if you don't want to include this, try adding "?rel=0" OR "&rel=0" directly after the video URL.

Amend the video URL so that it plays on repeat

Your video will now go back to the beginning, ready to be played again rather than offering suggestions for other videos.


Adding Tables

To add a table to your content page, click the postition that you'd like to add your table, then click the Table button to add in a table.

Click to add tables to your content

You can select the number of rows and columns, what height and width you'd like the table to be and also its alignment.

You can also edit the following:

  • Headers - Select whether you’d like your first row, first column, or both to be headers

  • Border size - Control the size of your table’s lines. If you don’t want the lines to show, just enter 0

  • Cell spacing - Create space between the cells within your table

  • Cell padding - Set the space between the cell wall and the cell content

Adjust your table properties

Once your happy, click OK. Further changes to your table can be made at any time - just right click, and select Table Properties.

Right click on your table to reopen table properties at any time

As you start to type into the first column, it might appear as if the other columns are getting squashed. Don’t worry about this - when you tab into that column it will realign.

You can now enter your content

You can also add images to your table using the Picture button.

You can amend the size of the image when you upload it or if you decide it’d look better in a different size once it’s in place just right click, select Image Properties and enter the height and/or width you’d like.

Adding images to a table

Don't forget you can click Preview at any time to see how your changes will appear when live.


Adding anchors

You can add anchors to direct a visitor to a different part of the web page they're viewing. This feature is especially useful on pages with a lot of content - you'll see a good example of this at the top of this guide!

First, type or highlight the text you'd like to use as your anchor and click the Anchor button.

Use the anchor button to add anchors

Next, give your anchor a name. Instead of any spaces, use an underscore (_) or dash (-) so that a valid URL is created and can be linked to.

Then highlight the text you would like your anchor to lead to, and select the Link button.

Use the link button to link your anchor

From the Link Type drop down,select Link to anchor in the text and, under the Select an Anchor section, select the anchor you'd like to link to.

Select the anchor to link to

Select OK and then your anchor has been created.

Did this answer your question?