Tile Layout for Course Groups

The Tile Layout for Course Groups module requires additional files for ACEweb. Please contact your ACEware technician for installation files/instructions.

Rules that apply to the Tile Layout option:

• You must have an image for each 'tile'.
• You can use .png, .gif, and .jpg type images.
• All images must be the same size. E.g. all images must be 600px by 400px.
• Images must be placed in the ACEweb Images folder (e.g. wconnect\ace\images).
• Image names should be no longer than 12 characters.
• You can also use descriptions--if you do, all groups must have a description.
• All group descriptions must be about the same size. E.g. all should be approximately 100 characters.

1. Select Module > Codes > Code Type=COURSE: Grouping Codes.

2. Enter the image name only in the File Name for Image field for each group.  You don't need to enter the file extension (i.e. .png, .gif, .jpg).  

3. Enter the group description in the Detail field for each group.

The default Tile Layout is to display 3 tiles per row. If you want to display 4 per row:

1. Edit the gridGroups.css and set the flex-basis value in the .grpBox style to 23.6%.

.grpBox /* Group container. Flex-basis is set to determine # of boxes per row */

{

flex-basis: 23.6%; /* sets width of boxes */

...

2. Save changes to the gridGroups.css file.

3. Use the Ctrl+F5 shortcut to refresh your group page (forces the browser to reload the gridGroups.css file).