Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

How do I change the font for this H1 style?

Posted on 2014-08-18
13
Medium Priority
?
172 Views
Last Modified: 2014-08-18
I have a site here:

http://plumthree.com/advantagepress/sample-lessons/

and I need to change the font color and size of the H1 tag (where is says "Sample lessons are available for...").

But I cannot find where to do this in the style sheet.

Any help is appreciated.
0
Comment
Question by:Donnie Walker
  • 6
  • 4
  • 2
  • +1
13 Comments
 
LVL 6

Expert Comment

by:Chad Franks
ID: 40267630
Copied from:
http://www.w3schools.com/html/html_css.asp

Example

body {
    color: blue;
}

h1 {
    color: #00ff00;
}

h2 {
    color: rgb(255,0,0);
}

Open in new window

0
 

Author Comment

by:Donnie Walker
ID: 40267636
I know how to do that.

I need to find where in the style sheet the H1 is changing the font, size, etc.
0
 
LVL 15

Expert Comment

by:Edwin Hoffer
ID: 40267677
As I can see you have to change the setting in .page-title h1 class from index page.

The current font size is 18px and color is #333333

This class maybe in your header.php page.

Thanks
Edwin
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 

Author Comment

by:Donnie Walker
ID: 40267700
I see no style changes in header.php.

and when I try to change this:

.page-title h1{
      font-weight:normal;
      font:18px 'MuseoSlab500Regular', arial, helvetica, sans-serif;
      line-height:26px;
      color:#343333;
      margin:0;
      padding:0;
}

nothing changes.

Any ideas?
0
 
LVL 6

Expert Comment

by:Chad Franks
ID: 40267708
If you go to the folder where the files are located and edit the:

body.page.page-id-5652.page-template.page-template-full-width-php.light

You will see the entry:

//*[@id="post-5652"]/div/h1

This is the header information for the header in question.
0
 

Author Comment

by:Donnie Walker
ID: 40267714
and where is that?
0
 
LVL 3

Accepted Solution

by:
viseera earned 2000 total points
ID: 40267769
I can see there are so many inline styles created. Not well organized in external style sheets.

I found
.post-content h1{
      font-size:32px !important;
            line-height:48px !important;
}

this is the one called for the particular location.
If you are able to find and edit this, you are done with the size update.

I found the color code applied in style.css line # 6766
you could edit there.


Seetharaman.N
0
 

Author Closing Comment

by:Donnie Walker
ID: 40267791
Thanks! This one was driving me nuts.
0
 

Author Comment

by:Donnie Walker
ID: 40267854
Line 6766 on the style sheet is this:

#mobile-nav li.mobile-nav-item li li a:before  {
      content: "--";
      margin-left:6px;
      margin-right:2px;
}

can you give me the tag to search by instead?
0
 
LVL 3

Expert Comment

by:viseera
ID: 40267868
.post-content h1, .title h1, .woocommerce-success-message .msg, .single-product .woocommerce-message {
    color: #333 !important;
}

Find out this line.

Seetharaman.N
0
 
LVL 3

Expert Comment

by:viseera
ID: 40267876
and change only .post-content h1

.post-content h1{
color: #your desired color code
}

not the others.. if you change it there, it would affect all other styles also.
0
 

Author Comment

by:Donnie Walker
ID: 40267882
thanks again!
0
 
LVL 3

Expert Comment

by:viseera
ID: 40267918
You are welcome.
0

Featured Post

Receive 1:1 tech help

Solve your biggest tech problems alongside global tech experts with 1:1 help.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
Suggested Courses
Course of the Month13 days, 5 hours left to enroll

578 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question