Moodle Theme Development by Hillar, Silvina Paola -- Read -- Imperial Library of Trantor

Index

Moodle Theme Development

Moodle Theme Development Credits About the Author Acknowledgements About the Reviewer www.PacktPub.com

Why subscribe?

Dedication Preface

What this book covers What you need for this book Who this book is for Conventions Reader feedback Customer support

Errata Piracy Questions

1. An Introduction to Moodle 3 and MoodleCloud

Understanding what e-learning is Learning about Virtual Learning Environments

Designing, creating, storing, accessing, and using course content Delivering or sharing course content Communicating, interacting, and collaborating with students and teachers Assessing and personalizing the learning experience Modularizing both activities and resources Customizing the interface

Learning Moodle and MoodleCloud Using Moodle on different devices Sizing the screen resolution

Screen resolution chart Calculating the aspect ratio

Learning about sharp and soft images Learning about crisp and sharp text Understanding what anti-aliasing is Test your knowledge Summary

2. Themes in Moodle 3 on-premises and MoodleCloud

Understanding what a Moodle theme is Learning about Moodle themes in MoodleCloud Using HTML tags to define colors Customizing Moodle or MoodleCloud's theme More using HTML to define colors Understanding types of Moodle and MoodleCloud themes User themes Course themes Category themes Locating the Moodle theme directory Selecting and downloading a Moodle theme for Moodle 3 on-premises Installing a Moodle theme Test your knowledge Summary

3. Setting Up Logos in Moodle Themes

Designing a logo Adding the logo to MoodleCloud in the More theme Adding the logo to the Essential theme in Moodle on-premises Downloading a Favicon Changing the Favicon in the Essential theme in Moodle on-premises Adding a header background image in the Essential theme to Moodle on-premises Test your knowledge Summary

4. Customizing the Header and the Footer

Adding footnotes in MoodleCloud Adding social networks to header Customizing the footer in Moodle on-premises Essential theme Editing front page area content Creating a slide show in the front page area content Test your knowledge Summary

5. Customizing Elements with CSS

Customizing the height and width of an element with CSS Setting the height and width of an image element with CSS Locating the information of an image element Customizing the height and width of an element in Moodle on-premises with CSS Customizing the height and width of an element in MoodleCloud with CSS Using Sublime Text to edit code Locating the information of a title element Customizing styles of elements using the enjoycss website Editing the code to customize the style of elements Testing the code Changing the elements in Moodle on-premises Test your knowledge Summary

6. Locating, Editing, and Using New Icons

Locating the icons in our Moodle on-premises course Locating the icon file in the server Downloading Inkscape Editing an SVG file Converting SVG files to PNG files Checking the properties of the PNG file Replacing the SVG file Replacing the PNG file Testing the new icon in Moodle on-premises Locating Add an activity or resource icons in our Moodle on-premises Rendering parts of icons Test your knowledge Summary

7. Optimizing Themes for Mobile Devices

Downloading Google Chrome web browser Enabling device mode Editing an emulated device Adding a custom device Checking network throttling profiles Emulating network connectivity Test your knowledge Summary

8. Exploring Layouts

Exploring themes suitable for academic use

Contemporary Aardvark Academi Adaptable eGuru Pioneer Dynamic Eduhub Snap Sharp Klass

Exploring themes suitable for corporations, companies, and professionals

Rocket Shoehorn

Exploring themes for personal use

Sharp

Exploring two-column themes

Elegance

Exploring website themes

Crisp

Exploring miscellaneous themes

Archaius Bootstrap Roshnilite Campus Morecandy Ulkit Aigne Flexibase Decaf Afterburner Bootswatch Cerulean Splash Serenity Anomaly Shoelace Flexpage Overlay

Comparing and contrasting all the themes Test your knowledge Summary

9. Course Formats

Creating a Moodle course Exploring the topic course format Changing a course format Downloading a course format plugin

Selecting the Grid course format

Exploring plugin course formats

Collapsed topics Socialwall format Onetopic format MindMap format Periods format Flexible sections format Buttons format Board (Grid and Blocks) format Mansonry topics format eTask topics format Menutopic format Flexpage format GPS format Columns format Noticeboard format Folder view format NED tabs course format

Test your knowledge Summary

10. Extending Moodle Theming to Specific Sections

Putting all the pieces together Organizing course content Adding blocks to enhance a theme Uploading a logo in a description section Social networks, headers, footers, and breadcrumb styles Coding with CSS in Moodle Logos, images, and icons Dealing with different devices Course formats and layouts The result Summary

A. Test Your Knowledge Answers

Chapter 1, An Introduction to Moodle 3 and MoodleCloud Chapter 2, Themes in Moodle 3 on-premises and MoodleCloud Chapter 3 Setting up Logos in Moodle Themes Chapter 4, Customizing the Header and the Footer Chapter 5, Customizing Elements with CSS Chapter 6, Locating, Editing, and Using New Icons Chapter 7, Optimizing Themes for Mobile Devices Chapter 8, Exploring Layouts Chapter 9, Course Formats

← Prev
Back
Next →

← Prev
Back
Next →