Newsletter/Pop-up template not working with Blockbase themes

[Robertght]

Quick summary

I encountered someone who cannot edit the template of the newsletter pop-up when using the Kerr theme.

Steps to reproduce

1. Activate Kerr
2. Go to Settings > Newsletter
3. Activate the Newsletter pop-up option and click on "Preview and edit the popup(opens in a new tab)"

What you expected to happen

To be able to modify the Jetpack subscription modal.

What actually happened

I got an empty template with "null" in the title of the page(browser tab).

Browser

No response

Context

7355315-zen

Platform (Simple, Atomic, or both?)

Simple

Other notes

This happens with Blockbase&Blockbase Premium themes.

Tested with Videomaker, Russell, Arbutus, etc.

Reproducibility

Consistent

Severity

Some (< 50%)

Available workarounds?

Yes, difficult to implement

Workaround details

Switch to another theme like Blank Canvas if the theme is simpler or find a replacement theme.

[github-actions[bot]]

Support References

This comment is automatically generated. Please do not edit it.

• [ ] 7355315-zen
• [ ] 7527596-zen
• [ ] 7541242-zen

[cat-og]

📌 REPRODUCTION RESULTS

• Tested on Simple – Replicated
• Tested on Atomic – Replicated

📌 ACTIONS

• Triaged

[devNigel]

Another report: 7527596-zd-a8c

I was able to reproduce the issue with Varese theme as well.

[AnjanaV93]

Another report in 7541242-zen

The Subscriber pop-up is blank in Videomaker theme:

As a temporary workaround, I suggested this CSS:

.jetpack-subscribe-modal__modal-content, .jetpack-subscribe-modal__modal-content button {
    color: #000 !important;
    background: Automattic/themes#999;
}

[sashastone]

I'm experiencing the same issue on my own site, using the Zoologist theme. When I click "Preview and Edit Popup" it opens a blank page with no ability to add blocks or edit.

[hideandgeek404]

This has also been reported again at p9F6qB-e7K-p2

However, through some investigation I have found both the issue and a workaround.

This issue is not restricted to Blockbase themes, unfortunately. Instead, it is applicable to any theme using a child theme. The reason for this is that the link in https://wordpress.com/settings/newsletter/{site_url} points to https://{site_url}/wp-admin/site-editor.php?postType=wp_template_part&postId=**{PARENT_THEME_SLUG}**%2F%2Fjetpack-subscribe-modal&canvas=edit but it should point to https://{site_url}/wp-admin/site-editor.php?postType=wp_template_part&postId=**{CHILD_THEME_SLUG}**%2F%2Fjetpack-subscribe-modal&canvas=edit

Interestingly, this only seems to affect Calypso, as the workaround is to access Jetpack > Settings > Newsletter which also gives a link to preview the pop up but has the correct child theme slug in the URL.

Confirmation of the issue Visiting WordPress.com > Settings > Newsletter and clicking the Preview and edit the popup link opens a page where the URL includes the parent theme slug instead of the active child theme slug. This in turn means that the template cannot be loaded. If the correct child theme slug is replaced in the URL the preview loads. A more user friendly workaround is shown below.

Workaround

1. Click Jetpack
2. Click Settings in the top right
3. Click Newsletter in the tabs
4. Click the Preview and edit the popup link (this should include the correct child theme slug in the URL)

[simison]

We have the code in two places, in Jetpack and Calypso:

• https://github.com/Automattic/jetpack/blob/2f48ff68f3ade46e250800a313d40ef507ffd70e/projects/plugins/jetpack/_inc/client/newsletter/subscriptions-settings.jsx#L53
• https://github.com/Automattic/wp-calypso/blob/18fbf112a978dd5eea2564d85d9aedf956170ac8/client/my-sites/site-settings/settings-newsletter/SubscribeModalSetting.tsx#L31

Slack p1706208764513469-slack-C052XEUUBL4 and p2 p7DVsv-jNo-p2

[pkuliga]

Potential fix: https://github.com/Automattic/wp-calypso/pull/86904 Needs a review and some testing.