Build a Website and a Blog in a Day

------------
Siobhan Allen

1
Accounts
Password: MM0TC1 xx                        MM zero  TC one  ho

Email
Hotmail [email protected]     MM0TC1ho   (MM zero TC  one ho)
Gmail [email protected]   MM0TC1go

Weebly - probably create own site

[email protected]     MM0TC1we   

Website made         meetmeonthecloud.weebly.com

Students need to make their own sites from here

This will be the overarching username password if they choose to use this.

Blogger
[email protected]     MM0TC1bl

dillingtonbuildawebsite.blogger.com
dillingtonbuildawebsite2.blogger.com
dillingtonbuildawebsite3.blogger.com ….

Wordpress
[email protected]     MM0TC1wo

dillingtonbuildawebsite.wordpress.com
dillingtonbuildawebsite2.wordpress.com

2
Website vs Blog.
Like comparing a printed book with a journal, diary or newspaper. A website is a static site. There may
be a structure to it, with some pages linking to others, all based from the ‘home’ page. A website is a
good place to build a site about an interest you have, or a group that you run, where all the facts will be
on the site.

A blog is more like a journal, where entries (posts) are added on different days (they are dated, too).
Posts are listed in date order (although you can often search a blog too). A blog tends to be somewhere
where you will add more ‘thoughts’ every few days/weeks. (You might keep a blog of the family’s
events, or your progress on an arts or research project.)

Website – Weebly.com
There are many free website hosts. Why are they free? Mostly because they want to sell you a website
without their name as part of the site name, or some functions you may need to buy into…

The push is very gentle, and you can genuinely keep a free and very usable site that you will be very
happy with.

The other thing that helps to know is that once you choose a design etc it’s really easy to just change it
at the click of a button.

Something else worth knowing is that as you build your site it automatically makes a slightly different
one for mobile devices to see – it loads more quickly and is a better shape for phones and smaller
tablets.

We will focus on Weebly.com. Others include wix.com, moonfruit.com

Sign-up
Simply use your email, username and password – think of a root password that you adapt.

You will be asked what sort of page you want to start with (you can add others later), select a name if
the one they devise isn’t what you want. If you’re going for a free site it will have to have .weebly. in the
middle, for example, mine is siobhanallen.weebly.com

You can have up to 10 different sites from one Weebly account.

But stop there – we ought to do some planning! The one thing it’s hard to change is if you get all
confused about where you have put all your information.

Start by thinking about what blocks of information you have – what things go together, what leads on
from one thing. What’s most important?

It starts with the home page, which is the page visitors land on. It should be welcoming and introduce
the site.

Here’s an example of how your information might be organised on your site. Use a piece of paper to
sketch out your first ideas.

3
 Home

About Me Info 1 Info 2

Info 2a Info 2b

Once we progress Weebly will ask you to choose a design. Choose whichever you wish – you can change
it any time. Consider though that interesting graphics all over the page (wood grain) will make seeing
your website slower for some people.

Then we get to this page (You can also get here from the ‘my sites’ tab of the edit page.)

This shows 3 of the sites with different names that I run from my one account. (Mostly I just mess about
and try things out here). I have to go further to see all the pages on each site.

Sites shows Support is full of

Account lets you
you which really helpful
change details of
sites you have info and videos
your account

OK, so let’s edit

4
 Editing
There are kind of three angles to editing:

Arranging the pages in

the way that you’ve
planned. Getting a few
details right here.

Remember to
Any unique parts to publish often!
Adding the content
to individual pages main section on
pages that are
different from norm.

Here’s what you might need

Build – develop individual Arranging the pages Settings –
pages from here
 Site title,
 Change Address,
 Unpublish,
 Search engine
Optimisation (SEO)

Design – Change the Create and manage store

general site page design pages

Return to my sites page

Publish

5
Build
 Title, Text – Text Edit
 Image –

Edit

 Gallery/Slideshow – add pics – edit properties

 Map
 Contact form – Offers other options of form fields. Check email on submit button/form options
and save.

6
  Audio – This would be a paid for option, but there is a work-around.

1. Insert an embed tag. Copy this in:

<audio controls>
<source src="xxx.ogg" type="audio/ogg">
<source src="xxx.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>

2. Now use upload tag (I use a spare (hidden)page for all these sort of file uploads)
3. Once file uploaded, right click and choose copy link address.
4. Replace xxx with the address you just copied.
Note: ogg files are mac, mp3 are windows. You are more likely to have windows mp3s.

 Video – more temperamental!

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

Same but 10mb limit – usually only about seconds in video!

7
Store
Use the store page, first to make a store page, then add products to page.

CARE: Once published this is live! If you link paypal, you may get orders!

Stats and Optimising your site

http://kb.weebly.com/seo.html - How to optimise your site for search engines

http://kb.weebly.com/keywords-descriptions.html - The basics of search engine optimisation

http://kb.weebly.com/keywords-descriptions.html - Verify your site with Google

https://support.google.com/webmasters/answer/183669?hl=en&ref_topic=4581190 - Submit a sitemap

8
Blog Part 1 – Use Weebly blog page or
Blog Part 2 - Blogger
Using a Blogger account
First sign in using a gmail account

You only need to create 1 blog (which you add more posts to). This shows creating that blog.

Once in the blog, you can add many posts. These are the posts in my blog. You can change the look from
here (template or layout) and you can look at only posts that have a particular label here (though all
published posts will show live)

Use Template or Layout to

change the look of the blog

9
The edit space is quite blank so there is less confusion. Just type in what you want. It looks rough, but
formats correctly when published live. Use labels to group posts informally.

Write blog post Labels are an

content here. Add informal way to
formatting, links, organise posts
etc.

All posts will display following your chosen template. I’m currently using the ‘dynamic’ style.

In my current
formatting, this
page shows like
this:

I can select a new template here, and even make lots of small changes to the exact look on the page
very quickly:

10
 Now it looks
like this…

11
Blog Part 3 – Wordpress.com

Other options – blogger.com but need google account for this. Google can follow you around a lot if
you’re not careful.

Why free – advertising on your page, plus they try to upsell at all chances, but free service is very good.

12
Add new post

Or classic mode

13
Getting the site the way you want it
You are most likely to want:

 New post
 Dashboard
 Appearance
 Widgets
 Personal Profile

Edit your own

information

Goes onto Gravitar –

have not checked this…

The fun/exciting part of a blog is setting it up (appearance, themes, customise (add widgets), personal
profile), which is quick and easy. After that it’s up to you when you want to add new posts. Remember
to add tags or categories.

You can always change the set up at any time, but you probably want ot just get on with the content and
adding posts.

Another place to add sounds…

Looks like it’s not possible to add sounds directly to WordPress without buying more space – fair
enough. But remembered a sound storing site called SoundCloud. Very easy to set up an account, and
very easy to add sound. Just add a hyperlink to your post in WordPress.

14
Finding free and free to use images and sounds

Images: Sounds:
Google advance image search – search on http://www.partnersinrhyme.com/pir/PIRs
‘usage rights’ fx.shtml - look for their free sound effects
http://www.freeimages.com/ Not all royalty free, but really useful for
sounds http://www.findsounds.com/
http://www.imagesource.com/royalty-free
http://www.flashkit.com/ select sound fx
or sound loops from top right menu.

http://www.pdsounds.org/

15