Internet Broadcasting
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Internet Broadcasting

on

  • 1,400 views

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 ...

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.

Statistics

Views

Total Views
1,400
Views on SlideShare
1,350
Embed Views
50

Actions

Likes
0
Downloads
7
Comments
0

1 Embed 50

http://mrcarr.edublogs.org 50

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

CC Attribution-ShareAlike LicenseCC Attribution-ShareAlike License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Internet Broadcasting Presentation Transcript

  • 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:// Questions???