Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update Block: Archives #13928

Open
melchoyce opened this issue Feb 18, 2019 · 7 comments

Comments

@melchoyce
Copy link
Contributor

commented Feb 18, 2019

Moved over from #1464.

I wanted to take a look at rethinking the Archive widget rather than just porting it over. I ended up with two ideas: an archive list, and an archive grid.

Archive List

The current archive widget seems to be popular on blogs, especially things like food/craft/lifestyle blogs. However, if you've been running your blog for a while, you end up with a gigantic list of months. Additionally, there's no way to see what posts were written within that month — just the number. To see the posts, you need to click into the archive for that month. What if you could see which posts were written that month?

archive-list

To solve these problems, I:

  • Swapped links to the month archives for accordions.
  • Started with months from your current year, then dropped down to the year for older posts. Previous years have an extra level of depth, so you open them and see the available months from that year.

This should help both condense the lists for long-time bloggers, and help people find the posts they're browsing for faster.

Archive Grid

While a list is great for a sidebar or a narrower widget area, blocks can also exist within post and page content. This is where a grid comes in handy, so you can have a more dynamic approach to listing out your archive without needing to code up a custom template.

archive-grid

This particular mockup is inspired by Tumblr's default archive pages. Thinking that we could load the current year, then include a "load more" button or year-based pagination at the end of the current year's list.

We could maybe do something like https://en.blog.wordpress.com/2018/, which shows the featured image as the background of the post block. It's very subtle, but helps you distinguish between posts and brings in some extra character.


Both of these still need some work — for example, you can see neither has settings yet — but I wanted to get the conversation started as soon as I had something to show.

@richtabor

This comment has been minimized.

Copy link

commented Mar 4, 2019

I think this is a great idea @melchoyce. Having both a list and grid view has precedence, as that capability already exists in the Latest Posts block - which also displays blocks.

The featured image suggestion is awesome!

I wonder if using similar styling/markup (for the grid) as the Latest Posts block would be helpful for theme developers to apply similar custom styling relatively easily for both the Archives and Latest Posts blocks. If so, then perhaps the grid layout for the Latest Posts block should be updated with the same featured image suggestion as you've presented? 🤔

@mizejewski

This comment has been minimized.

Copy link

commented Mar 18, 2019

👍🏼@melchoyce on rethinking the Archive widget rather than just porting it over. The improved accordion design is much more useful for long lists. Adding an option for a visual card style display is great too. I especially like the example with featured image as background, though that should probably be a setting, in case the user has not applied featured images to their posts.

@afercia

This comment has been minimized.

Copy link
Contributor

commented May 24, 2019

Discussed during today's accessibility bug scrub:

  • accordions will need some specific markup and interaction for good accessibility, but they're pretty OK so no big objections
  • not sure if there's the need for additional accessibility feedback, please do feel free to comment if so
@anevins12

This comment has been minimized.

Copy link
Contributor

commented May 24, 2019

Looks good, I can not envisage any a11y issues though I have some queries about the ellipsis added to the long titles. This won't be achievable in the front-end because it's a multi-line sentence. Instead we'll have to add an ellipsis for all breakpoints via the backend. Or we could avoid the ellipsis.

@melchoyce

This comment has been minimized.

Copy link
Contributor Author

commented May 24, 2019

Maybe instead of ellipses, we could use grid or flex to expand the height of an entire row to fit the longest title in that row?

@karmatosed karmatosed removed this from Widgets in Phase 2 Jul 16, 2019
@noisysocks noisysocks added this to To Do in Blocks Jul 19, 2019
@melchoyce melchoyce added the future label Aug 20, 2019
@gziolo gziolo added this to the Future milestone Oct 10, 2019
@gziolo gziolo removed the future label Oct 10, 2019
@joyously

This comment has been minimized.

Copy link

commented Oct 15, 2019

Seems like a lot of data for a block. (all the post titles of the whole blog)
How does that affect SEO? (to have links to all those on one page)

@ZebulanStanphill

This comment has been minimized.

Copy link
Contributor

commented Oct 15, 2019

Concerning a grid style, I think it should be implemented as a block style, rather than a block option. The markup would be the same regardless of how the block is styled, right?

I think it was a mistake to have the list/grid option in the Latest Posts block implemented the way it was; it should have been a block style like how the Separator block implements its default variations.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Blocks
  
To Do
9 participants
You can’t perform that action at this time.