Moodle Theme Development电子书

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