[Gutenberg] Identify areas of the Travel theme’s homepage that can live as discrete theme blocks and document these for future creation.

[miina]

We went through the homepage of Travel theme with @DavidCramer to define the custom Gutenberg blocks needed.

Gutenberg custom blocks to be developed for homepage:

1. Search block:

   • Would be used in the first search (under "Adventures made easy") and also for the second search (above the footer, under "Have a specific destination in mind?";
   • Would have optional display of datepicker, customizable placeholder / button texts;
   • Optional to choose which taxonomy to search from;

2. Post(s) block:

   • Would be used for the display post (next to "Discover Adventures"), for Top Adventures Near You;
   • Would have controls to choose:
   • How many posts to show;
   • Which category posts to show;
   • How to sort (e.g. by meta value X);
   • Layout / or which fields to display.
   • For example for the post next to "Discover Adventures" you could choose layout A; 1 post; category "Food", for the the Top Adventures Near You" could choose layout B; 3 posts; category "Adventure"; sort by meta value Review;

Question: Does this make sense for these two sections from the editor's point of view?

3. Category/taxonomy list block:
   • Would be used for "Browse by activity" and "Featured destinations";
   • Would have option to choose which fields to display (e.g. meta value such as icon / background image; count of posts
   • Option to choose how many categories to display;
   • Perhaps option to filter by "featured"
   • Option to sort by ... ?

Question: does it seem reasonable to use the same block for these two sections? On the "Featured destinations" -- what would be the sorting logic of the Cities?

4. Possible block -- "Header" block
   • There are a some headers on the page that consist of the heading + subheading (for example Adventures made easy + subheading.)

Question: Gutenberg already has a Heading block and a Subhead block -- should we add a new custom block that would allow adding a heading + subheading within the same block or are the current blocks sufficient?

Thoughts? cc @postphotos @jwold @westonruter

[westonruter]

In general with the blocks, I would say we should implement them according to how you see them in the AMP Start templates as-is to start. Once the blocks are built so that the templates can be re-created, then at that point we can look at ways that they can have customizations to showcase Gutenberg editing. I think that will be more important to focus on later, since the primary thing right now is ensuring we have the frontend rendering faithfully according to the templates.

[miina]

Okay, sounds good.

In this case the blocks could be:

1. Header block (consists of h1 and h2 subheading);
2. Search block (Search input; datepicker; button);
3. Discover / display post block:
   • Secondary header (consists of h2 and div subheading);
   • From the blog;
4. Activities list (Browse by activity);
5. Top adventures;
6. Featured destinations;
7. Second search block (search input + button/link)? (can be merged with the previous Search block later)

In this case creating a skeleton/base for all of these blocks that as a placeholder would just display the content from the current homepage template could be perhaps done in one ticket, and then these blocks could be made configurable and functional one by one in separate tickets. @postphotos / @ThierryA Does this sound reasonable? I'd be happy to add the base for Gutenberg blocks if this sounds OK as one ticket.

Thoughts?

[miina]

Actually taking it as-is for now, maybe the first "Hero" block could be just one -- consisting of the header + search block.

[postphotos]

Hi @miina, I think that would totally make sense! This issue and #10 are discovery tickets that will lead to n # of new tickets based on what you feel we need. Ideally we have an overlay reflected in the design, too, that outlines what the blocks are to help with QA.

cc @jwold

[ThierryA]

Hi @miina, yes I think that makes perfect sense.

Actually taking it as-is for now, maybe the first "Hero" block could be just one -- consisting of the header + search block.

Yes I agree, the Hero block should have the header and search block (with date picker and CTA). Arguably it could even contain the subheader with the Title, Subtitle and From the blog section.

[miina]

Hi @postphotos, on the issues: Do you think you could create a new issue for creating the base for Gutenberg blocks? This would include setting up general files + adding a base structure for all the blocks, initially just returning the content taken directly from the Travel template without options to configure.

[jwold]

Ideally we have an overlay reflected in the design, too, that outlines what the blocks are to help with QA.

I'm checking to see if Maxim has availability to support this.

[jwold]

Maxim has availability to help with this and will update with outlines of what design elements are affected by what blocks.

[postphotos]

Linking new Trello card outlining the design task for this issue: https://trello.com/c/wWfykMhS/30-label-as-an-overlay-the-blocks-for-each-dynamic-layout-for-travel-theme

[postphotos]

TLDR: MVP should be AMP Start in WP, but if we plan to distribute we should tool for Gutenberg's abilities

@miina - Just noticed I didn't respond to your questions here and wanted to capture thoughts.

I agree with @westonruter and believe we should shoot for an MVP of a working theme that is as close to AMP start as possible. I've written these to capture thoughts for future tickets based on your suggestions.

Beyond MVP, especially if this theme will actually be used by users, you've raise some good questions here. I'm responding inline to your message from a few days back.

1) Hero:

For example for the post next to "Discover Adventures" you could choose layout A; 1 post; category "Food", for the the Top Adventures Near You" could choose layout B; 3 posts; category "Adventure"; sort by meta value Review; Question: Does this make sense for these two sections from the editor's point of view?

Agreed here. Dynamic layouts should be part of the thought pattern. A user should be able to adjust this section based on their need.

2) Category/taxonomy list block:

Option to sort by ... ? Question: does it seem reasonable to use the same block for these two sections? On the "Featured destinations" -- what would be the sorting logic of the Cities?

In reality, a site should have the ability to select n number of cities by default here and sort on the fly. Perhaps it pulls a listing and a user can manipulate the display if they choose to do so. I think having a category works as one option, and another would be a "Zoninator" type listing: Allow the users set the positions if they choose to do so, or hide one they don't want to see. They'd likely be promoting a specific area, or through some algorithm this might be populated on a per user basis (based on your location, your recent interest level of a place combined with history and seasonality).

I'm not sure what is technically possible within creating transient lists in the way I'm describing, but I think it could be done. Further, this could be a cool interface to design for as a prototype of what Gutenberg could do... cc @jwold.

[kienstra]

Question About Moving To "Ready For Merging"

Hi @postphotos, Though there might be some remaining questions, it seems like this issue's requirements are mainly satisfied:

Identify areas of the Travel theme’s homepage that can live as discrete theme blocks

Do you think we could move this into "Ready For Merging" to show that it's not awaiting review?