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

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

h1.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.

twenty nineteen theme by the wordpress team menu and child or sub menu items modification

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

twenty nineteen theme by the wordpress team reducing gap between posts in category blog archive 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

twenty nineteen theme by the wordpress team reducing gap between post title and post content in category blog archive or search page

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

twenty nineteen theme by the wordpress team reducing gap just above the post content in single post

.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;
}

twenty nineteen theme by the wordpress team reduce gap just above or below the comments title Join the conversation

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;
}

 

twenty nineteen theme by the wordpress team comments section modification

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 ****

twenty nineteen theme by the wordpress team footer widget title links and border modifications

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 ***

twenty nineteen theme by the wordpress team Next Post and Previous Post modifications

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

twenty nineteen theme by the wordpress team footer proudly powered by wordpress removal and company info modifications

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

Pay me some, I will help you for CSS Issue Personally CLICK HERE….

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: