How to add custom CSS for only ‘Posts’

  • Resolved althafrahman

    (@althafrahman)


    3 years, 11 months ago

    Hi there!

    I have put the following CSS for styling my article’s title and meta:

    .inside-article entry-title {
	text-align: center; 
	color: #15b562;
}

 .entry-header {
	text-align:center;
	 color: #595959;
    border-bottom-width: 3px;
    border-bottom-color: #15b562;
    border-bottom-style: solid;
    padding: 10px;
}

.author-name {
	font-weight:600;
}

    It works, but the problem is the same style is applied to other Pages on the website as well.

    Like this: https://app-60080014c1ac18031c64f891.closte.com/

    How can I avoid this?

    How can I add custom CSS for only posts but not for other pages like archives?

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi there,

    WordPress adds classes to the <body> tag that identify various things about the page including the post type. The class it adds for posts is single-post which you can use in your CSS:

    .single-post .inside-article .entry-title {
  text-align: center;
  color: #15b562;
}

.single-post .entry-header {
  text-align: center;
  color: #595959;
  border-bottom-width: 3px;
  border-bottom-color: #15b562;
  border-bottom-style: solid;
  padding: 10px;
}

.single-post .author-name {
  font-weight: 600;
}
    Thread Starter althafrahman

    (@althafrahman)

    Thank you, it works!

    You’re welcome

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to add custom CSS for only ‘Posts’’ is closed to new replies.