Take your website
To the next level
Discover our newly launched customization services and elevate your web projects to new heights.
Delegate tasks, save time, and unlock the power of professional WordPress outsourcing.

Okay
  Public Ticket #3217529
How to create post grid in a correct way
Closed

Comments

  • Simonvetterli started the conversation

    Hello

    I would like to have a "customized" post grid on the main news page.

    How exactly can I do that?

    It should be similar like this: https://kentplc.com/news-insights - or see the attachment.

    I do see, that there is a Template Builder, but I am not exactly sure, how this is working, and where I do set it after I creating a template.

    Regards,

    Simon

    Attached files:  Screenshot 2566-01-26 at 11.54.09.png

  •  7,121
    Oliver replied

    HI,

    Can you provide wp-admin access?

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  •   Simonvetterli replied privately
  •  7,121
    Oliver replied

    I need to see your theme version, it's the last, please activate extended grid here:

    https://tarpon.samui-infotech.online/wp-admin/admin.php?page=thegem-theme-options#/archive-pages/blog

    And set the style you need. 

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Simonvetterli replied

    Dear Oliver

    I tried that, but it not change anything. https://tarpon.samui-infotech.online/our-news/news/

    --> see attachment

    And I would like to edit - if possible the "single layout".

    Also, where can I change the layout of a single blog itself? https://tarpon.samui-infotech.online/workface-generation-in-construction/

    For example, I not like to have the big image as header image etc.

    Regards,

    Simon

    Attached files:  2023-01-27_16-44-45.png
      single-blog-layout.png

  •  7,121
    Oliver replied

    Hi,

    Sorry, I thought it's category, use shortcode blog grid extended here:

    https://tarpon.samui-infotech.online/wp-admin/post.php?vc_action=vc_inline&post_id=1172&post_type=page

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  •  7,121

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Simonvetterli replied

    Dear Oliver

    Okay for the single blog.

    About the grid extended, what should I add respectively for what is

    Unique Grid ID and

    Grid's Title ?

    Is the Unique Grid ID to have a different grid layout for the posts?

    Regards,

    Simon

    Attached files:  2023-01-27_17-21-56.png

  •  7,121
    Oliver replied

    Hi Simon, 

    Unique ID is needed in case you wish to add multiple extended blog grids on the same page - it is needed for correct ajax filtering. 

    Grid's Title: you can ignore it, it is a general setting which adds title above the grid. 


    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Simonvetterli replied

    Okay 

    Where do I see all the different kind of blog layout?

    It seems as I can't create a single blog layout (for the grid)?

    Regards,

    Simon 





  •  7,121
    Oliver replied

    Hi Simon, 

    for displaying blog post loops (like grids, lists) TheGem includes following elements: https://prnt.sc/MmwIHyiNARPR 

    In this elements you have different skins for displaying post loops in different design: https://prnt.sc/2Ahf5c9HXXSw , https://prnt.sc/pUh_rvy_VS8I . you can further adjust the styling of the single blog posts displayed in the grid/list under the "Appearance" and "Style" tabs: https://prnt.sc/NFFzTSmt7-V3 

    Your initial request was about this layout https://prnt.sc/59t8CHsk1Nf3 - for this we would recommend to use Blog Extended Grid with this settings: https://prnt.sc/GDPIdSyuWnO4 , https://prnt.sc/G0uWbnKFzo2b 

    Or do you mean something different? Please kindly let me know. 

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Simonvetterli replied

    Dear Oliver

    We are nearly there, where I like to be.

    What do I need to set, to have an additional button?

    https://www.tarpon-energy.com/news/

    I assume, the rest, like color of the content etc, I need to create and edit with css.

    Sorry, I am asking those kind of questions, usually I am working with another Theme, where I am able to edit and customize everything what I need.

    Regards,

    Simon

  •  7,121
    Oliver replied

    Hi Simon, 

    thank you for your reply, concerning the button - do you mean like "Read More" button? 

    You can customize all colors and styles in this tabs https://prnt.sc/NFFzTSmt7-V3 , no need for manual css. 

    If I may ask, with which theme you are usually working and how you would expect this things to work in TheGem (like in this other theme)? It would be a very valuable input for us, thank you.
    In general, if you have some recommendations or if something is missing or is not working as you have learned usually with other theme it would be great if you could share this feedback, thank you!

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Simonvetterli replied

    Dear Oliver

    thank you for your reply, concerning the button - do you mean like "Read More" button?

    --> yes, exactly

    You can customize all colors and styles in this tabs https://prnt.sc/NFFzTSmt7-V3 , no need for manual css.

    --> okay I will check it out.

    This actually project is from another company, where I am helping out to finish things up.

    I am mostly use Impreza, where I have per post type (including custom post type and products) templates I can create - I think You have this too.

    And a huge part for create the grid elements. they have either "predefined" grid elements: https://impreza.us-themes.com/elements/grid/ or I can use those predefined elements, and can customize to my needs (see attachmant 1).

    They have then a grid, or carousel, based on a grid (attachment 2) where I can set what I like to show, and what grid layout I like to use (attachment 3).

    This way I am flexible with create most everything, the way how I can do.

    A benefit for Your Theme would be, to have this kind maybe in the template part. I think You have this in the Elementor version (or when having Elementor Pro additionally installed). Or with an third party plugin, like Crocoblocks.

    But when I am using Elementor, personally I use Astra, Neve or Kadence.

    And more and more, I am using ACF and Toolset - when it really comes to customize and adding special functions - paired with php coding...

    So Impreza basically changed a lot of things in WPBakery to let a loads of stuff customize. just actually my work is with The Gem Theme for this work.

    Regards,

    Simon


    Attached files:  2023-01-28_20-03-24.png
      2023-01-28_20-02-35.png
      2023-01-28_20-03-59.png

  •  7,121
    Oliver replied

    Hi Simon, 

    thank you so much for detailed feedback, it is very helpful for us. 

    1. Concerning the "Read more" button - as this button is by default reserved for "List Style" of the blog grid,  please copy the file 

    /wp-content/themes/thegem/gem-templates/news-grid/content-item.php into the child theme -> /wp-content/themes/thegem-child/gem-templates/news-grid/content-item.php 

    and replace the rows 609-611, change it from: 

     
    <?php if ($params['version'] == 'list' && $params['blog_show_readmore_button'] == '1') { ?>
                  <div class="read-more-button"><?php include 'readmore-button.php'; ?--></div>
                <!--?php } ?-->
    

    to

    <div class="read-more-button"><?php include 'readmore-button.php'; ?></div>
    

    2. Yes, in TheGem you can create templates for posts and archives (using TheGem Template Builder). The grid settings for displaying single grid items are all located in the respective grid content elements (like this Blog Extended Grid or Portfolio Grid) and in Theme Options.
    The feature of building templates for single grid items sounds indeed interesting, thanks for sharing your thoughts on this. 

    3. Besides this feature of building the grid items via templates are you missing something else in TheGem (your personal opinion) which would prevent you from using TheGem more often in your projects?

    Thank you for all your feedbacks!

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Simonvetterli replied

    Dear Oliver

    I will work on this first part later today.

    Thank You in advance.

    For point 3. So far nothing, what I didn't mentioned yet. Maybe asking what kind of custom post type the theme is supporting? ACF / Toolset?

    Regards,

    Simon

  •  7,121
    Oliver replied

    Hi Simon, 

    thank you very much. Both are supported. Maybe you can share more requirements, what exactly would you wish to create and how you expect this to work?

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Simonvetterli replied

    Dear Oliver

    Whenever I have something I can think off, I will update You.

    About the "read more" button - I needed also to copy this readmore-button.php file in the same folder.

    Otherwise it don't find the file.

    Regards,

    Simon

  •  7,121
    Oliver replied

    Thank you for letting me know!

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver