Customization through Custom Styles (CSS)
Making your own customizations in
Pressbooks
In this chapter, we’ll guide you through the exciting possibilities of using CSS to tailor your Pressbooks experience to your specific needs
For any customizations that you’d like to make that are not currently available as Theme Options, you may want to consider whether you have the time, resources and expertise to create your own Custom Styles. Custom Styles are any CSS (Cascading Style Sheet) changes that you add to the base theme of your book. You can view and edit the CSS for your book by going to Appearance >> Custom Styles from the left sidebar menu of your book’s dashboard. Similar to theme options, the stylesheets are broken into three sections according to the format you wish to style
The first section of the page, Theme Styles, will include a scrolling box that contains the entire stylesheet (aforementioned CSS code) for a given format. The contents of the stylesheet are dependent on the theme you’ve chosen. This section is not editable, but is very useful for reference. To fully understand the changes that you can make using CSS, study this stylesheet well to identify the current design and map out the modifications that you would like to make.
The second section, Your Styles, is where you can make any edits or additions to the stylesheet. Any CSS added in this section will override existing styles for the same class. After identifying the element specific styles, you can copy the corresponding code to override the original theme styles for that element. You can also create your own components or classes to use in the textbook.
Pressbooks prepares files in multiple formats, including PDF, ebook, and web. Each format is created using a specific stylesheet designed for its unique requirements, so you will need to select which you edit every time, and make sure you make changes in all three stylesheets if you would like the three formats to reflect each other. To switch between formats, choose from the dropdown menu at the top of the custom styles page. You can select either web, ebook, or PDF.
Recommended Practice: Have a private page to perform trials for any CSS modifications.
Important Points for Advanced Users (Familiar with CSS)
- Pressbooks doesn’t allow you to write an entire theme in CSS but instead, you modify the existing ones by overriding the default theme’s stylesheet. Therefore, even if you have used CSS before, there are some changes in the way that you would’ve to write code. Explore the Theme Stylesheet (First Section of Custom Styles).
- Use XHTML export to isolate particular classes and elements when studying the Theme Stylesheet.
- When creating a new class, make sure to create the formatting for different text types (i.e P, H1, H2, etc) so that when the div command is used in the HTML of a particular section or part, you are able to make the whole class separately from the rest of the page.
- The part “Complex Design Examples” in the back matter of this book features some advanced customized CSS designs created by the Concordia community. Feel free to explore this section and the relevant CSS code for some inspiration and guidance with your designs.
