cancel
Showing results for 
Search instead for 
Did you mean: 
rkelley1
Community Participant

Adding Announcements to the Home Page

I'm exploring a way to add course announcements to the Home Page.  Below is a screen shot of what the announcements look like on the Home Page.  For those interested, I'm providing the steps I followed, and a video walk through.  This builds upon what I learned from visiting the SJSU School of Information site.  If you try it out, please let me how it is (or isn't) working for you.

Thanks!

Example of Announcements on Your Home Page (Using RSS, Feedwind, & HTML)

Announcements on Home Page.png

Watch An Example of Announcements Being Added to the Home Page

View Video on YouTube - Adding Announcements  to Home Page

Steps for Inserting Announcements into Your Home Page (Using RSS & HTML)

  • First, you need to create an minimum of one announcement
    1. Open your course
    2. Click on Announcements
    3. Click create announcement (if you don't already have one)
    4. Once you've created an announcement view your course in student view
    5. Once in the student view open the announcement tab
    6. Right click on the RSS icon & select "copy link address"
    7. Paste link into notepad, you will need it for the next steps.
  • Second, go to Feedwind
    1. Create your free account (e.g., can login with Facebook or Google); otherwise, may impact results below
    2. Paste the link into the 'Feed URL' box on the left hand side
    3. Click the 'Plus' button (to the right of where you pasted the URL)
    4. Adjust General Settings to suit (e.g., set height to 390; keep width as 'responsive')
    5. Click the green 'Get Code' at the top right of the page
    6. Click on the 'Try this if it doesn't work' link
    7. Click on the bottom 'Copy Code' button
    8. Paste the Feedwind html code into a safe place to keep it temporarily (e.g., Notepad or Word app)
  • Go to your Canvas Home Page (or anywhere else you wish to add the announcements)
    1. Edit the page (e.g., Home Page)
    2. Place a row of x's where you'd like the announcements to go (e.g., xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx)
    3. Switch to the HTML editor by clicking on the link 'HTML Editor'
    4. !! Copy all of the HTML code on your Canvas page and paste it somewhere as a backup of your existing page (e.g., in the Notepad or Word app).
    5. Copy the Feedwind html code (from wherever you temporarily stored it)
    6. Highlight the row of x's (e.g., xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx) on the Canvas page (in HTML view), and paste over it the Feedwind code.
    7. Copy the HTML code below the Feedwind copy you just pasted.
    8. Click on the 'Rich Content Editor' link at the top, to switch back to the Rich Content Editor view.
    9. In rich text editor view, drag and resize the Feedwind Announcements box so that the height and width are 650.  Don't worry if this results in a large box; if you set width to be mobile responsive (on Feedwind), then your announcement widget will adjust on your page to the proper width.  We'll address the height of the announcements widget in a step further below.
    10. Switch to the HTML editor by clicking on the link 'HTML Editor'
    11. Paste the HTML code back into place (so that it is pasted in after any existing HTML code; this assumes everything below the feedwind HTML was removed by Canvas)
    12. Edit the height of the Feedwind iFrame to the desired height (e.g., <iframe src="https://feed.mikle.com/widget/v2/####/" width="640" height="400"></iframe></p>
    13. Save the page


Tags (2)
16 Replies
KristieJohnson
Instructure
Instructure

Totally worked with a slight change...I had to copy the iFrame from Feedwind to get the Announcements to appear. Love it! Thank you so much for sharing. I have had several clients ask how to do this. I will be passing along this information.

nmduches
Community Participant

I love this idea! Thanks for sharing. However, when I paste my url on Feedwind it shows 212830_pastedImage_0.png

lisahistory
Community Participant

Thanks for doing this, Robert. It's more elegant than the others I've used, which require you to upload an HTML document into Canvas.

bdalton_sales
Instructure
Instructure

I really like this, it could look very cool.  It's not quite as visual as this but it is now possible to add standard Canvas course announcements to the course home page.  Details are here https://community.canvaslms.com/docs/DOC-8731#jive_content_id_Pages

mmitchell2
Community Member

When an announcement is added will the students receive a notification if "notify users that this content has changed" is checked? I understand the feed is coming from Feedwind, but didn't know if on the back end it recognizes that a new announcement is added.

michelle_cicca1
Community Participant

Thank-you so much! I love this! There is text I want available, but I don't want it to take up the whole page (in my case it's the weekly agendas, so I changed the title from "Announcements," but same idea), and this is the grreatest thing! SO awesome of you to share this with everyone!!!

laurakgibbs
Community Champion

Having really compelling announcements on homepage is VERY important to me! I use a blog-based solution, with an iframe to display my daily class announcements blog as my Canvas homepage. This is a really good solution for me in particular because I have one blog for both of my classes, so I update once (at blog) and it appears automatically in both courses. I've written up detailed step by step here:

Blissfully Blogging Announcements in Canvas – Teaching with Canvas 

And I also have some observations here on difference between iframe and Redirect App as method of embedding; to get something to be your Canvas course homepage, you need to use iframe (iframe in Page, then Page as homepage):

More on Embedded Blogs (or Sites) – Teaching with Canvas 

Also, in terms of RSS syndication, I use Inoreader, which is a tool that is both a great RSS aggregator AND a syndication engine that offers a lot more granular control than Feedwind. I haven't really documented that in detail (I should!). You can use the free version to turn an RSS feed into an HTML view, and it also allows you to do combined feeds, feeds based on active searches, feeds based on rule-based tags and/or manual tags, etc. The paid version lets you do unlimited rules, aggregate not just RSS but also Twitter and Facebook, all kinds of amazing and very useful features. I am a fan.

If people are interested in learning more about this, let me know. At stefaniesanders‌'s suggestion, I'm starting to work up some materials in CanvasLIVE, and Inoreader is something I was thinking I might present on because RSS IS A SUPERPOWER (all-caps on purpose: I love RSS). Here are some notes I've written about using Inoreader plus Diigo RSS to display a live Diigo bookmark stream in Canvas:

CanvasLIVE Playground: Notes. Diigo-in-Canvas 

And here are some notes about using Inoreader for an RSS blog feed in Canvas; screenshot below.

CanvasLIVE Playground: Notes. Blog RSS in Canvas. 

I've been using RSS since the dawn of time, but I am new to Canvas, and not quite sure best way to contribute. But I am glad to connect with other fans of RSS. 🙂

Blog RSS feed in Canvas

laurakgibbs
Community Champion

Just a quick follow-up to my previous comment; I wrote a blog post today where I give a kind of "guided tour" of my blog sidebar. The ability to have a just-for-fun sidebar is one of the big reasons why I prefer to do my announcements with a blog rather than trying to do that in a Canvas designed layout:

The Sidebar Never Sleeps: Live Content 24/7 

See the announcements in action at this (open) Canvas course: Daily Announcements: MLLL-3043 Myth-Folklore S17 

Screenshot:

blog announcements