Unable to change header color in theme without changing all headers

  • Hi,

    I recently changed my WordPress theme and I am having difficulties in returning it to it’s original state. One of the problems I’m seeing is that when I attempt to change the color of headers, all headers in my WordPress site (i.e. all HTML elements with the <H1>, <H2>, <H3>…<Hn> tag) also change colors. This is not ideal. Various headers are scattered throughout the website with different backgrounds, and a different color is required for each.

    How can I change the color of all page titles? (But not of all headers at the same time.)

    Thanks,
    Tameem

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

  • you can use custom css to define a header color.

    Example: change H1 header to blue color
    h1 {color:blue;}

    Thread Starter tameembis

    (@tameembis)

    Strangely none of the CSS changes have been working. Here is a sample HTML snippet from my page:

    <title>Boston Islamic Seminary | Community Outreach Programs</title>

    Here is a snippet from my custom CSS stylesheet:

    #title {color:blue;}

    I also tried:
    .title
    title

    None of those modifications work. To check my modifications I select “save as draft”, then I click on the preview link generated but my webpages look the same.

    What are some potential issues that nullify CSS stylesheet changes?

    we don’t set css to <TITLE>, it is the text you see in web browser tab, which we cannot set its color.

    Please share your website URL and a screenshot to show the title you want to change color.

    • This reply was modified 3 years, 11 months ago by lcf.
    Thread Starter tameembis

    (@tameembis)

    Thank you for your help.

    Here is a sample URL: https://www.bostonislamicseminary.org/aboutus-2-2/

    I can’t find the option to attach a screenshot here. However as you can see on the specified URL, the title of the page and any text that is set to a Header type has the same color.

    We want the title of the page (Why The Seminary?) to be white. Whereas the footer of the page (the bottom centered e-mail address and the Boston Islamic Seminary footer title in the top left of the footer) should be dark grey.

    Thread Starter tameembis

    (@tameembis)

    For what it’s worth, kindly find the CSS script for the page below. Unfortunately the changes I have made to this CSS sheet are not actually affecting the page. 

    #header{
width: 100%;
height: 100%;
background: #253B86
}

title {color:blue;}

#footer {
  background-color: #4f5b66;
	background-image:url(https://www.bostonislamicseminary.org/wp-content/uploads/2020/06/Footer3-3.jpg);
	background-size: cover;
	background-position: 50% 50%;
	font-size:15px;
	padding: 50px 0;
	color: white;
	
}
#footer .copyright {
  
}

.h1 {color:blue;}

.themeum-breadcrumbs {
	display:none;
}

#sub-title {
	background-image:url(https://www.bostonislamicseminary.org/wp-content/uploads/2020/07/banner.png);;
}

.sub-title-inner {
	font: sans-serif;
	font-size: 80px;
	color:white;
}
.sub-title {
	background-image:url(https://www.bostonislamicseminary.org/wp-content/uploads/2020/07/banner.png);
}
    • This reply was modified 3 years, 11 months ago by tameembis.
    • This reply was modified 3 years, 11 months ago by tameembis.

    You want to change this header, correct? (screenshot: https://i.imgur.com/Qbk1A7l.png )

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Unable to change header color in theme without changing all headers’ is closed to new replies.