Can I do that in Generatepress?

[Dimitar]

Hello,

you can see how on this website https://thecollegeinvestor.com/20309/find-best-student-loan-rates/ just below the H1 tag they have

This article contains references to products from one or more of our advertisers. We may receive compensation when you click on links to those products. For an explanation of our Advertising Policy, visit this page.

with a smaller font than the rest of the article.

Can I do that on my website, I am using Generatepress with a valid license?

[Leo]

Hi there,

Try creating a hook element:
https://docs.generatepress.com/article/hooks-element-overview/
https://docs.generatepress.com/article/hooks-visual-guide/#single-post

Let me know if this helps 🙂

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

[Dimitar]

Hello, thanks it does help.

I have added it, I edited the first post so you can see my website.

But how can I change the font size and also center the text, like the user in this topic has done – https://generatepress.com/forums/topic/adding-text-above-the-h1-heading-in-a-post/ you can see they have given a link to their website to see what I mean.

[Leo]

Edit your HTML to something like this:

<div class="notice">
    The following guide containts link to Amazon. As an Amazon Associate I earn from qualifying purchases.
</div>

Then add some CSS.

.notice {
    font-size: 20px;
    color: #000;
    text-align: center;
    margin-top: 20px;
}

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

[Dimitar]

Okay, thanks. But the thing is I don’t know how to do that and I do not want to mess my website.

Can you/the team do that for payment, or you do not offer services like that?

[Leo]

Is that the position you actually want the notice?

If so you can actually just use the header element module:
https://docs.generatepress.com/article/header-element-overview/
https://docs.generatepress.com/article/how-to-create-a-page-hero/

Then you won’t need any CSS.

The hooks element is only needed if you want the notice below the title.

Let me know 🙂

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

[Dimitar]

Okay, I tried different positions and it seems below the title it looks better, so it seems I need the hook element.

What I want is to increase the space just a bit between the title and the notice and to align the notice in the center and use a bit smaller font. You can see that the space now is a bit too little.

I read your Adding CSS document and with the plugin that seems very easy.

Just editing the HTML I cannot figure out, as when I click “Theme Editor” they are all PHP files.

Sorry for having to deal with someone with that little knowledge of the backend of WordPress…

[Leo]

No need to edit the theme files.

You can copy and paste the HTML into the hook content field:
https://www.screencast.com/t/6mNIjGy8faQi

Let me know 🙂

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

[Dimitar]

It worked! Thanks so much, man. The only thing left is, is it possible to increase the space between the title and the notice just a bit?

[Leo]

Edited the CSS here:
https://generatepress.com/forums/topic/can-i-do-that-in-generatepress/#post-1039792

Let me know 🙂

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

[Dimitar]

You are gold. I would like to send some money to you as a tip, is that possible?

[Leo]

Glad I could help 🙂

You can donate to our on-going development:
https://generatepress.com/ongoing-development/

We really appreciate your support!

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

[Dimitar]

I have sent some. Thanks again.

[Leo]

Thank you so much!!

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

[Author]

Posts