[Resolved] Customizing category pages?

Home Forums Support Customizing category pages?

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1308342
    Mike

    Hello
    Is there a way to customize the category pages to change how the posts are displayed/

    Similar to this? https://packhacker.com/packing-list/

    I have WP Show Posts Pro and would like how to integrate my short code into the category page

    Thanks!

    #1308562
    David
    Staff
    Customer Support

    Hi there,

    Category pages built using WP Show Posts is possible – this document explains how:

    https://docs.wpshowposts.com/article/use-static-pages-as-category-archives/

    However, unless you REALLY need to make them editable pages it would probably be just as easy to style the GP Blog with some CSS. Let us know.

    #1309324
    Mike

    Hmm it might be easier to style with CSS

    #1309575
    David
    Staff
    Customer Support

    If you want to set up your Blog and share me a link i can run through the CSS.
    You can edit your original topic and use the Site URL field to share the link privately.

    #1310175
    Mike

    done thanks

    #1310337
    David
    Staff
    Customer Support

    Just to be clear we are talking about the theme archives ?
    eg.site_url.com/category/japan-culture/

    #1310633
    Mike

    or site_url.com//tokyo-districts/

    i think i removed the category base, so it wont say category

    #1311071
    David
    Staff
    Customer Support

    Can you enable the Read More button and set the number of columns in Customizer > Layout > Blog

    #1311626
    Mike

    ok done

    #1312164
    David
    Staff
    Customer Support

    So you will need to add some Separating Space in Customizer > Layout > Container.
    And i would recommend less Columns as 4 ( and even 3 ) are little squeezed on archives with sidebars.

    This is the CSS:

    .generate-columns-container .post-image {
        margin: -20px -20px 10px -20px !important;
    }
    .generate-columns-container .post-image img {
        width: 100%;
    }
    .one-container:not(.page) .generate-columns-container .inside-article {
        padding: 0 20px;
        border: 1px solid #ccc;
        border-radius: 6px;
        overflow: hidden;
    }
    .generate-columns-container .read-more-container {
        margin-left: -20px;
        margin-right: -20px;    
        margin-top: auto;
    }
    .generate-columns-container .read-more-container a {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }
    
    .one-container:not(.page) .generate-columns-container .inside-article, .entry-summary {
        display: flex;
        flex-direction: column;
        flex: 1;
    }
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.