Canvas Button Design

Published by TheJenalleeShow on

When we get a call from one of your favorite science coordinators for help, we clear our calendars!

Our friend, Marcie Cogar, called us and asked for help in creating buttons for her Castleberry ISD Science Fair Canvas course. You can guess where our first stop for designing was… Canva!

We met together, went to Canva and began designing. Canva does have Canvas button templates, however, we found a template in the stickers templates that we really liked, so we made stickers instead.

We created buttons for each step of the Science Fair process for the students to follow. Each button is linked to a page with information needed for the Science Fair.

Now we had to figure out how to add the buttons to the Canvas course. 🤔

Say hello to Stephanie Balster

Stephanie is of the Castleberry ISD Innovation Leaders.

Stephanie came to the rescue with a Canvas code to make a grid within the Canvas page that aligns all of the images. In addition to making the images symmetrical, the code also allows the images and alt text to be readable for screen readers and the built-in Immersive Reader by Microsoft. YAAASSSS!! This makes our hearts sooo happy! The page looks great and the information is accessible.

After adding the buttons to the grid, we then created a page for each button to link to with the information regarding the button topic.

We linked each button to it’s corresponding page by clicking the link button in Canvas and selecting course link.

Each of the course pages appear on the right hand side of the page. We selected the page we wanted each button to be linked with and clicked save!

Now each button is linked and Marcie has an AWESOME Canvas Course for each secondary student at Castleberry ISD to utilize and complete their Science Fair Projects with ease!

Check out this TikTok to hear about the process from Stephanie, Jeni, and Sallee.

Canvas & by salleeclark


We know all this information has you jumping with joy and you want to make this for your own Canvas course.

Good News! 🎉

We have the Canva button templates for you & the html code! This should make the process a little easier for you and your friends!

Grid Layout Canvas HTML Code 

Copy the code below and add it to your Canvas pages to create a grid that is accessible and appealing to your course.

Click here to see an interactive tutorial on using the html code in Canvas.

<div class=”grid-row”>

    <div class=”col-xs-12 col-md-3″>

        <p style=”text-align: center;”>Insert Image 1 here</p>

        <p style=”text-align: center;”>Image 1 description or information</p>


    <div class=”col-xs-12 col-md-3″>

        <p style=”text-align: center;”>Insert Image 2 here</p>

        <p style=”text-align: center;”>Image 2 description or information</p>


    <div class=”col-xs-12 col-md-3″>

        <p style=”text-align: center;”>Insert Image 3 here</p>

        <p style=”text-align: center;”>Image 3 description or information</p>


    <div class=”col-xs-12 col-md-3″>

        <p style=”text-align: center;”>Insert Image 4 here</p>

        <p style=”text-align: center;”>Image 4 description or information</p>



Canva Template!

Subscribe to our Jenallee newsletter to access all of the #Jenallee Canva Templates for FREE!


Jeni Long and Sallee Clark are Instructional Technologists with Eagle Mountain Saginaw ISD. This dynamic duo, known as #Jenallee, is passionate about technology integration and making learning accessible & fun for all! Between the two of them, they have presented across the 26 schools in their district, at their Regional Education Service Center, FETC, TCEA, TCEA for Tots, & Central America. They are both MIE Experts, MIE Trainers, Ed to the Max Consultants, and Flipgrid Ambassadors. Jeni has served in education for 20 years as a 6th grade Math Teacher, 7-12 ELA Curriculum Specialist, Technology Integration Specialist and a Science Curriculum Specialist. Sallee has served in education for 14 years as a Pre-Kindergarten teacher, Elementary Librarian, K-12 District Librarian, & Instructional Technologist.


Leave a Reply