Twenty Nineteen (2019) theme By the WordPress team: CSS Style Modifications and documentation of Header, Footer, Menu, widget, Contents and more

WordPress Twenty Nineteen  (2019) theme is the latest theme for the year, developed by WordPress Team.  Creating Professional Business websites is the main focus of the theme. Also, they have created several child themes for this which you can check too.

You can check the Demo of Twenty Nineteen theme.

You can download Twenty Nineteen (2019) theme.

If you want to change site title font color, font size and font family  of Twenty Nineteen (2019) theme By the WordPress team

.site-title a {
color: darkred !important;
font-size: 3rem;
font-family: cursive !important;
}

To change font size, font weight, color and font family of site description of Twenty Nineteen (2019) theme By the WordPress team

.site-description {
color: darkred !important;
font-weight: normal;
font-family: cursive !important;
font-size: 23px !important;
}
You can ask question regarding any issue you are facing in comments section.

Or can take my personal help.

To change Menu items ( Parent items) font size, weight, color and font family

.main-navigation .main-menu > li > a {
font-weight: 700;
font-size: 17px !important;
color: darkred !important;
font-family: cursive !important;
}

** To change sub-menu down arrow font color

span.submenu-expand {
color: darkred !important;
}

To change Menu items (Parent menu items) hover color

.main-navigation .main-menu > li > a:hover, .main-navigation .main-menu > li > a:hover + svg {
color: blue !important;
}

To change sub-menu items background color to different one

.main-navigation .sub-menu {
background-color: darkred !important;
}

To change sub-menu items color, line height, font size, font boldness (weight) and font family

.main-navigation .sub-menu > li > a, .main-navigation .sub-menu > li > .menu-item-link-return {
color: #fff;
line-height: 1.2;
font-size: 16px !IMPORTANT;
font-weight: normal;
font-family: cursive !important;
}

To change sub-menu items hover or focus background color

.main-navigation .sub-menu > li > a:hover, .main-navigation .sub-menu > li > a:focus, .main-navigation .sub-menu > li > .menu-item-link-return:hover, .main-navigation .sub-menu > li > .menu-item-link-return:focus {
background: green !important;
}

To change font size, color and font family of  Titles of  Posts, Pages, Blog page posts, category page posts etc

.entry-title, .entry-title a {
font-size: 21px !important;
color: darkred !important;
font-family: cursive !important;
}

To reduce gap between posts in blog , archive, category, tag or search page

.home .entry, .archive entry {
margin-top: 0px !important;
}
.home .entry .entry-footer, .archive .entry .entry-footer {
margin-top: 0px !important;
margin-bottom: 0px !important;
}
.home header.entry-header, .archive header.entry-header {
margin-top: 0px !important;
}

If you are not using post thumbnail then use the code below to reduce gap between post title and post contents

figure.post-thumbnail {
margin-top: 5px !important;
margin-bottom: 5px !important;
}

.entry .entry-content > *, .entry .entry-summary > * {
margin-top: 10px !important;
}

In single post if you want to reduce gap just above the post content

.single .site-header.featured-image {
margin-bottom: 12px !important;
}

To change font size, color and font family of comments title “Join the conversation”

h2.comments-title {
font-size: 23px !important;
color: darkred !important;
font-family: cursive !important;
}

To reduce gap just above and below  of comments title “Join the conversation”

.comments-area .comments-title-wrap {
margin-top: 12px !important;
margin-bottom: 12px !important;
}
ol.comment-list {
margin-top: 12px !important;
}
div#comments {
margin-top: 12px !important;
}
nav.navigation.post-navigation {
margin-bottom: 12px !important;
}

To change Comments Author font size, color and font family

.comment-author.vcard * {
font-size: 15px !important;
color: darkred !important;
font-family: cursive !important;
}

If you don’t want to show comments date in comments section

.comment-metadata {
display: none;
}

To reduce gap just above and below comments content

.comment-content {
margin-top: 5px !important;
margin-bottom: 5px !important;
}

To change comments content font size, color and font family

.comment-content {
font-size: 19px !important;
color: darkred !important;
font-family: cursive !important;
}

**** Footer widget section ****

To change font size, color and font family of footer widget title

h2.widget-title {
font-size: 19px !important;
color: darkred !important;
font-family: cursive !important;
}

If you want to remove the border just above the footer widget title

h1:not(.site-title):before, h2:before {
display:none !important;
}

If you want to use background color just behind the widget title

h2.widget-title {
background: darkred;
color: white;
text-align: center;
padding-bottom: 12px;
}

If you want to change font size, color and font family of footer widget links

footer#colophon li a, footer#colophon li {
color: darkred;
font-size: 15px !important;
font-family: cursive !important;
}

*** Next / Previous Post Links Modificatins ***

If you want to change the font size, color and font family of the text “Next Post” and “Previous Post”

.post-navigation .nav-links a .meta-nav {
color: #767676;
font-size: 16px !important;
font-family: cursive !important;
}

To change Next Post and Previous Post title links font color, size and font family

.post-navigation .nav-links a .post-title {
font-size: 23px !important;
color: darkred !important;
font-weight: 400;
font-family: cursive !important;
}

If you want to use footer copyright info or Proudly Powered By WordPress in Twenty Nineteen (2019) theme By the WordPress team

Go to your dashboard. Then Appearance > Editor > footer.php . Please check the screenshot for better understanding and use the code i shared below the screenshot to change copyright info

				© Copyright 2018 or 2019
				<span class="sep"> | </span>
                Message about your company

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
Child Themes of WordPress Twenty Nineteen (2019) Theme
Creating Prefessional Business Websites with twenty Nineteen (2019) theme using WordPress Latest Gutenberg Editor blocks  

Creating Prefessional Websites For Natural, Organic Items  with twenty Nineteen (2019) Child theme Friendly Business  using WordPress Latest Gutenberg Editor blocks  
Download Friendly Business Child Theme
See Friendly Business Child Theme Demo

Creating  Websites to showcase your Stylish Rooms and Quallity Products using twenty Nineteen (2019) Child theme Calm Business.  
Download Calm Business Child Theme
See Calm Business Child Theme Demo
Your chic establishment needs an equally chic website to showcase your stylish rooms and quality products. With its solid typography and peaceful color scheme, Calm Business exudes a tranquil, inviting atmosphere that’s an especially good fit for bed and breakfasts, time-share rooms, and brick and mortar stores.

Like this post?
Tweet
Email
WhatsApp
Print
Like this:
Like Loading...


	
Related