[Resolved] Individual category pages – custom post grid with pagination

[Max]

Hi there!

I bought GP Premium a while ago and am building my webpage. I do not know php nor css but have installed php snippet and simple css. Leo has already helped me out with an issue regarding my header (in case you need that information). The following will probably be a bigger undertaking so I will be thankful for any hints and advice you can provide. Judging from what I have discovered in this forum this is one of the best theme support forums on the web. Also, your documentation system is marvelous and very helpful – thank you for the effort.

What I am currently trying to achieve:

Two personalized category pages (on my hp: “Stray Observations” and “Science Posts”) which are supposed to display the latest posts of those categories in a 1.) 9 (3 x 3) post grid + sidebar or, if a featured post is included in a 8 posts grid (first row featured + 1 post, then 3 and 3 posts) + sidebar. Currently I have enabled the featured post option but have not created enough dummy posts in those categories yet. So to see the 2nd option you will have to click on the menu item “all posts”.
I would like to avoid using external post grid plugins and just rely on the columns element from GP, if possible.

Those two category pages should have:

– pagination, meaning I would like to have the mentioned number of posts on each page (1st option), so after 3 x 3 posts have been displayed, at the bottom/top of the page there should be an element (page nr. and arrows) to go to the next/previous page;
for option 2.: the same pagination but the first page should display 8 posts (in the given manner) and the following pages 3 x 3 so 9 posts.
– for the 2nd option it would be important that the images in the first row are aligned which they are not at the moment due to the different length of the according headlines. That is why I wanted to know whether:
– it would be possible to have the font size adapt to the length/height of the headline so that the image alignment does not
get broken and in case of the second post of the first row (next to the featured image) to have the font size of the excerpt adapt as well. This is also important for the rest of the post grid: I want to limit the headline rows to two so that even longer headlines would have their font size reduced to fit into two rows. Also, the exerpt font is too large for my liking which is why I would like to adapt that one as well.
– A further issue which I have come across is that the exerpt length does not get adjusted if I in/decrease the word number in the customizer – I have enabled the “exerpt option” in wordpres so each post has an individual exerpt. I take it, GP automatically creates excerpts based on the first words of a post?
– Furthermore: Would it be possible to increase the white space on the left side which means centralizing the post grid further (e.g. if there were three “columns” White space – category grid – sidebar) and to create a broader space between the post grid and the sidebar? I played around with the customizer –> container –> one container separate space/padding for a while but could not really manage to get it right. While I was able to increase the white space on the left side I could then not change the padding between the sidebar and the post grid. Ideally I would like to work with percentages so that the layout still looks good on different desktop sizes.
– last but not least: Do you know of a plugin/way to customize the background colour/image etc. of those category pages? The one suggestion I found in the forum: https://de.wordpress.org/plugins/enhanced-category-pages/ apparently lacks support/does not get updated anymore.

My first thought was to create those individual cateogry pages via elementor and some post grid plugins. But if it was possible to solve this via GP I would be more than delighted. The 2nd option is my preferred one but if that is too difficult to implement I would go for the first one.

Best wishes and already thanks so much in advance!

Max

GP Premium 1.7.2

[Leo]

Hi Max,

It’s possible to achieve custom/specific solution like this with only GP but definitely difficult without knowing any CSS or PHP. It’s also hard to picture what you are trying to achieve without seeing some visual representation.

In this case I would recommend looking into a page builder like you mentioned above and see if you can achieve what you are looking for. If not you can also consider hiring a coder to tailor your solution for you.

Some pointers you might want to look into:

– Checkout Tom’s WP Show Posts and see if it helps:
https://en-ca.wordpress.org/plugins/wp-show-posts/

– Columns numbers can be changed using a filter:
https://docs.generatepress.com/article/using-columns-in-the-blog/#changing-the-number-of-columns

– A filter that might come in handy to modify the archive page layout for each category:
https://docs.generatepress.com/article/option_generate_blog_settings/

– I’m not aware of any solutions that change the font size based on length. How will it know? It will likely require some custom javascript.

– For the excerpt question, I assume you are using the excerpt metabox from WordPress? If so then WordPress shows the full excerpt content when the excerpt metabox is used. How else will the content be shown as the content in excerpt metabox doesn’t actually show up in the single posts.

Again I would recommend giving page builder a shot if you aren’t comfortable with coding.

If you can provide some example or draft of what you are trying to achieve I might be able to point to the right direction better.

Please do keep in mind that we try to help as much as possible but sometimes a full solution like this takes a lot of time and might be a bit out of the scope of this forum.

Let me know if this helps 🙂

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

[Max]

Hi Leo,

Thanks again! Yes I am aware that this is a big undertaking. I will see to whether it is possible to find a solution via using a pagebuilder and take a look at the filters you pointed out. If this does not yield any productive results I will try to visualize what I have in mind and have you take a look at it.

But as a quick followup question: At the moment, if I enable the blog/archives feature, category pages are displayed in a grid, meaning there are usually columns and rows (I disabled the featured post option). To adapt the number of colums (e.g. 3) is easy (see my “all posts” page). But is there a way to limit the number of rows (e.g. to 3) in order to achieve such a grid?
Let’s say a category contains 18 posts – on a category page I want 9 of them to be displayed on a first and 9 on the next page. In this case I would need some sort of pagination. From your perspective, would that be difficult to achieve? Indeed, I know some plugins which I tried so far and I would use them. But I just want to get a grasp of the scope of this thing.

When it comes to the headline issue: I suppose I simply need to create titles which span two rows – this way there will be an even distribution of space above the actual image/content area.

When it comes to the excerpts: At the company I work for we do have a custom-made “teaser box” which functions like an excerpt box. It pops up on the homepage (as a preview instead of the content of the post) and before the actual content of the post on a single post page. I was wondering though if GP could access the excerpt meta box from WP directly instead of creating an excerpt based on the content of the post. Nonetheless I suppose it would be easier to simply disable the metabox in WP and write a short “excerpt paragraph” in the content area of each post.

Best wishes

[Leo]

If I understand correctly, you are looking for the Blog pages show at most feature in WordPress: https://codex.wordpress.org/Settings_Reading_SubPanel

Hmm not quite sure if I understand about the excerpt, but sounds like you want to use custom excerpt box more than the auto excerpt function.

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

[Max]

That setting limits the posts per page number indeed – maybe that works! I’ll play around with it a bit and take a look at word press forums to see if I can alter said category pages in some way. Thanks for pointing that out!

Of course I would love use the custom excerpt box but as you pointed out, apparenty GP does not have any influence on its word limit when the post preview (e.g. Headline, featured image, meta, excerpt) gets shown in the category pages 🙂 That means I would need to make sure to limit the number of words manually for it to look adequate in a preview like on a category page. Otherwise the excerpt might be too long and the “read more button” will not be available (like with the posts on my category pages “science posts” and “stray observations”). In any case, I will also try using one of the plugins and maybe Tom’s “Show Posts” and get back to you here.

[Leo]

You can activate Read more button with custom excerpt as well:
https://docs.generatepress.com/article/activating-read-custom-excerpt/

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

[Max]

Thanks Leo – I am currently trying out a new plugin which includes a slider and post grid and will get back to you here once I have figured out whether this is the best option to go for. I also tried out Tom’s Show Posts plugin but since I also need a slider for my homepage I will probably go for a different one (even though I like the fact that WP SP was coded by you guys). In any case, I think I will need to resort to using an additional plugin since the native options for adapting certain category pages seem to be quite limited (for a non-coder like me).

[Max]

So just to follow up on my original post – I decided to implement Post Carousel Pro for my Post Grid and Slider but also use Show Posts for a different kind of section on my webpage.

Thanks for the help!

[Leo]

Glad I could help 🙂

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

[Author]

Posts