Classroom Blogging Training wiki: http://technologyintegrationshthornt.pbworks.com/create-a-blog 1. Create a Google Account Navigate to http://www.google.com and sign up for a Google account. o Use your GPISD email address. Verify your account via the email (or text message) they send you. Login into Google Go to more- even more and choose blogger in the list. 2. Decide on a purpose for your blog: Click on the link to view types of blogs http://technologyintegrationshthornt.pbworks.com/create-a-blog 3. Create your blog. Click on New Blog Click on the wheel gadget for Blogger help or to use the old Blogger Interface. Add Title: Name your blog Address: Enter a URL address for your blog (no spaces.) Choose a template Note: Choose simple template if you plan to add a fancy background. You can change the template at any time. Click on Create Blog. Sharon Thornton- Instructional Media- Updated 2012 Page 1
4A. Edit your Profile This is your Dashboard It will list all of your blogs here. Before we begin, let s edit your profile and settings Click on the drop down arrow next to your name at the top right hand corner. Click on Blogger Profile This is your profile window. Here you can change your personal settings: Privacy Share my Profile Show my email address- uncheck so you don t get spam email. Show my other blogs Show sites I follow Identify information Username and email address Display name Profile Photo Add audio clip Sharon Thornton- Instructional Media- Updated 2012 Page 2
You can also add other optional personal information if you choose. Introduce yourself Birthday & gender IM username Favorites Make sure to scroll all the way to the bottom and click the orange Save Profile button. 4B. Edit Account Settings You won t change this now, but you need to be aware of where it is for later in case you want to change anything. Click on Account settings. Here you can: Change your password Set up multiple sign-ins Delete your account Connected Accounts Advanced Feature: Connect other accounts with other services you have with Google Blogger or other apps such as Facebook, Twitter, Flickr or linkedin. Sharon Thornton- Instructional Media- Updated 2012 Page 3
Click on the back on the web browser arrow twice until you are at your dashboard again. You can always click on the Blogger icon if it s available. 5. Customize your template. You already selected a template when you set up your blog. This section discusses how to change the way the template looks (or choose a different one.) Click on the drop down arrow next to view blog. Click on Template Click on Customize. You are now in the brand new Blogger Template Designer Window as seen below. Sharon Thornton- Instructional Media- Updated 2012 Page 4
Here is where you can choose a different template. You will see different styles and colors for each template underneath. If you click on another template, a preview shows below in this window. Your current template will still be displayed under the Live on Blog window. When you find one you like, click on the orange Apply to blog hyperlink at the top right. In this same window you will links to change these properties of your template: Background Adjust Widths Layout- the way your blog looks. Advanced Click on the Background hyperlink on the left. Here you can change theme colors. Click on the orange Apply to Blog button in the top right hand corner of this window. Click on use default to change it back to what you had. You can also change the background picture to your template. It s the sides of your template. Sharon Thornton- Instructional Media- Updated 2012 Page 5
Click on the arrow next to the Background image window. Click on each category to see the available backgrounds. Choose a background. You will see what it looks like in this preview window. If you like it, click on the orange Done button. Note 1: Backgrounds go behind templates. Every background doesn t look good with every template. That s why it s best to choose a simple template when you first begin. Note 2: You can also download entire templates that have neat backgrounds already. Click on Adjust Widths Click on and move the scroll bar to change sizes of blog or sidebars. Click on the orange Apply to Blog button in the top right hand corner of this window. Click on use default to change it back to Sharon Thornton- Instructional Media- Updated 2012 Page 6
Click on Layout hyperlink Here you can change the structure of your blog. Select a body layout and it will change in the preview window below. You can also click on gadgets and drag them to another place on your blog layout here. When finished, make sure to orange Click Apply to Blog button at the top right. Click on Advanced hyperlink. Select a page element to change (i.e, page, blog or post title.) You can then change the font, background color and text color for that specific element. Click on the orange Apply to Blog button at the top right hand corner. Sharon Thornton- Instructional Media- Updated 2012 Page 7
Now click on View Blog at the top right of your screen. It will take you to your blog. Notice the website address in your browser window. That s your official blog website URL. It s time to add your first post. 6. Creating Posts on your blog. Click on New Post. Note: You can always go back and edit your template or its properties by clicking on the Design tab. This is what the post window looks like shown below. Make sure you are on the Compose tab. It should be dark gray. You will use the HTML tab to embed code in a post later on. Type a title for your first post- maybe something like Welcome to our classroom blog. Type a welcome message in your post. Include the purpose of your blog. Sharon Thornton- Instructional Media- Updated 2012 Page 8
You can use the Editor Toolbar to change the font size and color, insert bulleted lists, align text and other features such as inserting pictures, movies and website links. There is also a spell check feature. You can click on Save at anytime and it will save this post, but it will not show up on your actual blog until you click on Publish. Important Note: Saved and even published posts can be edited or deleted at any time. You can also click on Preview to see how your post looks on your blog. Let s look at your Post Settings. Adding Labels to Posts This is very important because it is a way that others will be able to search your blog for a particular post. Click on Labels under Post Settings on the right hand side of your post window. Note: Once you have added several labels, you can click on Show all hyperlink and it will give you a list of Type all the in labels you or tags have, for so this can post, add a label from here by clicking on it. separating each label with a comma Click Done Sharon Thornton- Instructional Media- Updated 2012 Page 9
Click on Schedule. You can choose what day and time your post gets published. Click on done. Click on Location You can search for a specific location if you like using Google Maps. Here I searched for the Austin Convention center since that is where I will be blogging from this week. Click on Done. You can also set specific settings for each blog post if you like. We are still in the same Post Settings window at the top right of your blog. Click on Options Make choices the only thing you might want to change here is to allow or not allow comments on this post. Click on Done. Let s Preview your blog. First click on Save. Then click on Preview Remember, it won t show up on your blog until you click Publish. Sharon Thornton- Instructional Media- Updated 2012 Page 10
Notice how this opens in a new window (shown below) and has the word preview on the left. Notice how the date is at the top of the post. If you were in the real blog view (after publishing,) you could click on the pencil at the end of the post to edit the post. Viewers can post comments below each post (if you allows for this in your settings.) Click on Post a comment. Viewers just type their comment. Click on Publish They can also subscribe by email here. For now, Close this preview window to return to your current blog post window. Now let s go back and see how to Sharon Thornton- Instructional Media- Updated 2012 Page 11
7. Add website links, hyperlinks, pictures and videos to individual blog posts A. Add a website link to your post (so actual URL is displayed) You can simply copy a website URL and paste it directly into your post. B. Add hypertext link to your post (Referring words instead of URL will be shown) Type what you want the link to say. Click on the Link button in the editor toolbar. Text to display shows the words you typed. Paste the Website URL in the web address window. Click OK. Now you will see the words you typed (that are linked to the website you pasted.) Note: You can also select email address to create a link to your email. Sharon Thornton- Instructional Media- Updated 2012 Page 12
C. Add a picture to a post (saved on your PC.) Click on the picture icon in the editing toolbar. Click on Choose Files Navigate to the picture you have saved on your computer. It will show up here Click on Add Selected. Now you see the picture inside of your blog post. Click on the picture to select it. Sharon Thornton- Instructional Media- Updated 2012 Page 13
You will now see the editing tools. You can change the size or position in your post. You can also add a caption or remove it if you change your mind. D. Add a picture add a picture from the Internet using its website s URL. Locate the website URL on a copyright safe image. http://pics4learning.com/ http://www.flickr.com/creativecommons/ http://commons.wikimedia.org/wiki/main_page http://imageafter.com/ Or Use Google Advanced Search Click on Images and type in a search Click on the widget wheel and choose Advanced Search Under usage rights: Choose only images labeled for reuse. Click on Search images. Make sure you click on Update (if you have already saved this post,) or save if you haven t done so yet. Sharon Thornton- Instructional Media- Updated 2012 Page 14
Click on a picture so it opens in its own window. Right click and Choose Copy Image URL. Note: In some places, when you right click on an image you will not see Copy image URL. In this case, you will select Properties. You will see the Address URL in this window. Highlight this address. Now go back to your blog post. Click on the same picture icon in your editor toolbar. This time click on From a URL. Paste the copied link in the window as shown. You will now see a preview of that image. Click on Add selected. Sharon Thornton- Instructional Media- Updated 2012 Page 15
E. Add a video. If it s saved on your computer, then click the film icon and upload just like a picture. F. Embed an audio or video played inside a post (using an embed code.) Click on HTML view. Now you see the code (html view) that was generated from everything you have typed or added so far to this post. You will simply find the code for the audio or video that you want to embed and paste it here. Now I need to find the code for what I want to upload. Note: You can create movies or slideshows in many web 2.0 programs like Animoto or Smile Box. Y o u c a n a l s o u p l o a d v i d e o s t o O n e T r u e M e d i a a n d i t p r o v i d e s a n e m b e d c o d e a s w e l l. Once the video is created, it provides you with the code you need to paste into your blog. I wanted to upload a video taken from Teacher Tube (since You Tube is blocked inside of our district.) Search for the video you want for your post. Scroll down and copy the embed code as shown. Note: You can also just copy the website URL here and paste into your post, but it won t show the actual video. Sharon Thornton- Instructional Media- Updated 2012 Page 16
Now go back to your blog post. You should still be in the HTML editor. Scroll to the bottom and paste this embed code as shown. Notice how I typed a message before the code. It was a note to my viewers. Type a <p> after this note if you want a line space between the message and the video. Click on Preview to see how it looks inside your blog post. Now you can see that the actual video player shows up inside this blog post. Sharon Thornton- Instructional Media- Updated 2012 Page 17
Click on Update (or save if you haven t done this yet.) 8. Edit Blog Posts You can go back back and change something in any of your posts whether they are saved as a draft or actually published. You can delete any posts also. Once you saved, updated or published your post above, it will take you back to your dashboard. Note: If it doesn t, remember you can always get to your dashboard by clicking on the B Blogger icon at the top left of the screen. Navigate back to your dashboard. It may just be the letter B like shown in the window below. Your dashboard shows all of the posts in your blog. To edit: Hover your mouse over the post to see the edit button. Click on Edit. You can also view or delete a post Click here to see all of your You can View Blog with this link. Click on the pencil icon to add a new post. Click on the paper icon to see all of your posts at once. Sharon Thornton- Instructional Media- Updated 2012 Page 18
Navigate back to your dashboard by clicking the Blogger icon. Note: If you are in the view mode of your blog, you can navigate to your dashboard like this: Click on Design 9. Add Gadgets and change your blog Layout (you need to be on your dashboard.) Add or Rearrange gadgets to your blog. o Gadgets do not show up inside of blog posts, they remain on the sides, top or bottom of your blog since they are not embedded in individual posts. o Click on the Layout tab. Click on blue Edit button next to title to change. Make sure to Click on Save Arrangement if you make any changes. Click Edit on any existing Gadget to modify. You can also click and drag on any gadget and move to another place Sharon Thornton- Instructional Media- Updated 2012 Page 19
You are now in the Configure Heading Window. Change your Blog name here. Here is a link to find copyright safe pictures. Add a description. http://technologyintegrationshthornt.pbworks.com/pictures You can insert a picture from your files or from the web. You can choose the Download on your computer and browse to upload in the window above. placement options as well. Make selections and make sure to click on Save. Copy the website URL and paste in the window above in From the Web. Follow the same steps listed above for copying the URL. Click on a picture so it opens in its own window. Right click and Choose Copy Image URL. Choose properties if Copy image is not a choice. You will see the Address URL in this window. Highlight this address. Sharon Thornton- Instructional Media- Updated 2012 Page 20
Now go back to your blog designer. You will still be in the gadget editor. Select From the Web, paste an image URL below. Paste the website URL. You will see a preview of the picture. Click Save. Click on View Blog to see how your blog looks. Sharon Thornton- Instructional Media- Updated 2012 Page 21
Page18 Add a picture from your computer to a gadget. This time under image just select From your Computer. Click Choose File. Navigate to your file. Click Open. You ll see a preview here. Click on Save. Click on View blog to preview. Let s add some more gadgets. You can see a list of gadgets already added by default. You can click edit on any of these to change or delete. You can also move them around. Click on Add a Gadget. Sharon Thornton- Instructional Media- Updated 2012 Page 22
There are a lot of gadgets to choose from. Let s add a label gadget. Click on Labels This will show a list of all the labels (tags) for all of your posts to make it easy to search by these categories. Choose the options you prefer. You can change the title to Tags if you want. Click on Save. Click on View blog to see your changes. Sharon Thornton- Instructional Media- Updated 2012 Page 23
Inserting other gadgets. Popular Gadgets teachers like: Pictures- Add pictures to any part of your layout. Slideshow: You can take pictures of your students during various activities and create a slideshow and add it as a gadget to your blog. Video Bar-Embeds a video player right on your blog of a movie you create or download. Poll- Add polls for parents and students to respond to. Links List a blog roll that lists websites that you recommend for your students to use at home Follow by email- other people can click here and get email notifications when you post a new message. Subscription links- Subscribe with popular feed readers *** HTML/JavaScript Most Popular Gadget: Add third-party functionality or other code to your blog. (Example: embed code for video and audio players. Sharon Thornton- Instructional Media- Updated 2012 Page 24