Adding Red Text to Homepage

Kentinada · December 2, 2017

I am trying to add some red formatted text to my homepage and the formatting isn't working. Here is what it looks like:

Here is what it looks like on edit mode and this is how it should look:

The HTML code is:

ON SALE THROUGH
December 24th

ONLY $10!

The CSS code is:

p {
font-size:28px!important;
color: black;
font-style:italic;
text-align: center;

      }
      .redtext {
        color: red;
        font-weight: bold; 
      }
      .percent { 
        color: #0000a0;
      }
    </style>
  </head>

The !important tag in the CSS was suggested by smugmug support but that didn't fix it. Any help would be appreciated.

Kentinada · December 2, 2017

Sorry about the code. I tried highlighting it and going to the format menu and picking Code but that didn't seem to make it readable. If there is something else I should try, please respond. Thanks.

Allen · December 2, 2017

If you italicize or bold every < in the html it will show and not activate.
BTW. I don't think you can use head or style as html.

denisegoldberg · December 2, 2017

I think you can also highlight the code, then use the paragraph dropdown and select QUOTE - that works better for me than marking it as CODE.

Kentinada · December 2, 2017

Trying again to post the code. Here is the HTML:

<html>
  <body>
    <p>
      <b>ON SALE THROUGH</b> 
      <span class="redtext">December 24th</span>
      <br /><br />
ONLY <span class="redtext">$10!</span>
    </p>
  </body>
</html>

Here is the CSS:

<head>
    <style type="text/css">
    p { 
        font-size:28px!important; 
        color: black; 
        font-style:italic;
        text-align: center;

      }
      .redtext {
        color: red;
        font-weight: bold; 
      }
      .percent { 
        color: #0000a0;
      }
    </style>
  </head>

This time using the Code option worked. @denisegoldberg I tried the Quote option and it didn't work for me. Anyway, now the code is visible which I'm pretty sure I got here some time ago. Suggestions?

Hikin' Mike · December 2, 2017

Do not use <head>, <body> or <html> tags.

Your HTML Box:

<p>2018 Calendars are <span class="blue">here</span>!</p>
<p class="italic">ON SALE THROUGH <span class="red">December 24th</span></p>
<p class="italic">ONLY <span class="red">$10!</span></p>

Your CSS:

p { 
    font-size:28px!important; 
    color: black; 
    text-align: center;
    }

.red {
    color: red;
    font-weight: bold; 
    }

.blue { 
    color: blue;
    }

.italic {
    font-style:italic;
    }

Kentinada · December 2, 2017

@Hikin' Mike thank you!!! I assume the head, body, and html tags are for stand-alone pages?

Hikin' Mike · December 3, 2017

@Kentinada said:
@Hikin' Mike thank you!!! I assume the head, body, and html tags are for stand-alone pages?

No. Unless you are creating a website from scratch (which you're not) you don't use them. SmugMug already adds them in the template.

Adding Red Text to Homepage

Comments