Jump to content


This topic is now archived and is closed to further replies.


Change Text Header Color within WP Content/Loop

Recommended Posts


I am working on a DMS2 website and wish to change the Text Header Color from black to a brown color #7D7760.


I will use this page as an explantation http://www.collegefinancial-consultants.com.php53-24.ord1-1.websitetestlink.com/services


If I change all Text Headers in the Custom Less/CSS headers it will change all text headers in the site to the brown color.  For example the cream colored Services title in the page header will also change to brown and against the brown background it will dissapear.  I wish to just change the Text Header font color selectively in the WP Content/Loop only.


I tried something like the following without success.


.my-cream-area {

background-color: #E6DC9F;                (this would set the light cream background)

h1,h2,h3,h4,h5,h6 color: #7D7760        (this would set the text headers to brown)

color: black;                                           (this would set the body text to black)



My attempt was to add this my-cream-area into the WP Content Loop Custom Style Class field and by doing this it would not change all Text Headers throughout the entire site and overwrite the custom class I have in the top page header thereby keeping the text and subtext at the top in a cream color.


Thank you for the assistance



Share this post

Link to post
Share on other sites

Hi Chules,


The above code isn't valid CSS:


my-cream-area {
background-color: #E6DC9F;                
h1,h2,h3,h4,h5,h6 color: #7D7760
color: black;
You can not include tags such as h1, h2 etc... in CSS rules like that. So you will want to remove that code asap.
Also, the Services title on your page, isn't part of the WP-Content/PostLoop section, it has been added by a completely different section called PageHeader. So I am not entirely sure what you're trying to achieve or change.
Or are you referring to this text - Our services consist of the following: ?

Please search our forums, before posting!

Share this post

Link to post
Share on other sites





Thank you for the reply. Everything is working correctly on that top page section with PageHeader.  The background is brown and the title and subtitle is a cream color.  What I'm trying to do is change the Text Header Title in the body section from black to brown #7D7760.  For example the following titles should be brown and ideally all of these text header colors should be brown throughout my entire site. 

Our services consist of the following: College Funding


However, if I noticed that if I add the following code into my Less/CSS area it changes all Text Headers to brown including those in the PageHeader section.  It's a global change and when enabled my PageHeaders have a brown background and brown text that disappears since it's against a brown background.  I want my PageHeader sections to have Text Headers that are yellow as is current but the other Text Headers in the body paragraphs to display brown #7D7760.


This code changes all Text Headers even those in the PageHeader section which I wish to leave as is.


h1, h2, h3, h4, h5, h6, p {
    color: #7D7760;



Share this post

Link to post
Share on other sites

Then all you need to do is prefix your code with the sections section-sectionName class like so:


.section-postloop h1,
.section-postloop h2,
.section-postloop h3,
.section-postloop h4,
.section-postloop h5,
.section-postloop h6 {
  color: #7D7760
However, as you have added these titles to the page/post yourself. You could simply create a class like so:
.brown-header {
  color: #7d7760;
Then add that class to the headers you have added yourself such as:
<h2 class="brown-header">Our services consist of the following:</h2>

Please search our forums, before posting!

Share this post

Link to post
Share on other sites

  • Similar Content

    • Lisa Haran
      By Lisa Haran+
      I have a map here http://www.iloveoffset.com/maps/
      I want to add several pointer locations to the map, but when I do they do not appear.
      On this map there are 2 pointer locations and as you can there is only one visible.
      Earlier today I added 7 and could only see 4 so there is something odd going on.
      My theme is up to date
    • clj182
      By clj182+
      I've been having trouble unlocking the template section for past couple of weeks. When I try clicking nothing happens. 
      I've deleted my custom css and removed plugins. Im down to having only the following plugins:
      Contact Form 7
      DMS Professional Tools
      Pagelines Updater
      It was working fine before i have no idea what's going on with it.
    • flourishdesignstudio
      By flourishdesignstudio+
      My DMS 2 site http://www.heart-stone.com/ will not save any new custom css... I can still edit templates and publish those but any custom css that I enter never saves.
      All WP files, themes, and plugins are up to date. 
      Any thought about what might be causing this?
    • flourishdesignstudio
      By flourishdesignstudio+
      Is there a way to edit the custom CSS via FTP? I know I can edit the custom code in the Chrome editor but is there a file path I can use to find and edit the CSS directly from our FTP?
      Thanks in advance for the help!
    • nizami
      By nizami+
      Using navbar section with correctly configured WP menu to display main navigation at https://elenaangel.com. 
      All fine in desktop viewport. Menu displays twice in hamburger mode. How to fix this please?