DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 970,177 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Zafer Zent
Zafer Zent

Posted on • Originally published at dev.to on

Hyde

Hyde Hyde Blogger Theme is a simple theme made by Mark Dotto for Jekyll and adapted by us for blogspot.

The theme has 8 different color options except the default and is used by adding a class to the tag. But we have made it dynamic by using jQuery cookies as a convenience. As can be seen from the preview address, color changes can be made with one click. We used this to show the sidebar on the right as well. Moreover, since this change is saved through cookies, it does not change on page refresh or on subsequent visits. Let's not forget that this feature is a first in blogger themes. This feature is only valid for the visitor who made the change. If the same color will be reflected to all users statically, it is necessary to add a class name to the body tag manually.

Class names for static color change

theme-base-08
theme-base-09
theme-base-0a
theme-base-0b
theme-base-0c
theme-base-0d
theme-base-0e
theme-base-0f
Enter fullscreen mode Exit fullscreen mode

pre{padding: 10px; overflow: auto; font-size: 15px; background: #f7f7f7 !important; color:#000} Use of :

body class="theme-base-08"
Enter fullscreen mode Exit fullscreen mode

How to get the sidebar to the right side

body class="layout-reverse"
Enter fullscreen mode Exit fullscreen mode

How to show sidebar on right side with different color setting

body class="theme-base-08 layout-reverse"
Enter fullscreen mode Exit fullscreen mode

Live Preview

Download

Source : Hyde Blogger Theme

Top comments (0)

🌚 Life is too short to browse without dark mode