add archive template and posts-grid pattern #5994
Conversation
There was a problem hiding this comment.
When there are not tags, UI starts with the separator dot (.). Is there a way to conditionally add it?
Not with block templates, it would have to be in the block options somehow. I wonder if we should just remove the separator dot for now, unless we are okay with how it looks when there are no tags.
Is there a block to add the title Search: search term? Archive title isn't working in search template
I think it would be useful if the archive title block supported rendering the search term, or something along those lines.
In the meantime though, maybe this template could match our other block themes' search templates where the input is rendered at the top of the results page, for example:
What do you think @beafialho ?
curator/patterns/posts-grid.php
Outdated
| <div class="wp-block-group alignfull"><!-- wp:query {"queryId":0,"query":{"perPage":6,"pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":true},"displayLayout":{"type":"flex","columns":3},"align":"wide"} --> | ||
| <div class="wp-block-query alignwide"><!-- wp:post-template --> | ||
| <!-- wp:group {"style":{"spacing":{"padding":{"top":"20px","right":"20px","bottom":"20px","left":"20px"}}},"layout":{"inherit":false}} --> | ||
| <div class="wp-block-group" style="padding-top:20px;padding-right:20px;padding-bottom:20px;padding-left:20px"><!-- wp:post-featured-image {"isLink":true} /--> |
There was a problem hiding this comment.
The spacing here seems a little off from the designs, maybe a little more space below the featured image, or reducing the space between the post terms and post title:
Yeah 😞 unfortunately removing the dot might be the only option. Will it look like this with the category then? This is also not ideal.
Absolutely. I keep designing |
|
Adjusted spacing, and used search block in the search page.
|
madhusudhand
force-pushed
the
curator/archive
branch
from
c14e233 to
7971e52
Compare
madhusudhand
added
the
[Status] Needs Design Approval
Yes. Is that acceptable? Also just noting what happens when there is more than one category:
|
Co-authored-by: Jeff Ong <[email protected]>
I'm not sure this is a good alternative. If there are more categories it'll look quite full and the dot really helped separating the information. Maybe whenever posts are showing up as a grid it works better if we use the Tiny paragraph size (14px) in post date with 10px spacing in the Stack block. Can you try it?
|
Sure thing, I tried that here: 900d744
What do you think @beafialho ? Using 10px as the block gap makes it appear bigger than the spacing suggested in the comps, but I left it there for your consideration. |
|
Thanks @jffng, can you try 5px instead of 10px please? |
|
Sure thing:
|
|
Thank you, that was just what I needed! 0px seems to look the best to me. |
|
I love how this is looking! I have spotted a few things to be polished:
Keep in mind that it shouldn't be underlined by default.
|
Navigation styling is in progress as part of the other PR #5987
Gutenberg is supporting only mobile breakpoints and we might need custom styles to adjust to 2 column layout. However, because the grid is a pattern, it will break the page when theme switched. Following is the UI for iPad Mini device size.
|
|
Created #6059 to add pagination once the single page PR is merged. Merging this PR to reduce inter dependencies. Please add if these pages need more changes. |
Changes proposed in this Pull Request:
Related issue(s):
Fixes: #5932
Issues to resolve
This PR has the following problems that needs to be solved. Need suggestions.
Search: search term? Archive title isn't working in search template