Community Forums › Forums › Archived Forums › Design Tips and Tricks › Making the titles a different color
- This topic has 14 replies, 2 voices, and was last updated 8 years, 6 months ago by designerwriter.
-
AuthorPosts
-
October 8, 2015 at 11:54 pm #167711designerwriterMember
I want to add color to the titles on this page. I was initially going to use the <font> tag but when I checked on W3Schools, it stated that it was not compatible with HTML5. So then I downloaded the Text Selection Color plugin, selected the text, but couldn’t find the icon where I change the color. I went into settings to change the color to what I wanted. That worked. But I couldn’t change the color of the title along with the publication. Is there a simpler way to change it besides CSS? That’s why I retrieved the plugin.
Please advise. Thanks in Advance.
http://magazinepro.eagleheartdynamic.com/writing-print-5/October 9, 2015 at 1:33 pm #167754designerwriterMemberNot sure how long it will take to get an answer but if I find out before I get an answer, I will post it here. I would use the <font> tag but it’s not visible or compatible with HTML5 so not sure what to do now. That’s why I posted this question.
October 10, 2015 at 9:22 am #167796designerwriterMemberCan anyone answer this question?
October 11, 2015 at 12:03 am #167844designerwriterMemberI didn’t know that about bumping my own thread thanks for letting me know and thank you for the answer. However, regarding this answer...the heading is just part of the body copy bold and italicized but I don’t like how bold it is. I would rather bold it through the heading family since I can use numbers.
My question is, how would I apply say a heading about the size of the body copy and make it a different color without changing the other heading colors? I just want the headings of the article titles and the publication blue in the writing section. Thank you.
October 11, 2015 at 7:52 am #167850IDX LeadsMemberTitles should be wrapped in h tags. Remove the strong tags and replace them with your choice of h1 through h6. Then style heading the way you want it. If you don't want to change the size and color of the headings across your entire site place the content of the page in a unique div class and style the heading in that unique class only.
.unquedivclass h3 { color: #333; font-family: 'Helvetica', sans-serif; font-weight: 500; line-height: 1.2; margin: 0 0 16px; }
Esse quam videri
October 11, 2015 at 9:55 am #167853designerwriterMemberGreat thanks! So do I place this at the bottom of the CSS page to override the original code for this heading? Thanks.
Grace
October 11, 2015 at 11:37 pm #167889designerwriterMemberWell, that didn’t work. I am using the h5 heading. I wasn’t sure where to place it. I put it at the end of the CSS document before the last bracket then I tried to put it after the last bracket. I even placed it after the original code similar to this under the h1-h6 headings. I changed the 333 color to #002f87 as a test but it did not change. Can you please tell me why? Thank you.
October 12, 2015 at 6:32 am #167905IDX LeadsMemberOK, I am going to give this one more shot, and I am going to keep it as simple as possible. This will change all of your h5 titles to #002f87 across your entire site. The rest of the h titles will remain the color they currently are. In your style sheet where you see this
h5 { font-size: 18px; }
make it look like this
h5 { font-size: 18px; color: #002f87; }
You will then need to finish adding h5 titles to the content of the page, and change the one below the entry title from h6 to h5.
Esse quam videri
October 12, 2015 at 9:04 am #167923designerwriterMemberThat’s a lot simpler. So what happens with this code then?
.unquedivclass h3 {
color: #333;
font-family: 'Helvetica', sans-serif;
font-weight: 500;
line-height: 1.2;
margin: 0 0 16px;
}Where does it go or is your new instruction an easier way to do it?
So what if on another page, I want h5 the same color as the body copy and only want the blue for the titles in this section. Then what do I do?
October 12, 2015 at 10:28 am #167929IDX LeadsMemberJust ignore everything in this thread prior to my post number 167905.
Yes, as stated this is the simplest way to change the color of your h5 titles to the color you want them to be.
For any concerns you may have beyond the scope of simplest approach this is an excellent resource.
http://www.w3schools.com/html/html_classes.asp
Esse quam videri
October 12, 2015 at 10:58 am #167931designerwriterMemberBut what about this question that was not answered?
So what if on another page, I want h5 the same color as the body copy and only want the blue for the titles in this section. Then what do I do?
Yes I use W3Schools..but I wanted to get another opinion since I can’t use the font function because it is not compatible with HTML5.
October 12, 2015 at 11:26 am #167933IDX LeadsMemberI can't open that link for you.
Esse quam videri
October 12, 2015 at 1:36 pm #167943designerwriterMemberSo no answer to this question?
October 12, 2015 at 2:03 pm #167949IDX LeadsMemberPrior to this, you have been provided 5 answers, 1 of which I did not provide and has now disappeared, and another that I did provide that appears to be beyond the scope of your CSS skill set at this point in time. That's OK. Subsequently I provided a simpler solution so that you can style your page they way you want it styled. Assuming you don't want to pay anyone to teach you CSS, or pay anyone to do the work for you, you will need to continue relying on the generosity of this community's members, or learn using the same tools and techniques most here used to improve their own CSS skills.
Alternatively, I suggest you go back to exploring plugin options, but I don't have suggestion with regard to that.
Esse quam videri
October 12, 2015 at 2:54 pm #167955designerwriterMemberCan someone else answer my question please?
So what if on another page, I want h5 the same color as the body copy and only want the blue for the titles in this section. Then what do I do?
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.