Class Up your Moodle Course Page with Grid Formatting

Make a good first impression when students first open your course in Moodle with Grid Formatting. This style sheet provides a means to improve the appearance and logical format of short courses (8 weeks or less) or courses arranged in units.

Styled in the Grid Formatting arrangement has many advantages. First, it allows students to obtain an overview of the course in one screen, instead of scrolling down a page of text. Second, this format provides the projection of a well-organized course with course content organized into themes. The “themes” could be “weeks, “chapters,” “topics,” or “content.” And third, this design uses similar “content themes” with the resultant “overview” of the entire course in one picture. The addition of relevant theme (icon) names further enhances the image of a well-organized course. Even more appealing to the viewer is the use of relevant pictures with the grid formatting style sheet.

 

 Step-by-Step Guide:

Set up Grids

  • Click on course
  • Edit settings (Administration sidebar)
  • Course format
  • Format (Topics format dropdown)
  • Grid format
  • Number of sections (set this number for the number of icons you prefer)
  • Save and display

You will now see the number of sections in icon (box) format displayed on your course page.

Add titles to the icons

  • Turn editing on
  • Scroll down until you see “Section 1”, “Section 2,” etc.
  • Click the “pencil” image, a box will open for you to add your “title”
  • Add title
  • Depress “Enter” on your keyboard
  • You may need to refresh the page for the titles to appear above each icon

Add pictures to the icons

  • Below each icon, click “Change image”
  • Choose a file or “drag and drop” NOTE: file must be a PNG, JPG, or GIF

Note: Grid works best for short courses (8 weeks or less) and for courses arranged in units.

 

 

Author: Leisa L. Marshall, DBA, CPA, Professor of Accounting

 

 

Resources:

Partial vector image: <a href=”https://www.freepik.com/free-vector/business-presentation_794229.htm”>Designed by Freepik</a>

Leave a Reply