WordPress Premium Theme The Zuki by Elmastudio. Modify Header, Footer, Slider ,Widgets font, color, border styles and more using css

Before I shared CSS modifications of Theme Revelar by Automattic. Today I am sharing many important style or css modifications of The Zuki Theme by Elmastudio.It is a premium theme and you need to purchase it before using it. So if you are willing to purchase the theme and to modify it use the CSS code i have shared here.

1. If you want to change Zuki theme’s site title font color, font family and font size use this code.

#site-header h1 {
font-size: 28px !important;
font-family: arial !important;
color: black !important;
}

2. If you don’t want to show site description beside the Site title in the Zuki theme use this code

#site-header h2.site-description {
display: none !important;
}

3. If you want to change the Site description’s font color, font family and font size of The Zuki theme use this code.
#site-header h2.site-description {
font-size: 28px !important;
font-family: arial !important;
color: black !important;
}

4. If you want to modify the font, color and size of Header Top (right) menus in Zuki theme.

#header-top-nav a {
font-size: 12px !important;
color: blue;
font-family: times new roman !important;
}

5. If you want to change main menu font color, font size and font family of the Zuki theme use this code.

#site-nav ul li a {
font-family: times new roman;
color: darkred !important;
font-size: 24px !important;
}

5(a). If you want to change style of Sub menu use this code

#site-nav ul ul.sub-menu li a {
font-family: arial !important;
color: darkblue !important;
font-size: 18px !important;
}

5(b). If you want to change the Sub menu’s Hover

#site-nav ul ul.sub-menu li a:hover {
background: red !important;
}

6. If you want to reduce gap/space just above and bottom of the main menu

#site-nav {
padding-top: 12px !important;
padding-bottom: 12px !important;
}

7. If you want to change the style of Category/Archive page’s post title

.entry-title, .entry-title a {
font-family: times new roman !important;
color: darkred !important;
font-size: 28px !important;
}

8. If you want to change Category/archive page post author’s name font color, size and font family

.entry-author, .entry-author a {
font-family: times new roman !important;
color: darkred !important;
font-size: 16px !important;
}

9. In your category archive page if you don’t want to show the post author and Post date / category name use this code

.archive .entry-author, .archive footer.cf {
display: none !important;
}

10. If you want to change archive/category post font color, font size and font family in Premium Theme The Zuki by Elmastudio
.archive .entry-summary p {
font-family: arial !important;
line-height: 22px !important;
color: grey;
font-size: 17px !important;
}

11. In individual Post if you want to remove/hide category name, Author or date in Premium Theme The Zuki by Elmastudio

.single-post .entry-cats {
display: none !important;
}
.single-post .entry-author {
display: none !important;
}

.single-post .entry-date {
display: none !important;
}

12. In individual Post if you want to change font style of category name, Author or date in Premium Theme The Zuki by Elmastudio

.single-post .entry-cats {
font-family: arial !important;
color: grey;
font-size: 17px !important;
}
.single-post .entry-author {
font-family: arial !important;
color: grey;
font-size: 17px !important;

}

.single-post .entry-date {
font-family: arial !important;
color: grey;
font-size: 17px !important;
}

13. If you want to change Individual or single blog post title’s style use this code

.entry-header h1.entry-title {
padding: 15px 0 20px;
font-family: arial;
color: darkred;
font-size: 30px !important;
}

14. If you want to change Footer widget section title’s font color and styles in the Zuki theme.
*** this is applicable only for the footer widget section
#footerwidgets-wrap h3.widget-title {
font-family: times new roman;
font-size: 17px !important;
color: darkred !important;
}
*** Also if you want to put some border below the footer widget title and to reduce gap below the title use this code.

#footerwidgets-wrap h3.widget-title {
border-bottom: 1px solid darkred;
padding-bottom: 5px !important;
margin-bottom: 13px !important;
}

15. If you want to change footer widget section links font color, size, font family etc use this code

#footerwidgets-wrap li a {
color: blue !important;
font-size: 15px !important;
font-family: arial !important;
}

**** If you want to change the footer widget section links hover color use this code.
#footerwidgets-wrap li a:hover {
color: darkred !important;

}

16. Premium theme zuki has a Quote widget to show Famous person’s Quote ..and it use HTML’s blockquote tag. So to change the font family, color and style of Quote in Zuki theme use this code.

.front-fullwidth .widget_zuki_quote blockquote.quote-text, .front-content .widget_zuki_quote blockquote.quote-text {
font-size: 52px;
font-size: 23px !important;
font-family: arial !important;
color: darkred !important;
}

17. If you want to change Default sidebar widget title’s font color, size and font family of Theme Zuki

.default-sidebar h3 {
font-family: times new roman;
font-size: 17px !important;
color: darkred !important;
}

*** Like the footer widget title if u want to add a border below the sidebar widget title use this

.default-sidebar h3 {
border-bottom: 1px solid darkred;
padding-bottom: 5px !important;
margin-bottom: 14px !important;

}

18. If you want to change sidebar widget section link color, font family etc in Zuki theme
.default-sidebar li a {
color: darkred;
font-family: arial;
font-size: 16px !important;
}

*** Also if you want to change the default sidebar widget’s link hover color
.default-sidebar li a:hover {
color: darkblue;
}

19. In default sidebar widget if you want to change the Textwidget’s font color size and family

.default-sidebar .textwidget {
font-size: 14px;
color: black !important;
font-family: times new roman !important;
}

20. Under each single post if you want to change the Next and Previous post tile’s font styles use this code.

#nav-single a {
color: darkred !important;
font-size: 24px !important;
font-family: times new roman !important;
}

21. In single post page, if you want to give the Author Bio a different look

.authorbox.cf * {
color: white !important;
}
.authorbox.cf {
background: #222;
padding: 12px;
}

If you have any issue feel free to ask me question here in comments section

OR

You can take my personal help in skype : om2000_cuet