Make Your Own Chrome Extension for Teachers and Students

Thanks to Curt Schleibaum (https://twitter.com/curt_truc) (http://www.geekyedtech.com/home) for showing me this initially at the Google Innovator Academy this last summer in Boulder.  I have tried creating my own Chrome Extension before but didn’t get very far, I mostly just did it for learning purposes.  When he showed how he was using his Chrome Extension to share out information with students and staff, I knew this was a great idea I had to steal.  The Chrome Extension I ended up creating is a very simple one but can be very useful for communication and productivity.  By clicking the Extension, a window will pop open that contains buttons that are hyperlinked to the various sites that our students, or teachers, need to use on a regular basis.

untitled-gif-2

 Below the buttons is some text that is pulled directly from a published Google Doc.  As soon as I change the text in the Google Doc, it is updated in the Chrome Extension within minutes.  This makes it very easy to share important updates and daily announcements with students, or share reminders and updates with staff about the professional learning that is taking place.

To get started, you will need to have a program that will allow you to write code.  https://atom.io/ is what Curt suggested and has worked very well for me, plus it is free.

Next, download the template folder from my Drive (template folder).  After you click the link, click the down arrow next to the folder name to download it.

screen-shot-2016-10-06-at-3-08-01-pm

You will need to complete the tasks in the following categories to modify the Extension to fit your needs, test it out, and then upload it to the Chrome Developer Dashboard to push out to others.

Create Buttons, Icons, and Header

You can create your own copy of my button template by clicking this link: https://docs.google.com/drawings/d/1orxGNtuA2_xcehiUspKWkPHc1_KSkRYMVRcqLmacZ74/copy  You can also use my header image template by clicking here https://docs.google.com/drawings/d/1l9TkosXavfQhDyTOxiGj1Ex8UlTdeCmZI-vZgmiNqFc/copy

Create Google Doc and Publish

Edit Manifest and Window Page

Test Your Extension

Publish Your Extension

You will find that it may take some trial and error to find the formatting you want but it is very easy to push out changes and updates.  Make sure you use user feedback to make those changes that improve the use and functionality of your Extension.

If you have any questions at all, please feel free to tweet me @donovanscience

 

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s