Twenty Seventeen: Add Block Patterns

[melchoyce]

With block patterns introduced in WordPress 5.5, we now have the opportunity to add some patterns to our older default themes.

Let's consider adding some patterns to Twenty Seventeen. Perhaps some common design patterns found on business websites?

[melchoyce]

Four potential pattern ideas:

• Recent news, with heading, separator, spacer, and latest posts block.
• A two-column pattern mimicking the two-column layout option, with heading text on the left, and a large and regular sized paragraph on the right.
• The three columns paragraph + button pattern included in core, but with a background color adn some added separators.
• A CTA pattern using a group block, heading, paragraph, and button.

[beafialho]

I've worked on a few more patterns for 2017:
​https://cloudup.com/cgVWyCeUwJH
​https://cloudup.com/cb_4ITts-xa
​https://cloudup.com/ck0TQYDyHZd
​https://cloudup.com/clwcjPa1gEe

Trac ticket: https://core.trac.wordpress.org/ticket/51100

[hellofromTonya]

In talking with @melchoyce and the core-theme team, we are punting this ticket to Future Release.

If any maintainer or committer feels this can be resolved in time, or wishes to assume ownership during a specific cycle, feel free to update the milestone accordingly.

[hellofromTonya]

Whoopsie, Mel and I got our wires crossed. Reverting to keep in milestone. Design is done. Has a patch. Sorry for the confusion.

[melchoyce]

​This pattern ("Contact us") feels a little tall in-context; maybe we could adjust the min-height to 700 instead of 900?

[ryelle]

Just noting that I tested the PR & ​left a comment about an issue that needs fixing.

Builds on #550.

• Fixes pattern names.
• Gets php docbloc in sync with other file headers.
• Adds textdomain to translations.
• Updates text so it uses no "lorem ipsum".
• Fixes images.
• Adds image license information.

Trac ticket: https://core.trac.wordpress.org/ticket/51100

[kjellr]

I built on @onemaggie's PR — fixed the bugs noted there, as well as @melchoyce's comment about the Contact Us pattern's min-height.

​https://github.com/WordPress/wordpress-develop/pull/606

Screenshots:

[kjellr]

Also, let's please change the text strings. The ones in the latest PR came from ​the theme demo here — they seemed better than lorem ipsum, but they're not great.

[hellofromTonya]

Noted during today's core scrub.

[helen]

I am not deeply concerned about getting this in before beta so I am marking as a task.

[bridgetwillard]

From placeholder text in GitHub

​https://github.com/WordPress/wordpress-develop/pull/606/commits/c92f0bf764db51757953d2a45f92a631c0f17698

Suggested Edit

'Attract The Right Leads with Marketing Campaigns that Work'

Currently says: 'We can put together marketing campaigns and attract leads through search engine optimization.' (Line 31)

Suggested Edit

'Communicate your purpose and goals with a beautiful logo that encapsulates your business.'

Currently says: 'Our team of talented designers can create a beautiful logo and brand to encapsulate your business purpose and goals.' (Line 60)

Suggested Edit

'Need a website? We've got you covered. Our design team will create a stunning design to transform your brand.'

Currently says: 'Need a website? We’ve got you covered. Our design team will work to transform your brand into a stunning site design.' (Line 77)

Suggested Edit

'Web Design'

One of the links says 'Webdesign'. I can't find it in the code but it shows that way on the screenshot under Our Services.

​https://cldup.com/Q1oqsP3Ynd.png

Suggested Edit

'We are proud to serve outstanding clients like you.'

Currently says: 'Outstanding clients have allowed us to produce work we are proud of.' (Line 188)

Thanks for pinging me on #51098, @melchoyce.

[kjellr]

Thank you @bridgetwillard! I updated the patch on GitHub to include those copy changes. Here's how that looked:

With the new copy, two of these patterns produced single words on their own line — I'd prefer to avoid this design-wise, so I trimmed the copy there slightly:

Let me know if you have alternate suggestions for those — I'm happy to update again if need be.

[bridgetwillard]

Love it @kjellr ! That's the perfect marriage of design and copy!

Whoo!

@carolinan, those URIs should all be escaped now. Thanks!

[poena]

Tested (also on RTL), looks good to me.

There are text strings inside HTML attributes that is missing escaping, but I do not think we should start changing the escaping in the old themes.

[SergeyBiryukov]

In 49584:

Bundled Themes: Introduce block patterns for Twenty Seventeen.

Props melchoyce, kjellr, onemaggie, ryelle, beafialho, bridgetwillard, poena.
Fixes #51100.

Resolved in changeset https://core.trac.wordpress.org/changeset/49584

Resolved in changeset https://core.trac.wordpress.org/changeset/49584