A presentation to be give at the Student Television Network conference in Anaheim, CA on March 4, 2010. Information about building a broadcasting/video club website using Dreamweaver and a blog using WordPress.

1. Creating a Website for Your
Broadcast Club
Simple Dreamweaver Site or WordPress Blog

2. Dreamweaver vs
Wordpress

3. Dreamweaver vs
Wordpress
Dreamweaver is a
professional web
authoring application.

4. Dreamweaver vs
Wordpress
Dreamweaver is a
professional web
authoring application.
Designing a website
with Dreamweaver
gives total control over
the design of the
website.

5. Dreamweaver vs
Wordpress
Dreamweaver is a
professional web
authoring application.
Designing a website
with Dreamweaver
gives total control over
the design of the
website.
Does help to know
some HTML.

6. Dreamweaver vs
Wordpress
Dreamweaver is a Wordpress is an online
professional web web publishing
authoring application. platform for creating a
web log (blog).
Designing a website
with Dreamweaver
gives total control over
the design of the
website.
Does help to know
some HTML.

7. Dreamweaver vs
Wordpress
Dreamweaver is a Wordpress is an online
professional web web publishing
authoring application. platform for creating a
web log (blog).
Designing a website
with Dreamweaver Design/look of the site
gives total control over is easy to alter with the
the design of the use of easily
website. changeable themes.
Gives control without
Does help to know the need for expensive
some HTML. applications.

8. Dreamweaver CS4

9. Dreamweaver CS4
Dreamweaver does require some time to get up
to speed for the novice web designer.

10. Pre-made Web Designs

11. Pre-made Web Designs
There are free (and fee
based) templates
available on the web.
Such as the example.

12. Pre-made Web Designs
There are free (and fee
based) templates
available on the web.
Such as the example.
Most templates come
with the graphics and
CSS file needed for the
site.
HTTP://WWW.STEVES-TEMPLATES.COM/TEMPLATES.HTML

13. Using Downloaded
Designs

14. Using Downloaded
Designs
Download design and
unzip the file into a
folder you want to use
to save your website.

15. Using Downloaded
Designs
Download design and
unzip the file into a
folder you want to use
to save your website.
Open Dreamweaver.
Click on Dreamweaver
Site.

16. Dreamweaver Site

17. Dreamweaver Site
Name your site and for now just input http://
www.myHost.com/mySite as the URL.

18. Dreamweaver Site
Name your site and for now just input http://
www.myHost.com/mySite as the URL.
Select “No” for Server Technology. Click “Next”

19. Dreamweaver Site
Name your site and for now just input http://
www.myHost.com/mySite as the URL.
Select “No” for Server Technology. Click “Next”
Click on the folder icon on the next screen and
browse for your folder. Select it and click
“Choose”. Click “Next”.

20. Dreamweaver Site
Name your site and for now just input http://
www.myHost.com/mySite as the URL.
Select “No” for Server Technology. Click “Next”
Click on the folder icon on the next screen and
browse for your folder. Select it and click
“Choose”. Click “Next”.
Select “FTP” for how you connect to your site.
Input ftp://www.myHost.com/mySite as the FTP
address. Click “Next”.

21. Dreamweaver Site

22. Dreamweaver Site
Select “No” for check in and check out.

23. Dreamweaver Site
Select “No” for check in and check out.
Click “Next”. Then click “Done”.

24. Dreamweaver Site
Select “No” for check in and check out.
Click “Next”. Then click “Done”.
You should be back on the main screen.

25. Dreamweaver Site
Select “No” for check in and check out.
Click “Next”. Then click “Done”.
You should be back on the main screen.
Click on “Open” from the main screen.

26. Dreamweaver Site
Select “No” for check in and check out.
Click “Next”. Then click “Done”.
You should be back on the main screen.
Click on “Open” from the main screen.
Browse to find your “index.html” file.

27. Dreamweaver Template

28. Dreamweaver Template
Templates gives each
page you create the
same look and feel.

29. Dreamweaver Template
Templates gives each
page you create the
same look and feel.
On the index page
select the regions you
wish to make editable
then insert as an
“Editable Region”.

30. Dreamweaver Template
Templates gives each
page you create the
same look and feel.
On the index page
select the regions you
wish to make editable
then insert as an
“Editable Region”.
When done “Save as a
Template”.

31. Create your Template

32. Create your Template
To create your first,
and subsequent,
pages use the template
you have created.

33. Create your Template
To create your first,
and subsequent,
pages use the template
you have created.
Select “More” under
“Create New”.

34. Create your Template
To create your first,
and subsequent,
pages use the template
you have created.
Select “More” under
“Create New”.
Then choose your site
and the template you
saved.

35. First Dreamweaver
Page

36. First Dreamweaver
Page
Title your page.

37. First Dreamweaver
Page
Title your page.
Alter the Headings to
what you wish then
select the text below
that heading.

38. First Dreamweaver
Page
Title your page.
Alter the Headings to
what you wish then
select the text below
that heading.
Then click on “Split”, if
necessary.

39. First Dreamweaver
Page

40. First Dreamweaver
Page
There are a couple of
different ways to
embed video. Which
way you choose
depends on how your
videos are hosted.

41. Video Hosting

42. Video Hosting
You can host your own
videos on your web
server. This does take a
lot of space.

43. Video Hosting
You can host your own
videos on your web
server. This does take a
lot of space.
The better choice may
be to host the videos on
someone else’s site for
free.

44. Video Hosting
You can host your own
videos on your web
server. This does take a
lot of space.
The better choice may
be to host the videos on
someone else’s site for
free.
Some examples are
TeacherTube.com,
SchoolTube.com,
Blip.tv, YouTube.com

45. Get Video Code From
SchoolTube

46. Get Video Code From
SchoolTube
Go to
www.schooltube.com

47. Get Video Code From
SchoolTube
Go to
www.schooltube.com
Click on “Video”.

48. Get Video Code From
SchoolTube
Go to
www.schooltube.com
Click on “Video”.
Select a video to
embed on your
webpage.

49. Get Video Code From
SchoolTube
Go to In the right column,
www.schooltube.com look for the “Embed
Code” and click in that
Click on “Video”. box.
Select a video to
embed on your
webpage.

50. Get Video Code From
SchoolTube
Go to In the right column,
www.schooltube.com look for the “Embed
Code” and click in that
Click on “Video”. box.
Select a video to Copy the code from
embed on your the box.
webpage.

51. Get Video Code From
SchoolTube
Go to In the right column,
www.schooltube.com look for the “Embed
Code” and click in that
Click on “Video”. box.
Select a video to Copy the code from
embed on your the box.
webpage.
Return to
Dreamweaver.

52. Embed The Code In
Your Page

53. Embed The Code In
Your Page
In the code section of
the window you will
see that text you
selected earlier
highlighted.

54. Embed The Code In
Your Page
In the code section of
the window you will
see that text you
selected earlier
highlighted.
Paste the code you
copied from
SchoolTube to replace
the selected text

55. Finish Your Page

56. Finish Your Page
Save your page. Name
it “test” or whatever
you wish.

57. Finish Your Page
Save your page. Name
it “test” or whatever
you wish.
Click on “File”, select
“Preview in Browser”,
then select a browser.
(Keyboard shortcut
F12 on PC, fn+option
+F12 on mac)

58. Finish Your Page
Save your page. Name
it “test” or whatever
you wish.
Click on “File”, select
“Preview in Browser”,
then select a browser.
(Keyboard shortcut
F12 on PC, fn+option
+F12 on mac)
Click on “OK” if a
security window pops
up.

59. You Did It!

60. You Did It!
We will discuss setting up a WordPress blog in a
few minutes. I do believe setting up a blog will be
easier for all.
If your page or video does not work, let’s take a
few minutes to fix any problems you are having.

61. WordPress Blog

62. WordPress Blog
WordPress is a web application that allows users
to place a web log (blog) on their website. Or,
better yet, be the entire website

63. WordPress Blog
WordPress is a web application that allows users
to place a web log (blog) on their website. Or,
better yet, be the entire website
The application is available to be downloaded
(www.wordpress.org) and installed on your web
server. Districts may have web space for you on
their servers.

64. WordPress Blog
WordPress is a web application that allows users
to place a web log (blog) on their website. Or,
better yet, be the entire website
The application is available to be downloaded
(www.wordpress.org) and installed on your web
server. Districts may have web space for you on
their servers.
You may also pay for your own web space. Sites
are available for as little as $50 per year. The sites I
am the webmaster for on Yahoo’s servers or
GoDaddy’s servers cost around $90 per year.

65. WordPress Blog

66. WordPress Blog
If your district has web space for you and is willing
to install the WordPress site for you you can have
them do so.

67. WordPress Blog
If your district has web space for you and is willing
to install the WordPress site for you you can have
them do so.
Another, also free, way is to register for a blog on
www.wordpress.com or www.edublogs.org.

68. WordPress Blog
If your district has web space for you and is willing
to install the WordPress site for you you can have
them do so.
Another, also free, way is to register for a blog on
www.wordpress.com or www.edublogs.org.
Although you can pay for extra services this is not
necessary to have the site run perfectly.

69. WordPress Blog
If your district has web space for you and is willing
to install the WordPress site for you you can have
them do so.
Another, also free, way is to register for a blog on
www.wordpress.com or www.edublogs.org.
Although you can pay for extra services this is not
necessary to have the site run perfectly.
The best thing of a blog is the RSS subscription
that is available using a blog.

70. WordPress Blog

71. WordPress Blog
To work with this application please sign-up for a
blog at www.edublogs.com.

72. WordPress Blog
To work with this application please sign-up for a
blog at www.edublogs.com.
After working with the WordPress admin side you
can decide if you want to install this application
on your district or paid for web space or just use
the blog you are creating now.

73. WordPress Blog
To work with this application please sign-up for a
blog at www.edublogs.com.
After working with the WordPress admin side you
can decide if you want to install this application
on your district or paid for web space or just use
the blog you are creating now.
After you have registered, please check your email
to activate the blog, if necessary.

74. WordPress Dashboard

75. WordPress Dashboard
On your blog there will
be a “Meta” section
where you can “Login”

76. WordPress Dashboard
On your blog there will
be a “Meta” section
where you can “Login”
Once you have logged
in you will come to the
Dashboard of the blog.

77. WordPress Dashboard
On your blog there will
be a “Meta” section
where you can “Login”
Once you have logged
in you will come to the
Dashboard of the blog.
All your links are on the
left. You will use Posts
and Comments more
than any other admin
pages.

78. WordPress Theme

79. WordPress Theme
Click on the down-
arrow next to
“Appearance”.

80. WordPress Theme
Click on the down-
arrow next to
“Appearance”.
Click on “Theme”.

81. WordPress Theme
Click on the down-
arrow next to
“Appearance”.
Click on “Theme”.
Scroll down and select
a theme by clicking on
“Activate” under the
theme.

82. WordPress Post

83. WordPress Post
To start click on the
down-arrow next to
“Posts” and select
“Edit”.

84. WordPress Post
To start click on the
down-arrow next to
“Posts” and select
“Edit”.
There should be only
one post “Hello
world!”. Point at the
row and click on
“Delete”.

85. Get the Video For Your
Post

86. Get the Video For Your
Post
Go to www.teachertube.com or
www.schooltube.com

87. Get the Video For Your
Post
Go to www.teachertube.com or
www.schooltube.com
Select a video

88. Get the Video For Your
Post
Go to www.teachertube.com or
www.schooltube.com
Select a video
Copy the “Embed Code” (SchoolTube) or code for
“Embedded Player” (TeacherTube).

89. Get the Video For Your
Post
Go to www.teachertube.com or
www.schooltube.com
Select a video
Copy the “Embed Code” (SchoolTube) or code for
“Embedded Player” (TeacherTube).
Go back to your blog. Click on “Add New” under
Posts. Then click on “HTML”

90. WordPress Post

91. WordPress Post

92. WordPress Post
Paste the code into the post box. Make sure you
have HTML clicked before you do this.

93. WordPress Post
Paste the code into the post box. Make sure you
have HTML clicked before you do this.
Add a title in the box on top of the page.

94. WordPress Post
Paste the code into the post box. Make sure you
have HTML clicked before you do this.
Add a title in the box on top of the page.
Click on “Preview”

95. WordPress Post
Paste the code into the post box. Make sure you
have HTML clicked before you do this.
Add a title in the box on top of the page.
Click on “Preview”

96. WordPress Post

97. WordPress Post
Go back to your “Add
New Post” tab.

98. WordPress Post
Go back to your “Add
New Post” tab.
Click on Publish

99. WordPress Media

100. WordPress Media
If your video is less than 8MB you can upload it on
your site, if you choose to host your own videos.

101. WordPress Media
If your video is less than 8MB you can upload it on
your site, if you choose to host your own videos.
If you host your own videos and they are larger
than 8MB you will have to upload them via FTP.
Say using Dreamweaver or another FTP upload
application like FileZilla.

102. WordPress Media
If your video is less than 8MB you can upload it on
your site, if you choose to host your own videos.
If you host your own videos and they are larger
than 8MB you will have to upload them via FTP.
Say using Dreamweaver or another FTP upload
application like FileZilla.
Or just use free sites such as TeacherTube or
SchoolTube.

103. WordPress Settings

104. WordPress Settings
Click the down-arrow
next to “Settings”.

105. WordPress Settings
Click the down-arrow
next to “Settings”.
Click on “General”
under “Settings”.

106. WordPress Settings
Click the down-arrow
next to “Settings”.
Click on “General”
under “Settings”.
This is where you can
name your blog, give it
a tagline, and use other
settings.

107. WordPress Settings
Click on “Discussion” under “Settings”.
This is where you can control if comments are allowed,
who can comment, how comments are approved, and
if you or other administrators are notified about
comments.

108. WordPress Design

109. WordPress Design
There are many other settings and design
elements that are available on a WordPress blog.

110. WordPress Design
There are many other settings and design
elements that are available on a WordPress blog.
I will go through a few of them now.

111. WordPress Design
There are many other settings and design
elements that are available on a WordPress blog.
I will go through a few of them now.
If you use the free version on EduBlogs or
WordPress.com you do not have all of these
design elements.

112. WordPress Design
There are many other settings and design
elements that are available on a WordPress blog.
I will go through a few of them now.
If you use the free version on EduBlogs or
WordPress.com you do not have all of these
design elements.
If you host your own WordPress blog they are all
available. Or, you can use EduBlogs Campus or
pay for a “Pro” account on EduBlogs.

113. Info and Questions
Placerita JHS Miner Morning TV blog
http://mmtv.placeritajhs.org
Placerita JHS main blog website
http://www.placeritajhs.org
This presentation is available on SlideShow
http://www.slideshare.net/redbeard9/internet-broadcasting
My Blog
http://mrcarr.edublogs.org
Questions???