Subscription Site: Allow to add Subscribe block at the end of each post by pkuliga · Pull Request #35458 · Automattic/jetpack

pkuliga · 2024-02-06T07:53:41Z

Related to peKye1-EA-p2

Proposed changes:

It:

adds a toggle to the Newsletter settings to render the Subscribe block at the end of each post. Decided to not implement the parent toggle at this point since I'm not sure we would need it

renders the Subscribe block at the end of each post when the above toggle is on

The feature is behind the feature flag and if you want to enable it you need to go into your sandbox mu-plugins, and add the following line to your 0-sandbox.php file:

add_filter( 'jetpack_subscription_site_enabled', '__return_true' );

Other information:

Have you written new tests for your changes, if applicable?
Have you checked the E2E test CI results, and verified that your changes do not break them?
Have you tested your changes on WordPress.com, if applicable (if so, you'll see a generated comment below with a script to run)?

Jetpack product discussion

Does this pull request change what data or activity we track or use?

Testing instructions:

Prerequisites

You need to have Jetpack Newsletter module enabled.

Feature flag disabled

Open WP Admin, the Home page of your blog, and the post page of your blog, and make sure there are no suspicious warnings/notices in the server error log
Open the Newsletter settings and make sure the "Add Subscribe block at the end of each post" toggle is not visible
Open the post page of your blog and make sure there is no Subscribe block below it (unless you added it there by yourself 😄)

Feature flag enabled

Enable the feature flag (described in this PR changes section how to do it)
Repeat steps 1-3 from the"Feature flag disabled" section with a difference that in step 2 the "Add Subscribe block at the end of each post" toggle should be actually visible
Enable the toggle
Open the post page of your blog and make sure there is a Subscribe block at the end of the post
Play with some different options, like disable the"Add Subscribe block at the end of each post" toggle or even disable the Newsletter module completely and make sure it's working as expected.

github-actions · 2024-02-06T07:54:28Z

Are you an Automattician? Please test your changes on all WordPress.com environments to help mitigate accidental explosions.

To test on WoA, go to the Plugins menu on a WordPress.com Simple site. Click on the "Upload" button and follow the upgrade flow to be able to upload, install, and activate the Jetpack Beta plugin. Once the plugin is active, go to Jetpack > Jetpack Beta, select your plugin, and enable the update/subscription-site-first-toggle branch.

To test on Simple, run the following command on your sandbox:

bin/jetpack-downloader test jetpack update/subscription-site-first-toggle

Interested in more tips and information?

In your local development environment, use the jetpack rsync command to sync your changes to a WoA dev blog.
Read more about our development workflow here: PCYsg-eg0-p2
Figure out when your changes will be shipped to customers here: PCYsg-eg5-p2

github-actions · 2024-02-06T07:54:46Z

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

✅ Include a description of your PR changes.
✅ Add a "[Status]" label (In Progress, Needs Team Review, ...).
✅ Add testing instructions.
✅ Specify whether this PR includes any changes to data or privacy.
✅ Add changelog entries to affected projects

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

The e2e test report can be found here. Please note that it can take a few minutes after the e2e tests checks are complete for the report to be available.

Once your PR is ready for review, check one last time that all required checks appearing at the bottom of this PR are passing or skipped.
Then, add the "[Status] Needs Team Review" label and ask someone from your team review the code. Once reviewed, it can then be merged.
If you need an extra review from someone familiar with the codebase, you can update the labels from "[Status] Needs Team Review" to "[Status] Needs Review", and in that case Jetpack Approvers will do a final review of your PR.

Jetpack plugin:

The Jetpack plugin has different release cadences depending on the platform:

WordPress.com Simple releases happen daily.
WoA releases happen weekly.
Releases to self-hosted sites happen monthly. The next release is scheduled for March 5, 2024 (scheduled code freeze on March 4, 2024).

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

pkuliga · 2024-02-26T20:47:47Z

+.wp-block-jetpack-subscriptions__subscribe_post_end {
+	margin: 2em auto !important;
+	gap: 0 !important;
+
+	& > p {
+		margin-bottom: 0.8em !important;
+	}
+}


Those custom styles are used only for classic themes.

Might be worth a comment to clarify it's for classic themes and in what scenario. Hard to know otherwise.

Good idea, added the comment.

pkuliga · 2024-02-26T21:19:28Z

+						disableInSiteConnectionMode
+						module={ subscriptions }
+					>
+						<p>Enable automatic insertion of the Subscribe block into the theme</p>


Decided to not wrap it with __ to not bother translators since it still may change.

pkuliga · 2024-02-26T21:20:03Z

+									'jetpack_subscriptions_subscribe_post_end_enabled',
+								] ) }
+								onChange={ handleSubscribePostEndToggleChange }
+								label="End of each post"


No __ as well for the same reason as above.

simison · 2024-02-27T09:28:48Z

+						'attrs'        => $attrs,
+						'innerBlocks'  => array( $hooked_block ),
+						'innerContent' => array(
+							'<div class="wp-block-group">


If we still need the group block for layout purposes, let's use the full block markup version:

 <div class="wp-block-group"> </div>

Oh I see now, it comes from the above array with core/group etc. Do we then still need the div or doesn't that get generated on its own?

It looks like it's redundant but it seems it's needed. It's not getting generated automatically, the same for:

 <p class="has-text-align-center" style="font-style:normal;font-weight:300">

If you look at our themes, for example: https://github.com/Automattic/themes/blob/trunk/lettre/templates/index.html you'll find similar things.

The solution is taken from @ockham like button 😄
https://github.com/ockham/like-button/blob/2520519633b27d2edaf0f7a58f4161ebc17f36c6/like-button.php#L45-L55

simison

Let's get this in 👍

I didn't test with latest WP trunk, and instead only had latest trunk of Gutenberg plugin. Hence the wrapper blocks didn't work for me, and the result wasn't good looking.

We could add Gutenberg & WP core version checks to ensure the feature works well? Jetpack itself supports two previous WP versions.

Feature flag worked well for toggle and the hook.

Another thing that might require likes/sharing to be blocks is that would make sense for subscribe block be above those buttons:

simison · 2024-02-27T10:43:37Z

+								<p class="has-text-align-center" style="font-style:normal;font-weight:300">
+									<em>Aliquam a ullamcorper lorem<br>Integer at tempus nibh</em>
+								</p>
+								<!-- /wp:paragraph -->',


I thought the Subscribe block would come here but is that also getting automatically added by the hook itself?

It's passd by innerBlocks:

'innerBlocks' => array( $hooked_block ), 'innerContent' => array( '<div class="wp-block-group">  <p class="has-text-align-center" style="font-style:normal;font-weight:300"> <em>Aliquam a ullamcorper lorem<br>Integer at tempus nibh</em> </p> ', null, '</div>',

and it's automatically inserted into the innerContent.

simison · 2024-02-27T10:57:14Z

An example for version check in https://github.com/Automattic/jetpack/pull/35905/files#diff-afc4158db428ae314674d2fab477ce8ba67bfae66be4987e32e026ebf58952ccR40

jeherve · 2024-02-27T11:24:39Z

+	 * @return bool
+	 */
+	protected function is_subscription_site_feature_enabled() {
+		return (bool) apply_filters( 'jetpack_subscription_site_enabled', false );


You'll want to add a docblock for this filter, so the codex parser can pick it up.

Not sure why we need it but added. This is a feature flag and we don't want to expose it.

@jeherve fine to keep the filter internal? We wouldn't want to use filter deprecation when removing it.

I suppose that would be okay. I guess I'm just a bit weary of filters that are temporary but that end up staying for some time. :)

Let's maybe add a short comment saying that the filter is temporary?

jeherve · 2024-02-27T11:27:52Z

+		add_filter(
+			'hooked_block_types',
+			function ( $hooked_blocks, $relative_position, $anchor_block ) {
+				if ( $anchor_block === 'core/post-content' && $relative_position === 'after' ) {
+					$hooked_blocks[] = 'jetpack/subscriptions';
+				}
+
+				return $hooked_blocks;
+			},
+			10,
+			3
+		);
+
+		add_filter(


Since those are brand new hooks that have changed a bit since WordPress 6.4 came out, I personally opted to gate the auto-addition to WP 6.5+, see #35905

Good idea, added, thanks!

…irst-toggle

jeherve

Looks like you may need one more update to latest trunk to fix the build issues that were brought by #36004.

…irst-toggle

pkuliga added 4 commits February 6, 2024 00:03

Toggle added

870fc40

add it to WPCOM_JSON_API_Site_Settings_V1_4_Endpoint

498fb14

add a block

9892ec8

only for a single post

fd9c47d

pkuliga added the [Status] In Progress label Feb 6, 2024

github-actions Bot added [Block] Subscribe [Feature] WPCOM API [Package] Sync [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ Admin Page React-powered dashboard under the Jetpack menu labels Feb 6, 2024

pkuliga added 2 commits February 6, 2024 09:14

styles + formatting

054d5b1

formatting

1b4566d

simison reviewed Feb 6, 2024

View reviewed changes

Comment thread projects/plugins/jetpack/json-endpoints/class.wpcom-json-api-site-settings-v1-4-endpoint.php Outdated

simison reviewed Feb 6, 2024

View reviewed changes

Comment thread projects/plugins/jetpack/extensions/blocks/subscriptions/view.scss Outdated

simison reviewed Feb 6, 2024

View reviewed changes

Comment thread projects/plugins/jetpack/_inc/client/components/settings-group/style.scss

do not modify global styles

45d2cb4

jeherve reviewed Feb 6, 2024

View reviewed changes

Comment thread projects/plugins/jetpack/extensions/blocks/subscriptions/subscriptions.php Outdated

pkuliga added 8 commits February 6, 2024 12:58

use the block editor structure

2cf4379

formatting

056f3ae

improve styling

f6abdca

prefixed setting name

f95d6e2

hide it behind feature flag

28e3f4a

jetpack changelog

a89ba87

no need to sync jetpack_subscribe_post_end_enabled yet

7e389a9

extract logic to the separate class

6878ebf

pkuliga changed the title ~~Subscriptions: Make site a subscription site~~ Subscription Site: Allow to add Subscribe block at the end of each post Feb 7, 2024

pkuliga added [Status] Needs Review This PR is ready for review. [Status] Needs Team Review Obsolete. Use Needs Review instead. labels Feb 7, 2024

pkuliga added 3 commits February 26, 2024 18:00

settings in new card

69a0379

use new signature of block hooks filter

db087cb

remove the additional class for block themes

5568683

pkuliga commented Feb 26, 2024

View reviewed changes

do not translate toggle label

9922dea

pkuliga commented Feb 26, 2024

View reviewed changes

pkuliga added the [Status] Needs Team Review Obsolete. Use Needs Review instead. label Feb 26, 2024

simison reviewed Feb 27, 2024

View reviewed changes

simison previously approved these changes Feb 27, 2024

View reviewed changes

simison reviewed Feb 27, 2024

View reviewed changes

jeherve reviewed Feb 27, 2024

View reviewed changes

pkuliga added 2 commits February 27, 2024 14:40

additional comment to styles to makes things clear

278e00b

docblock for feature flag filter

9ed93dc

pkuliga dismissed simison’s stale review via 9ed93dc February 27, 2024 13:51

pkuliga added 2 commits February 27, 2024 15:16

wp core version check

0aae18a

update the feature flag filter comment

043b06c

pkuliga requested review from jeherve and simison February 27, 2024 21:04

Merge remote-tracking branch 'origin' into update/subscription-site-f…

809e31b

…irst-toggle

jeherve reviewed Feb 28, 2024

View reviewed changes

Merge remote-tracking branch 'origin' into update/subscription-site-f…

0362f94

…irst-toggle

simison approved these changes Feb 28, 2024

View reviewed changes

pkuliga merged commit bbde201 into trunk Feb 28, 2024

pkuliga deleted the update/subscription-site-first-toggle branch February 28, 2024 10:00

github-actions Bot added this to the jetpack/13.2 milestone Feb 28, 2024

github-actions Bot removed [Status] In Progress [Status] Needs Team Review Obsolete. Use Needs Review instead. labels Feb 28, 2024

pkuliga mentioned this pull request Feb 29, 2024

Give the option to automatically include Newsletter sign up block at the end of posts / pages. #31991

Closed

Conversation

pkuliga commented Feb 6, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Proposed changes:

Other information:

Jetpack product discussion

Does this pull request change what data or activity we track or use?

Testing instructions:

Prerequisites

Feature flag disabled

Feature flag enabled

Uh oh!

github-actions Bot commented Feb 6, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Feb 6, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

pkuliga Feb 26, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

simison left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

simison commented Feb 27, 2024

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jeherve left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

pkuliga commented Feb 6, 2024 •

edited

Loading

github-actions Bot commented Feb 6, 2024 •

edited

Loading

github-actions Bot commented Feb 6, 2024 •

edited

Loading

pkuliga Feb 26, 2024 •

edited

Loading