Post lists in archive pages

  • westham60

    (@westham60)


    1 year, 3 months ago

    The website I have set up using the MagShow Pro theme uses a grid display on the homepage, which suits my site perfectly as the 2 row 4 column grid matches the 8 posts (music reviews) that we post 5 days a week. However, what I hadn’t realised is that all the archive pages follow the same format. So while they look good, they are very inefficient (given the 40 posts/week).

    So what I’d like to do is to have the archive pages including category & tag display as lists (probably with 25 posts per page), but within the theme format. I thought it would be easy to Google the code to display the title (linked to the post) and excerpt with a controllable number of posts per page, but after a couple of days of searching, I haven’t managed to fin anything that I can use.

    I have a decent amount of coding experience but not in PHP, so can follow the logic of code in front of me (mostly) but not write it from scratch.

    So any pointers would be much appreciated.

    • This topic was modified 1 year, 3 months ago by westham60.

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Moderator bcworkz

    (@bcworkz)

    1 year, 3 months ago

    What about CSS coding experience? The grid layout could be removed on subsequent archive pages by changing element widths and ensuring they all float: left;. The current elements have a width of 23.5%. Change it to 100% and you’ll get a list instead of a grid.

    The problem is the images are now way over sized. So change the inner element that has the image to be maybe 19% wide and the inner element with the post text to be 79% wide. (there’s a 2% margin already applied) Ensure elements both float: left;. This gets you a small thumbnail and the post, all on one line, full width left of the sidebar.

    Now the issue is the home page is also full width and not grid 🙁 The CSS selectors for archive pages needs to differentiate themselves from the home page. The body class of archive pages includes “paged-2, paged-3” etc. The home page has nothing like that. Archive’s CSS rules can leverage this. Do something like:

    body[class*='paged-'] .magshow-grid-post.magshow-4-col {
    width: 100%;
}

    Add this to the customizer’s Additional CSS section along with similar rules to alter the widths and floats of the inner elements.

    Thread Starter westham60

    (@westham60)

    1 year, 3 months ago

    bcworkz, thank you for your idea. I certainly hadn’t thought of a CSS solution, but unless I’ve missed something, it doesn’t address the problem of the number of posts per page on the archive pages.

    Indeed, having reflected on this for another day or so, it is not the grid that is the problem requiring a list as solution, it is the number of posts on the archive pages. I’m quite happy with the existing grid appearance, I just would like to be able to display more rows (5 or 6) on the archive pages, but not on the homepage.

    Moderator bcworkz

    (@bcworkz)

    1 year, 3 months ago

    You can alter the posts_per_page arg using any arbitrary criteria through the “pre_get_posts” action. For example, if “paged” query var is defined (i.e. it’s not a first page request), set posts_per_page to the desired number. An example is on the doc page. It sets posts per page for category archives, but you can use any criteria you like. The part that checks that it’s not admin and is main query is important to include, or you’ll mess up queries you didn’t intend to alter.

    Thread Starter westham60

    (@westham60)

    1 year, 3 months ago

    bcworkz, thank you so much. This did the trick perfectly.

    For anyone else needing this solution, I used the following code for archives (category, tag, author, date), is_search() for search pages and is_paged() for the main pages off the home page (e.g. …com/page/2):

    function archive_pagesize( $query ) {
if ( ! is_admin() && $query->is_main_query() && is_archive() ) {
// Display 24 posts for archives
$query->set( 'posts_per_page', 24 );
return;
}
}
add_action( 'pre_get_posts', 'archive_pagesize', 1 );
    • This reply was modified 1 year, 3 months ago by bcworkz. Reason: code format fixed
    Thread Starter westham60

    (@westham60)

    1 year, 3 months ago

    Or at least I thought it did the trick perfectly but the paged() version of this seems to have an anomaly, in that /page/2 bypasses the next 24 posts after the most recent ones on the homepage. Perhaps I’ve done something wrong – here is the code:

    function pages_pagesize( $query ) {
if ( ! is_admin() && $query->is_main_query() && is_paged() ) 
{
// Display 24 posts for search pages
$query->set( 'posts_per_page', 24 );
return;
}
}
add_action( 'pre_get_posts', 'pages_pagesize', 1 );

    So just to clarify, the homepage shows the most recent 8 posts, but clicking on the page 2 link doesn’t show the next 24 posts (9-32), but rather the 24 after that (33-56). The problem only occurs with the paged() version, the search() and archive() are fine.

    • This reply was modified 1 year, 3 months ago by westham60.
    Thread Starter westham60

    (@westham60)

    1 year, 3 months ago

    I worked out that the problem was to do with offset, and even found code and advice that should have solved everything on an external site titled “Changing the posts per page on first page without breaking pagination in WordPress” (I am not going to include its URL) as the code simply doesn’t do what heading says.

    However, I could follow the code, so went old school with pen and paper, and did some simple arithmetic with the code formulas to get the post ranges that I wanted, i.e. posts 1-8 on homepage, 9-32 on page 1, 33-56 on page 2 and so on. I made the adjustments to offset and posts_per_page, and it works.

    Thread Starter westham60

    (@westham60)

    1 year, 2 months ago

    I was wrong – something is causing certain posts to be shown on successive pages and others to not be shown at all.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Post lists in archive pages’ is closed to new replies.

Tags