Installing different themes will allow us to give Galleria a different look and feel, and in this recipe we will explore how we can use themes and install them.
The theme we'll be working with is the classic theme that comes with the Galleria source code.
There are two ways by which we can load theme files into Galleria:
The first is to use the Galleria API to load the theme JavaScript file:
Galleria.loadTheme('../themes/classic/galleria.classic.min.js');
The only parameter the
loadTheme
function takes is a string that is the relative path to the theme JavaScript file.The second way to load the theme JavaScript file is simply to include the JavaScript file via the
script
tag as follows:<script src="../themes/classic/galleria.classic.min.js"> </script>
The theme JavaScript file needs to be loaded before the Galleria.run
function in order to start Galleria with the theme loaded.
The theme file will automatically load dependent CSS files required for the theme. It will additionally run initialization code for theme specific look and feel.
It's possible to dynamically change Galleria themes by loading other themes with the Galleria.loadTheme
function.
Galleria only comes with one free theme, the Classic theme, which comes with the Galleria source code. Other themes can be found at http://galleria.io/.
As of the writing of this book, there are no other useful sources for themes for Galleria. Sparse references to themes can be found in some github projects and also in some CMS Galleria integration packages. However, it's not easy to know how to use these themes without some customization, so we won't cover them in this book.