IAC logo

The world of non-commercial film and A-V

Events Diary Search
The Film and Video Institute find us on facebook Join us on Facebook

 

Colours & Fonts in Weebly

In the article about Colours we talk about ways to use colour in your club website. Here's what Weebly can and cannot do to help.

Weebly is designed to make it easy to produce stylish looking websites. The range of preset themes enables your website to be consistent in the use of colours, fonts and styles thus following our general advice about maintaining consistency.Play with changes if you wish, but be very careful.

Boxes with background colour

There is no easy way to create colour boxes at present. Whilst it might be achieved by modifications to the Edit html / CSS option (see below) this is way beyond this series of guides.


Making spot changes to text colours

You can change the size and colour of words to emphasise portions of text. Do this with restraint!

  • For example you might choose to write film titles in a distinctive way - perhaps in bold italics: Our New Film.
  • Letters larger than normal catch the eye.  Making a word or two larger means readers notice them.
  • Bold text is next to catch our attention and really stands out from a paragraph of text.
  • Italic text suggests something interesting but not essential.

In Weebly

Select any text you want to change, then use the Text-Toolbar:

The Weebly text tool bar.

B makes letters bold
I makes them italic
U gives them an underline
The Weeblytext colour tool. clicking the tiny arrow opens a palette of colours so that you can make letters red, blue or whatever you wish.
+ makes the text larger
- makes the text smaller
The Weebly tool to return text to its plain form. removes any changes to the look of the text and returns to its normal look.

General Changes

Weebly gives you great flexibility to change the overall look of the theme you have chosen. Once you make these changes, they will apply to all the pages in your website.

In Weebly

The Weebly DESIGN tab.Click on the DESIGN tab at the top.

On the left you will be shown options to change colours and fonts among other things:

The Weebly design options.
The limited selection of colours at the top are those the designer of your chosen theme thinks will work well with it. Click on a colour and you will see at once its impact on the page.

The option to Change Theme offers the full range of Weebly themes for you to examine. You can try any of them and you will instantly see what your pages will look like in that theme. Your words, pictures and so far as possible layout will be constant and safe.

The option to Change Fonts we will examine below.

The options below can be switched on or off as you choose.

Search Box is only available in the Pro (paid for) version of Weebly.
Social Icons adds to each page simple links for major social networks and for emails. Edit the page and click on each link to fill in the relevant connection details. You van add or subtract icons.
Phone Number - actually chooses to display or hide a small text box on the page header. You can use this text box to list a phone number or a message like "tweet us".
Edit HTML/CSS - this lets you get at the raw code behind each page and is far beyond the scope of these introductory tutorials.

The Weebly font scope options.Change Fonts

If you click Change Fonts you are shown a list of all the places where words and numbers might appear on your pages.

The two most commonly used ones are Paragraph Titles and Paragraph Text, which will make up the bulk of the material on your website.

The Site Title and Headline may be important if your club has a house style where the club name always appears in a specific font.

It is all too easy to think you have made the changes you want and then to find that something looks odd. For example the font for any text links looks different. In such cases come back here and see if that type of item can be amended.

When you click on any option here another set of choices is displayed ...
Weebly change font options - start panel.As you make each change you will see it immediately alter the page display beside the tool box. The first option takes you back a step to the previous display.

This shows the area where the font will be shown.

This shows the current font. Click the little arrow to see a huge list of fonts from which to choose.

Click the - sign to make the font smaller or plus to make it bigger.
Weight offers a choice of Regular or Bold. (e.g. make all Headlines bold.)

Colour shows the current colour of the font. Click the little arrow to see a standard colour-picker box where you can choose another one.

Line Height specifies the amount of space between the lines of text.
Reset - as usual in Weebly there is a way to get out of trouble if you make some poor choices. Click this to return to the original look and size of text.

There are nine pages in this series of detailed Weebly tips:

They support general articles on web design for film-making and AV club websites which begin here.

[Weebly frequently update and improve their system. These pages are based on tests in March 2015.]


Share your passions.

Audience silhouette.

Share your stories.

Page updated on 07 March 2015
Contact Webmaster
find us on facebook Join us on Facebook
Bookmark and Share
UNICA information UNICA member
Company Limited by Guarantee No. 00269085. Registered Charity No. 260467. Authors' views are not necessarily those of the Institute of Amateur Cinematographers. Website hosted by Merula. JavaScripts by JavaScript Source. Menu by Live Web Institute. Art work by Tony Kendle.