Friday, September 20, 2013

Update: embedded blogs

I recently posted instructions on how to embed a blog into your weebly site. I wasn't satisfied with the solution, because it only displayed each post's title, and my students had to click on the link in order to see the post content.

Not a big deal for most people, but I knew I could do better. So a little searching and some experimentation later, I've now managed to embed the blog post content seamlessly. It follows the same CSS formatting, so it blends in seamlessly. My students will likely have no idea they're looking at a blog - it looks exactly like any other weebly page.

The benefit for me is that I can schedule posts ahead of time, and I don't have to publish the site every time I update the problem of the day. That's a big time saver for me, because I do this every day with my students. With this solution, I can set everything up ahead of time during a prep, and let the magic happen all on its own.

Instructions:

The tool I used is called feedroll. It is a simple web page that will generate html code to embed your blog's feed into your weebly site. It is a simple script that generates html code. You copy the code then paste it into an embed object on your weebly site. I have tested it with my students and it seems to work well. I have also checked the compatibility with mobile devices by looking up my site with my android phone, and it all works quite well. Overall, I'm very satisfied with this solution.

Here is a step-by-step guide:

First, you'll have to enter the URL of your blog into the FeedRoll tool, then click on "Look At Your Feed." You may need to tweak the settings or use a feedburner feed (instructions are available here). You should be able to see the content from your blog in the preview window.

 Now you can play with the settings. I set mine up to show the title, 1 full item, and to include all HTML from the item display (which will allow embedded Google Forms to display properly). Configure the settings (don't worry if it's a bit confusing - just copy what I've done here), then click on "Generate JavaScript" button.

 You'll now be presented with a block of code. Highlight the whole thing, and copy it, then paste it into an embed object in your weebly page.

 Now to take it even further!


I use an embedded Google Form in each blog post to collect responses. There are a couple of scripts that I use to help configure everything ahead of time so that I only have to set things up once, then allow the scripts to do all the hard work.

To install a script, create a form, and choose a destination spreadsheet. In the sheet, click on the Tools-Script gallery... option.
 There are two scripts I use. formLimiter is a tool that allows me to configure when to close the form to responses. Students have until 8 pm to answer the Daily Math Problem. In the script gallery, search for formlimiter, and click on the install button.



 You'll be prompted to authorize the app. Read through the warning, and if you agree, click on authorize. It's pretty standard stuff, and I've never had any issue with the permissions I've granted to formLimiter.
Once you've got formLimiter installed, a new menu item will appear. Click on Run Intial Configuration to set up the script. The script will run, and nothing will appear to happen. That's okay! Now click on the formLimiter menu again, and you'll notice that you now have the option to configure the settings.
Choose the date and time to close the form to responses. I always disable the option to send a notification (as I'm the only editor of the spreadsheet).
The final script that I use is Flubaroo. I won't go into much detail here, as it has been covered extensively elsewhere. I use it to grade responses after the problem has been closed to responses.