[Resolved] Post title formatting before and after click

Home Forums Support [Resolved] Post title formatting before and after click

Home Forums Support Post title formatting before and after click

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #121134
    Amit

    Hi Tom,

    I have a couple of questions:

    1. I have enabled excerpts and after I click on the post title to see the full post, the title font is same as the content. How can I format the title content post click to show a different font and size.

    2. I need to format the title content to look like one of the posts in the below link:
    https://www.oracle.com/applications/modern-best-practice/logistics/inbound-shipment.html
    If you see the above link, the title (Inbound Shipment to Receipt) has a red bar to its left. How can I achieve this for the title for both the excerpt and the full post.

    Thanks
    Amit

    #121218
    Tom
    Lead Developer
    Lead Developer

    Hi Amit,

    1. The title of your posts are using an H1, so you can change the look of H1s using the Typography options in “Customize > Typography”.

    If you don’t want to change all H1s, you can use some simple CSS – for example:

    .single h1.entry-title {
          font-size: 30px;
    }

    2. You could do something like this:

    .blog h2.entry-title,
    .archive h2.entry-title,
    .single h1.entry-title {
          border-left: 8px solid #E10000;
    }
    #121243
    Amit

    Hi Tom,

    As always, thank you for the prompt response!
    Regarding 1: Thanks. I got it. I will play around with it.

    Regarding 2: I added the css to Custom CSS but it did not work. In the Custom CSS editor, I noticed that some of the text (h2,h1) gets highlighted in red possibly indicating a syntax issue? For example, h2 in the following line “.blog h2.entry-title” gets highlighted in red. Do I need to change anything in the css that you provided?

    Regards,
    Amit

    #121245
    Tom
    Lead Developer
    Lead Developer

    Hmm, shouldn’t be any issues with that code.

    Do you have a link to your site?

    #121263
    Amit

    Hi Tom,

    You can access my site here

    #121266
    Tom
    Lead Developer
    Lead Developer

    You forgot the closing bracket on the CSS block above the one I gave you above.

    You have:

    /* Float Social media on nav bar */
    .main-navigation li.social-icon {
        float: right !important;

    It should be:

    /* Float Social media on nav bar */
    .main-navigation li.social-icon {
        float: right !important;
    }
    #121276
    Amit

    Hi Tom,

    Good catch! Awesome!

    This is working now. One last question. How can I add a space between the red bar and title?

    Regards,
    Amit

    #121277
    Tom
    Lead Developer
    Lead Developer

    This should work:

    .blog h2.entry-title,
    .archive h2.entry-title,
    .single h1.entry-title {
          border-left: 8px solid #E10000;
          padding-left: 10px;
    }
    #121279
    Amit

    Hi Tom,

    Fantastic. As expected!!

    Thanks again for your prompt (almost real time chat) support.

    I will put up my site to be showcased for GeneratePress. I think I am done with the layout for now.

    Regards,
    Amit

    #121309
    Tom
    Lead Developer
    Lead Developer

    No worries. Glad I could help 🙂

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.