Embed URL in an H1 heading in page hero?

Hi there,

Try this HTML structure:
<h1 class="hero-heading""><a href="https://LINKS-HERE">IT'S NATURAL</a></h1>

With this CSS:

h1.hero-heading a {
    text-align: center;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

I'm going to use the HTML structure. How do I blend

<h1 style=”text-align: center;”><span style=”color: #ffffff;”>IT’S NATURAL</span></h1>

into

<h1 class="hero-heading"">IT'S NATURAL</h1>

Joe

Some code didn't copy. Let me say this again:

I’m going to use the HTML structure. How do I blend

<h1 style=”text-align: center;”><span style=”color: #ffffff;”>IT’S NATURAL</span></h1>

into
<h1 class="hero-heading"">IT'S NATURAL</h1>

Joe

Can you try using my HTML structure only?
https://generatepress.com/forums/topic/embed-url-in-an-h1-heading-in-page-hero/#post-1419343

It's better than using your own structure with the inline style.

Sorry. I can't get

<h1 class="hero-heading"">IT'S NATURAL</h1>

to center and be in white.

Did you add the CSS part here as well?
https://generatepress.com/forums/topic/embed-url-in-an-h1-heading-in-page-hero/#post-1419343

I'm unable to see your site due to this:
https://www.screencast.com/t/rDr2qNxA5ft

OK, I inserted the CSS. The H1 is centered but is coming up orange and then black once it is clicked.

Sorry for the confusion.

I’m unable to see your site due to this:
https://www.screencast.com/t/rDr2qNxA5ft

Are you able to unlock it for me?

You should be able to see the website now. You may have to clear your browsing cache.

So couple of things:

- Currently, you are adding inline text-align: center; to every line. Instead of doing that, simply use the Horizontal alignment option in the header element so you can remove the inline style:
https://docs.generatepress.com/article/how-to-create-a-page-hero/#step-5-position-the-content

- As for the link color, you can just use the Link Color option in the page hero setting as well:
https://www.screencast.com/t/Wb21pQMWmm

The text is centered but the color is still off using

h1.hero-heading a {
text-align: center;
}

Did you try using the option I suggested in the second point here?
https://generatepress.com/forums/topic/embed-url-in-an-h1-heading-in-page-hero/#post-1419498

If you follow my 2 steps above, you don't need to add any inline style or CSS at all.

Yes, I see. That's good.

If I need to combine all three headings into one heading that keeps the three-lined, centered format I currently have and uses one URL, how would that go?

You could use the <br> tag like this:
<h1>line 1<br>line 2<br>line 3</h1>