[Resolved] I need help with following:

[Ravi Dixit]

1. I want to make my post title which is h1 centre aligned only in mobile view, can it be possible with GP?

2. How to customize Author name, Date, Category showing after the title? example: By Ravi Dixit / 51 Comments / July 7, 2018
I want to change colour, add a border.

Please help me with this…

[David]

Hi there,

1. this CSS will center the entry title on mobile:

@media (max-width: 768px) {
    .single-post .entry-title {
        text-align: center;
        border-bottom: 1px solid #000;
    }
}

If you want to center the entry meta as well then change:

.single-post .entry-title { to .single-post .entry-title, .single-post .entry-meta {

2. Is this also on the single post?

[Ravi Dixit]

Hey, David!

Thanks for the help.

2. I need to customize on all posts.

[David]

Sorry what i mean was is this to be displayed just on the post or in the blog / archive ( ie. list of posts)?

[Ravi Dixit]

Yes, it should be on the single blog post and I will think for the archive as well so you can help me for both.

I have another question, How can I create Slide-Out Sidebar just like a slide-out menu?

[David]

So this article covers how to make the post meta changes:

https://docs.generatepress.com/article/entry-meta-style/

You could use the Off Canvas Panel ( Slide Out navigation as it was called prior to GPP 1.8 ). It has its own widget area.

[Ravi Dixit]

Thanks for the fast reply, I have checked out but couldn’t found Widget area.
can you please guide me on how to do this?

[Ravi Dixit]

I found the widget area in Appearance>widgets, I was looking for it in the Menu section.

Thanks for the help.

I love GP theme and recommends others to use this.

[David]

Awesome – glad we could be of help

[Ravi Dixit]

Hi, David!

All the codes you gave are working good, Thanks to you for this.

I have one query, How can I change post meta size to fit it every mobile screen?

Like it should be shown in a line, Not like this image…
https://drive.google.com/file/d/1-4gYhyKd_fOTxL2jcCg0oKYFDJEky1Zk/view?usp=drivesdk

And how can I add a small line after the centred post title in mobile view only?

[David]

You could try reducing the mobile font size like so:

@media (max-width: 420px) {
    .single-post .entry-meta {
        font-size: 16px;
    }
}

[Ravi Dixit]

Thanks for this code, It is working as I needed…

Loving GeneratePress Support…😍😍😍

[Ravi Dixit]

And please let me know, how can I add a small line after the centred post title in mobile view only?

[Leo]

Edited David’s code here:
https://generatepress.com/forums/topic/i-need-help-with-following/#post-906748

[Ravi Dixit]

Hey, Leo!

I added this CSS

@media (max-width: 768px) {
.single-post .entry-title, .single-post .entry-meta {
text-align: center;
border-bottom: 1px solid #000;
}
}

it is working border for both title and meta, I want to show only after the meta. And also how can I control the width of the line?

It is also showing border after the comments meta like date, name etc…

[Author]

Posts