Cog Icon signifying link to Admin page

Built on Spanglefish 3

@Spanglefish Youtube

Spanglefish 3 Manual

Blocks

There are lots of different types of blocks you can add to your page. This one is the default one - simply a text block. It allows you to add as much text as you want, and the text can be formatted into headings or lists, set as bold or italic etc, and you can choose the font colour and text alignment if you wish. You can also do more complicated things like embed images or tables within the text.

The block immediately below this one is a page navigation block. Quite simply if you add one of these it will create links or buttons to all the other blocks below it.

Right down at the bottom of this page is a page last updated block which shows when the last time an update was made on the page.

The Text & Image Block

This allows you to add an image beside a block of text in a reliably responsive way.

When viewed on a mobile phone the image will appear above (or below) the text, whilst on desktop you can choose if the image is shown on the right or left. You can also set the proportion of text to image - this one is set to 60% text / 40% image.

If you're viewing this on your phone try turning it vertical and horizontal and you may see the different layouts.

Simple Table Block

This allows you to create a simple table of data, such as a price list or opening hours.

This also shows how you can reduce the width of most block types - in this case to 80%.

Spanglefish Site Price
With your own domain registered elsewhere £78 per year
With your own domain registered by us £108 per year

FAQ Block

This block allows you to add a set of Frequently Asked Questions which open and close as people click on them.

What is an FAQ?

It's a question which people frequently ask. Websites often use these blocks to provide information which might otherwise result in a telephone enquiry.

Why are the answers hidden?

If all the answers show at once the page can be very long and difficult to navigate. This helps users find the info they need.

Image Background Block

This block allows you to use an image as the background to the section and then (optionally) overlay text on top of it.

You should take care to ensure the text is legible and meets your accessibility requirements. You can do this by giving the text box a contrasting background colour which can be partially transparent.

You can adjust the margins of the text box to choose which part of the image it sits over on desktop layout.

If you don't add any text at all the block can be used as a visual break between the blocks above and below. You'll see an example if you scroll down past the next block.

Embedded Media Block

Although you can't host video or audio files on Spanglefish you can easily embed them on your site from sites like YouTube, Vimeo or Soundcloud.

You can choose whether the text goes above, below or to either side of the video.

Icon List

The icon list block allows you to create a list of items each using a separate icon as its bullet point. The icons are drawn from the Iconify API, with over 100,000 to choose from. You can set the colour of the icons for each block and can choose to show them in 1, 2 or 3 columns on desktop view.

Spanglefish is...

  • Easy to use
  • Inexpensive
  • Accessible
  • Flexible

Contact Form Block

This is a simple form but site admins can add all sorts of fields to it. Anything entered into it will be emailed to you. We have built in spam prevention tools which are working pretty well, so (for now at least) we don't need a Captcha.

Although by default it's a simple contact form, you can add all sorts of different types of options to it, and build quite complicated forms. See our Form Functionality page for more information.

Contact Form

Document Folder Block

This shows a list of the files in a folder on your site to allow visitors to download them.

They can be shown alphabetically or in date order, and you can show or hide columns like the file size.

File NameLast ModifiedFile Size
▶ Archive
File NameLast ModifiedFile Size
Test Copy.pdf10 October 202293kB
Test.pdf04 September 201993kB
Test.png03 September 2020122kB

Testimonials

This shows a random testimonial from your collection, changing each time the page loads.

Scelerisque tortor amet congue quisque enim leo dolor eros quisque phasellus eu pellentesque condimentum maximus erat phasellus eu congue phasellus et felis nunc quis euismod.

Consectetur lorem erat varius ipsum erat eget tortor tincidunt elit ut ex tortor quam enim sem portaest maecenas dolor elit quis nisl maximus interdum condimentum.

Jane Doe

Availability Calendar

You might use this for a self-catering cottage, or to show days when the village hall is available. Weeks can start on Monday, Friday, Saturday or Sunday.
You can edit the styles to set the colours for Booked and Available. You can also set it to diagonally indicate start/end dates.

There's an optional extra add-on which will synchronise this calendar to one hosted on a separate service like AirBnB.

« June 2024 »
S M T W T F S
1 June 20242 June 20243 June 20244 June 20245 June 20246 June 20247 June 20248 June 20249 June 202410 June 202411 June 202412 June 202413 June 202414 June 202415 June 202416 June 202417 June 202418 June 202419 June 202420 June 202421 June 202422 June 202423 June 202424 June 202425 June 202426 June 202427 June 202428 June 202429 June 202430 June 2024
« July 2024 »
S M T W T F S
1 July 20242 July 20243 July 20244 July 20245 July 20246 July 20247 July 20248 July 20249 July 202410 July 202411 July 202412 July 202413 July 202414 July 202415 July 202416 July 202417 July 202418 July 202419 July 202420 July 202421 July 202422 July 202423 July 202424 July 202425 July 202426 July 202427 July 202428 July 202429 July 202430 July 202431 July 2024
« August 2024 »
S M T W T F S
1 August 20242 August 20243 August 20244 August 20245 August 20246 August 20247 August 20248 August 20249 August 202410 August 202411 August 202412 August 202413 August 202414 August 202415 August 202416 August 202417 August 202418 August 202419 August 202420 August 202421 August 202422 August 202423 August 202424 August 202425 August 202426 August 202427 August 202428 August 202429 August 202430 August 202431 August 2024
Booked Available

Subpage Menu

This block automatically builds a list of child pages of this page, using the Page Image as an illustration for each one. Some blocks (such as the ones below) are largely better on a page by themselves.

Countdown Block

This allows you to show a digital clock counting down to a date and time you specify. It's this long until Christmas! This block also shows how you can set the text and background colours of any block.

  • 00

    Days

  • :
  • 00

    Hours

  • :
  • 00

    Minutes

  • :
  • 00

    Seconds

Sponsors Module

This allows you to create a nicely formatted set of logos which can optionally link to external websites. You might use this to highlight your sponsors or to show the organisations you belong to etc. See the footer of this site for an example.

Two Column Block

The two column block allows you to add text and content in two separate columns which will be shown side by side on a desktop but one above each other on a smaller mobile device.

You could use this to present text along with a translation. You're able to indicate that the second column is a different language to the first. By doing this the browser knows to display the text as right-to-left if appropriate and will use the correct punctuation and hyphenation.

دو کالم بلاک

دو کالم بلاک آپ کو متن اور مواد کو دو الگ الگ کالموں میں شامل کرنے کی اجازت دیتا ہے جو ڈیسک ٹاپ پر ایک دوسرے کے ساتھ ساتھ دکھائے جائیں گے لیکن چھوٹے موبائل ڈیوائس پر ایک دوسرے کے اوپر۔

آپ اسے ترجمہ کے ساتھ متن پیش کرنے کے لیے استعمال کر سکتے ہیں۔ آپ یہ بتانے کے قابل ہیں کہ دوسرا کالم پہلے سے مختلف زبان ہے۔ ایسا کرنے سے براؤزر متن کو دائیں سے بائیں کے طور پر ظاہر کرنا جانتا ہے اگر مناسب ہو اور صحیح اوقاف اور ہائفنیشن کا استعمال کرے گا۔

Twenty-Twenty

This allows you to compare two images one on top of each other. You might show Before and After photos for instance.

Users can drag the slider to left and right to hide or reveal the bottom image.

Page Last Updated: 10 May 2024

Site Search
^