Home > Site Administrators > Help And References > Creating Pages for Your Site > About Content Blocks > Adding Content to Content Blocks > Creating a Custom Calendar Using Tables

Creating a Custom Calendar Using Tables

 

Create a custom calendar or blended learning schedule using the Table Tool in eChalk's Rich Text Editor:

 

schedule.png

Where To Go

 

To create a table in a Text Content Block on your web site, you will log in to your site and click on the site tile.  From here go to Manage Web Site > Pages > select a page name > Click Edit or Edit Draft.

What To Do For a Schedule Table

 

  1. Click Add Content in any Content Block or click on the three dots next to an existing Text Block. If you don't have any Content Blocks available, click Add New Row to add a row of Content Blocks.
  2. Select Text from the menu.
  3. Enter a Title for the Content Block.
  4. Click on the Center icon.
  5. Click the Grid icon.
  6. Hover your mouse cursor over the number of columns and rows for your table and click to select.
  7. Click inside the cells to enter your information.

    Note: *When entering multiple lines of text into a cell, type your text and then press Shift + Enter to enter text on a new line within the same cell. 
     
  8. To edit the properties for an entire row or column such as to designate headers in a column or row, highlight the row or column, and click on the grid icon to select Cell > Properties and next to Cell Type, select Header Cell. This is helpful when creating tables that are web-accessible and legible by screen readers and other assistive technology for visually impaired visitors to your web site. 
  9. Center the rest of the content in the cells by highlighting the cells and selecting Center from the Rich Text Editor Toolbar.
  10. To differentiate the cells using color for various block schedules, highlight the cells with your mouse > select the Table icon > select Cell > Cell Properties > Advanced. 
  11. Click on the white square next to Background and select the color you'd like the cell to be and click OK when done.

    Note: *It's best to choose a light pastel color so there's enough contrast with the text. 
     
  12. Highlight and copy the color code listed as the Background color so you can reuse it in a different cell. 
  13. Click OK.
  14. Highlight other cells you would like to be the same color > select the Table icon > select Cell > Cell Properties > Advanced. 
  15. Click on the white square next to Background and paste in the color code copied in step 12 into the # field and remember to delete the # in front of the color code.
  16. Click OK.
  17. Highlight all the cells in the table and select the text color icon in the Rich Text Editor Toolbar. Choose Black to ensure the text color stands out and is easy to read.
  18. When your schedule table is complete, click Save > Done Editing > Update Published.

What To Do For a Calendar Table

 

Creating a calendar using the table tool is just like creating a schedule table. Just changing how text is aligned inside of the table cells will give your table a look of a calendar.

 

  1. Click Add Content in any Content Block or click on the three dots next to an existing Text Block. If you don't have any Content Blocks available, click Add New Row to add a row of Content Blocks.
  2. Select Text from the menu.
  3. Enter a Title for the Content Block.
  4. Click on the Center icon.
  5. Click the Grid icon.
  6. Hover your mouse cursor over the number of columns and rows for your table and click to select.
  7. Click inside the cells of the first row to enter the days of the week.
  8. Highlight the first row, click on the Grid icon to select Cell > Properties, and next to Cell Type, select Header Cell. This will designate the first row as a header row to make your calendar table legible to screen readers used by visitors with a visual impairment.
  9. Highlight the rest of the cells in the table, select the Table icon > select Cell > Cell Properties.
  10. Next to H Align, select Left, and next to V Align, select Top. This will align the calendar dates that you will enter to the top and left corners of the cells.
  11. Enter the date numbers in each cell.
  12. Then click into each cell to enter your events. 

    Note: *When entering multiple lines of text into a cell, type your text and then press Shift + Enter to enter text on a new line within the same cell. 
     
  13. To differentiate the cells using color for various block schedules, highlight the cells with your mouse > select the Table icon > select Cell > Cell Properties > Advanced. 
  14. Click on the white square next to Background and select the color you'd like the cell to be and click OK when done.

    Note: *It's best to choose a light pastel color so there's enough contrast with the text. 
     
  15. Highlight and copy the color code listed as the Background color so you can reuse it in a different cell. 
  16. Click OK.
  17. Highlight other cells you would like to be the same color > select the Table icon > select Cell > Cell Properties > Advanced. 
  18. Click on the white square next to Background and paste in the color code copied in step 12 into the # field and remember to delete the # in front of the color code.
  19. Click OK.
  20. Highlight all the cells in the table and select the text color icon in the Rich Text Editor Toolbar. Choose Black to ensure the text color stands out and is easy to read.
  21. You can highlight any text you'd like to further stylize by using the Bold or Italics icon.
  22. When your calendar table is complete, click Save > Done Editing > Update Published.

 

Note: When specifying a set width and/or height for a table, the responsiveness of your homepage may cut off the table based on the visitor's screen size.

 

Questions? Contact your site administrator or eChalk Support at support@echalk.com.

 

Last modified

Tags

Classifications

This page has no classifications.