What happened to the font? Who knew that WordPress could do that! Doesn’t your theme lock you into a font style site wide? Isn’t every page in WordPress supposed to look the same? Not so fast, sparky!
A lot of the differences between these pages are implemented via the GP Premium Plugin purchased from GeneratePress. I highly recommend GeneratePress as a WordPress Theme. I also strongly recommend purchasing the plugin. In other instances on these pages I have used CSS in the Child Theme’s style.css file. I have created a custom plugin to leverage JavaScript on some pages. I will identify in each instance how the differences were achieved.
This page uses the style.css of the Child Theme to change the color of the Menu. I am also moving the Site Title and the Tag Line to the right, and the Logo to the Left. The copyright area has the same color as the Menu. The font for the page has been changed to Fontdiner Swanky using both PHP and style.css. However, every other paragraph is being reverted to the Open Sans default font. I wanted the difference to be dramatic. I also increased the font size to 125% with style.css to make it more readable. These changes are not view-able on Mobile.
The Home page has a video using Generate Page Header, which is part of the GP Premium Plugin. By contrast, the About page has a random video on each page load, using additional PHP code, and a JavaScript feature that keeps loading random videos as you stay on the page. I show you how to achieve this effect on WordPress Random Video Backgrounds.
The Examples page has a different color than the Default Menu. This effect is not view-able on mobile devices. All of these effects are implemented using the style.css of the Child Theme I have active. I tell you how to create a Child theme on my blog post: Should I Use A Child Theme in WordPress – No Question!
The Blog archive page uses the style.css of the Child Theme to hide the Site Title and the Tagline. Other than those changes, it is the standard out-of-the-box Blog archive page with styling provided by the Theme.
The Thanks page and the Contact page both use style.css in the Child Theme to change the look and feel and position of the Menu. These menu effects are not view-able on mobile devices. The copyright area has the same color as the Menu. On the Thanks page I am also moving the Logo to the left and the Site Title and Tagline to the right. The Contact page also uses the Generate Page Header, which is part of the GP Premium Plugin, to change the default logo on the page.