Book Image

Moodle Theme Development

By : Silvina Paola Hillar
Book Image

Moodle Theme Development

By: Silvina Paola Hillar

Overview of this book

Theming is one of the main features of Moodle, and it can be used to customize your online courses and make them look exactly how you want them to,according to your target audience. If you have been looking for a book that will help you develop Moodle themes that you are proud of, and that your students will enjoy, then this is the book for you. We start off by introducing Moodle 3 and explaining what it is, how it works, and what tools you might need to create a stunning Moodle theme. We then show you how to choose and change the pre-installed Moodle themes in detailed steps, and explain what Moodle themes are and how they work. Next, we show you how to change an existing theme and test the changes that you have made. You can not only plan the customization of theme, but also tailor it using advanced Moodle theming processes; this book is your one-stop guide to creating your own personalized Moodle 3 theme.
Table of Contents (19 chapters)
Moodle Theme Development
Credits
About the Author
Acknowledgements
About the Reviewer
www.PacktPub.com
Dedication
Preface

Converting SVG files to PNG files


We have just edited an SVG file but there are two types of files in Moodle. The type of file that Moodle is going to display depends on the web browser or the device that we use. That is to say, it will show either the PNG or the SVG. Thus, what we need to do is to have two identical files with different file extensions.

This transformation process has to be done with Inkscape software and we will convert the SVG to a bitmap image, in other words, we will convert the SVG file to PNG. Follow these steps in order to do it:

  1. Click on File | Export PNG Image..., as shown in the following screenshot:

  2. An information block appears on the right-hand side of the margin displaying information for the file, as shown in the following screenshot:

    Tip

    Within the block, the image size appears which reads: Width 24 pixels and Height 24 pixels. We need to check the number of pixels of the original PNG file in order to compare them to check that they are the same size. We cannot...