Elegant Theme comes with theme options that are used to set up various parts of your site.
Elegant Theme comes fully loaded with its own custom theme options. This is where you can control things like your theme colors, font sizes, templates, typography, and so much more. These options can be accessed in the Quizier Dashboard menu under Appearance > Settings > Theme Options.
The Theme Options are well organized and self explanatory, in this article we will go over some of the customization options.
General Settings
The Elegant Theme comes with builtin dark mode option and that require dark and light both logo's. The logo settings are available in Settings > General tab where you can upload both Dark and Light logos.
Navigation
There are two new navigation spots (Above Slider and Below Slider) in Elegant Theme that you can change from the General tab of Theme Options. Your Quizier menus will appear in the dropdown list so you can select or disable navigation links.
Dark More
The dark mode option settings are available in General Tab of Theme Options. Here you can either disable the dark mode completely or make dark mode your websites default mode. Once enabled the dark mode switch will appear for all logged in user navigation.
Transparent Header
Transparent header option is available in General tab of Theme Options, what this option does is make you navigation bar float on the slider.
Full-width Header
If you want to change your header container to full width then you can enable an option from theme options. The fullwidth header option is available in General tab of Theme options. By Default fullwidth header option is disabled.
Single Post Container Width
In some cases you may want to change the width of single post page, this option is available General tab of Theme Options. You can enter width in pixels or percentage (i.e. 1120px or 90%). Default single post width is set to 1120px.
Theme Templates
Elegant Theme have multiple variables of different elements and the settings are available in Settings > Theme Options > Templates. You can select different templates to change the layouts.
Theme Colors
Elegant Theme Gives you the feeding to customize the colors of several elements so you can easily customize the colors to match with your branding. The color options are available in Theme Options > Font Colors.
Font Sizes
You can easily change the text sizes of various elements within Theme Options, The sizes options are available in Theme Options > Font Sizes. You can either use the sizes in pixel (px) or root element's font-size (rem) 1rem = 16px.
Body Lineheight
The body line height can be changed from Font Line Height section in Theme Options. The default line height is 1.42857.
Typography
You can easily change the typography of your website from Theme Options, The Typography settings are available in Theme Options > Typography. Elegant Theme uses "Nunito" font for both headings/titles and body text. If you wish to change it to some other then Elegant Theme Includes the list of 100 top fonts from Google font library.
Elegant Theme use regular,300,600 and 700 font variant for body texts and regular and 700 for the Headings. Remember to pick the same variant when you select different font to have a better performance.
More Customization?
If you want to customize any thing other then the option given in Theme Options you can always use the Custom CSS option in Settings. To access custom CSS Option go to Settings > General > Integration.