How do I customize Category page?

Hi there,

You can create your own layout by using a block element – content template:

Here’s the doc:https://docs.generatepress.com/article/block-element-content-template/

Please watch the video to understand the concept.

Let me know if you need further assistance on this 🙂

Well, using an element is actually the easiest solution among all the approaches, and it is very powerful, if you’ve never used one, I would strongly recommend learning and trying it as this is the core value of GP Premium and GB as well.

But if you don’t want to learn, it’s ok too.

1- I want to remove the margins

There’s no margin applied, I assume you are talking about paddings, here’s the CSS to remove the paddings:

.generate-columns-container .post .inside-article {
    padding: 0;
}

2- I want to change the box size of the article

Do you mean want to have more columns?

If so, you can change the column number at customizer > layout > blog.

3- I want to change the category icon

you can use the generate_svg_icon filter.

add_filter( 'generate_svg_icon', function( $output, $icon ) {
    if ( 'categories' === $icon ) {
        $svg = 'your_svg_HTML_goes_here';

        return sprintf(
            '<span class="gp-icon %1$s">
                %2$s
            </span>',
            $icon,
            $svg
        );
    }

    return $output;
}, 15, 2 );

Just replace your_svg_HTML_goes_here with your own SVG icon code.

You are welcome   🙂

Hope you’ll enjoy learning and using GP elements!