DRUPAL

How to create a How to create a websitewebsite

Summer Tech Academy2010 Mercedes Conde

TABLE of CONTENTS

Creating content Creating a page

Adding a table Attaching files Creating hyperlinks Adding images

Creating a poll Creating a story

Other applications Photo Slideshow Video playlist Power Point play list

1. Go to http://training.amherst.k12.va.us

2. Log in:

GETTING STARTED

CREATING CONTENTCREATING CONTENT

Once you log in, you’ll see this.

Click on “Create content”

CREATING CONTENT

Types of content

There are three different types of content:

CREATING A PAGECREATING A PAGE

Adding the title

Add a title to the page.

Use the same title here.

Page location

Make sure the content you are creating is under your name in the parent item.

Body options

HTML cut pastecopy

undo/redo erase bold italic underline

list indent

alignment link image table line

It looks similar to the Microsoft Word text editor.

Font options

You can choose different formats, fonts, sizes, colors… Although, your website should be consistent with the design of your school’s website.

Tables can be very useful when creating a website.Tables will help you keep the information organized and easy to find.

ADDING A TABLE

Adding a table

Click on the table button.

Go to the BODY menu

Adding a table

How many rows and columns do I need?

Where do I want it?

You need to attach files in order to:-Create hyperlinks-Publish documents (word, pdf, ppt…)-Add pictures

ATTACHING FILES

Attaching files

Scroll down the page. The file attachments are after the body section.

Attaching files

Click on “Choose File”

Find the file you want to attach.

Then, click “Attach”

Attaching files

Once your file is attached, uncheck the LIST option.

Attaching files

Now your file is attached to your website, but it is not published yet.

We are going to use hyperlinks for publishing our files.

This is the information you need when creating hyperlinks.

Any graphic or text that you can click on to be taken to another page or website is called a hyperlink.

Hyperlinks help visitors find their way around the website.

CREATING HYPERLINKS

Different uses

Create hyperlinks to:1.Files (word, power point…)2.Other pages in your website3.Other websites

HYPERLINK TO HYPERLINK TO ATTACHED FILESATTACHED FILES

Hyperlink to attached filesYou have to attach the files you want to use later. (check “attaching files”)

Hyperlink to attached filesOnce you have attached the files, you have to select the address where your file is located.

Click on the right button of your mouse and click on “copy”

Hyperlink to attached filesGo up to the body section where you are going to link your file. Then, select the piece of information your visitors will click on, in order to access the linked file.

Hyperlink to attached filesClick on the hyperlink button

Paste the address you copied from the attachments.

Hyperlink to attached filesYou can also decide where your file is going to be opened once the visitors click on the link.

1. Click on “Target” 2. Choose one option

HYPERLINK HYPERLINK TO TO

OTHER PAGESOTHER PAGES

Hyperlink to other pagesCopy the HTTP address of the page you want to link to.

Hyperlink to other pages1. Select the text/image where you want to put the hyperlink

2. Click on the

hyperlink button

3. Paste the address of the page. Click OK.

HYPERLINK HYPERLINK TO TO

OTHER WEBSITESOTHER WEBSITES

Hyperlink to other websitesRepeat the same steps from the “hyperlink to other pages” section.

The only difference is that the link is not redirecting to one of the pages inside your website, but to another website.

This is very useful if you want to redirect your visitors to other webs.

A picture can say a million wordsPictures make websites less boringPictures make content easy to find

ADDING IMAGES

Adding images

First of all, you have to attach your files to your website.

Go to “Attach new file” and click on “Choose File”

Find the picture you want to attach. Click Ok. Click Attach.

Adding images

Once you have attached the picture you are going to use, you have to copy the address. (Same thing you did before when attaching files)

Select the address. Click on copy.

Adding images

On the body section, click on the image button.

Click on URL. Here is where you are going to paste the address you copied on the previous step from your attachments.

Click on the right button of your mouse and select “Paste”

Adding images

Once you paste the address, you need to adjust the size of your picture.

Adding images

Decide where you want to place your picture.

CREATING A POLLCREATING A POLL

Story

Go to CREATE CONTENT and select the POLL option

Poll

Multiple Choice Question

You can add more choices

You decide how long the poll will be active

Poll

It is very important to make sure you put the poll into the correct page

Add a title to your poll and find your page in the parent item.

Poll

Once you save it, this is how your poll should look like

This is how the results would look like on your website…

Poll

If you want to have more information about the poll, when you log in, click on VOTES

Poll

When you log in, you also can see who participated in the poll and what he/she voted.

CREATING A STORYCREATING A STORY

Story

Go to CREATE CONTENT and select the STORY option

Story

The difference between a story and a page is that a story allows your students to post and share their comments.

First step is adding your story’s title. Be careful where you put your story into!!

Story

Write your story on the body section. This is just like creating a page, so you can also add pictures, tables, links…

Story

Scroll down and find COMMENT SETTINGS.

Make sure the read/write option is checked, so your students can read and write comments.

Once you have finished, click on SAVE.

OTHER APPLICATIONSOTHER APPLICATIONS

Adding:Photo slideshowVideosPower Point Play List

OTHER APPLICATIONS

PHOTO SLIDE SHOWPHOTO SLIDE SHOW

Using PICASA

Creating a Photo SlideShow

Photo Slide Show

Go to www.picasa.google.com and create an account

Photo Slide Show

Once you log in, click on UPLOAD

Then, create a PHOTO ALBUM.

Photo Slide Show

Once your photos are uploaded…

…click on EMBED SLIDESHOW

Photo Slide Show

This is the code you have to copy

You can change the size of your slideshow

Photo Slide Show

Once you have copied the code, go to your website and to the BODY menu.Click on SOURCE, paste the code and click on SAVE.

Photo Slide Show

Now, your photo slide show has been embedded.

POWER POINT PLAY LISTPOWER POINT PLAY LIST

Using SLIDESHARE to embed:-Power Point play lists

Embedding a Play List

Power Point Play List

First of all, you have to sign up and create an account.

Go to www.slideshare.net

Power Point Play List

Once you are registered, and logged in, click on “upload”

Click on Upload publicly and select the .ppt you want to upload

Power Point Play List

While your file is uploading, you can complete the file information

Power Point Play List

Once you have finished uploading all the files, click on My uploads

Power Point Play List

The uploaded files should be inside the MY UPLOADS tag.

Next step is to create a play list for your presentations.

Power Point Play List

Scroll down, and click on “Widgets for your blog”

Power Point Play List

Select my uploads

You can change the name of your playlist

Power Point Play List

Your playlist should show all the files you have uploaded

Power Point Play List

Now, it is time to embed your playlist on your website.

You will find the embedding code on your playlist

Power Point Play List

Click on the text box to select the code.

Then, click on the right button of your mouse and click on copy.

Power Point Play List

Go back to your website. On the BODY menu, click on SOURCE. Then, paste the embedding code, using the right button of your mouse.

Power Point Play List

Once you have saved the changes, your website should look like this

This playlist allows visitors to see Power Point Presentations even if they don’t have Microsoft Office installed at home.

VIDEOSVIDEOS

Using Youtube to embed:-Videos

Embedding Videos

Videos

First of all you have to create an account

Videos

Once have logged in, click on upload

Click on “upload video” and select a file

Videos

It will take a few minutes to upload the video.

Remember to keep your video public so your students can see it.

Videos

Once your video has been uploaded, click on My Videos

There you will find all your uploaded videos.

Videos

If you want to embed only one video on your website…Find the video and click on the name of the video.

Videos

Then, click on SHARE

Videos

Then, click on EMBED

This is the code you have to copy and paste into your website.

Don’t forget to UNCHECK this option!!!

You can also select how big your video is going to be.

Video

Go to the BODY section and click on “Source”

Click on the right button of your mouse, and click on “Paste”

Videos

Now your video is embedded in your website.

Videos

Now, if you want to embed more than one video… You have to create a PLAYLIST.Go back to YOUTUBE and click on MY VIDEOS.

Videos

Click on Playlists: +NEW. Add a title to your play list and click on create.

Videos

Click on Add videos to playlist, and add the videos you have selected

Videos

Once you have all the videos you need in your playlist, click on SHARE

Videos

This is the code you have to copy and paste into your website

Video

Go to the BODY section and click on “Source”

Click on the right button of your mouse, and click on “Paste”

Video

This is how your playlist should look like

mconde@amherst.k12.va.us

ANY QUESTIONS, CONTACT ME @