diff --git a/extensions/blocks/premium-content/_inc/access-check.php b/extensions/blocks/premium-content/_inc/access-check.php
index 0eddf81f08c2d..b6b70a3cdde56 100644
--- a/extensions/blocks/premium-content/_inc/access-check.php
+++ b/extensions/blocks/premium-content/_inc/access-check.php
@@ -14,7 +14,7 @@
  *
  * @return bool Whether the memberships module is set up.
  */
-function pre_render_checks() {
+function membership_checks() {
 	// If Jetpack is not yet configured, don't show anything ...
 	if ( ! class_exists( '\Jetpack_Memberships' ) ) {
 		return false;
@@ -26,6 +26,54 @@ function pre_render_checks() {
 	return true;
 }
 
+/**
+ * Determines if the site has a plan that supports the
+ * Premium Content block. If false, the site requires a
+ * plan upgrade.
+ *
+ * @return bool
+ */
+function required_plan_checks() {
+	// For WPCOM sites.
+	if ( defined( 'IS_WPCOM' ) && IS_WPCOM && function_exists( 'has_any_blog_stickers' ) ) {
+		$site_id = get_current_blog_id();
+		return has_any_blog_stickers( array( 'personal-plan', 'premium-plan', 'business-plan', 'ecommerce-plan' ), $site_id );
+	}
+
+	// For Jetpack sites, only Atomic sites (with a business plan
+	// or above) have the block, so no upgrade is required.
+	return true;
+}
+
+/**
+ * Determines if the block should be rendered. Returns true
+ * if the memberships module is set up, or if it has not been
+ * set up but the user can edit the post.
+ *
+ * @return bool Whether the block should be rendered.
+ */
+function pre_render_checks() {
+	return (
+		membership_checks() ||
+		current_user_can_edit()
+	);
+}
+
+/**
+ * Determines if the a preview of the block with disconnected
+ * buttons should be shown on the frontend. Returns true
+ * user can edit the post, but the site requires an upgrade
+ * or Stripe connection in order to support the block.
+ *
+ * @return bool Whether the frontend preview should be shown
+ */
+function should_render_frontend_preview() {
+	return (
+		current_user_can_edit() &&
+		( ! membership_checks() || ! required_plan_checks() )
+	);
+}
+
 /**
  * Determines if the current user can view the protected content of the given block.
  *
@@ -35,16 +83,11 @@ function pre_render_checks() {
  * @return bool Whether the use can view the content.
  */
 function current_visitor_can_access( $attributes, $block ) {
-	$user = wp_get_current_user();
-
 	/**
 	 * If the current WordPress install has as signed in user
 	 * they can see the content.
-	 *
-	 * Ideas:
-	 *  - Capability check?
 	 */
-	if ( 0 !== $user->ID && current_user_can( 'edit_post', get_the_ID() ) ) {
+	if ( current_user_can_edit() ) {
 		return true;
 	}
 
@@ -71,3 +114,14 @@ function current_visitor_can_access( $attributes, $block ) {
 
 	return $can_view;
 }
+
+/**
+ * Determines whether the current user can edit.
+ *
+ * @return bool Whether the user can edit.
+ */
+function current_user_can_edit() {
+	$user = wp_get_current_user();
+
+	return 0 !== $user->ID && current_user_can( 'edit_post', get_the_ID() );
+}
diff --git a/extensions/blocks/premium-content/buttons/index.js b/extensions/blocks/premium-content/buttons/index.js
index 91d526b693ff0..f02713d76d3b7 100644
--- a/extensions/blocks/premium-content/buttons/index.js
+++ b/extensions/blocks/premium-content/buttons/index.js
@@ -24,15 +24,6 @@ const settings = {
 		alignWide: false,
 		lightBlockWrapper: true,
 	},
-	attributes: {
-		isPremiumContentChild: {
-			type: 'bool',
-			default: true,
-		},
-	},
-	providesContext: {
-		isPremiumContentChild: 'isPremiumContentChild',
-	},
 	keywords: [ __( 'link', 'jetpack' ) ],
 	edit,
 	save,
diff --git a/extensions/blocks/premium-content/index.js b/extensions/blocks/premium-content/index.js
index e16aaa479d2a7..37ee0c6b0174b 100644
--- a/extensions/blocks/premium-content/index.js
+++ b/extensions/blocks/premium-content/index.js
@@ -57,12 +57,17 @@ export const settings = {
 			type: 'boolean',
 			default: false,
 		},
+		isPremiumContentChild: {
+			type: 'bool',
+			default: true,
+		},
     },
 	edit,
 	save,
 	providesContext: {
 		'premium-content/planId': 'selectedPlanId',
 		'premium-content/isPreview': 'isPreview',
+		isPremiumContentChild: 'isPremiumContentChild',
 	},
 	supports: {
 		html: false,
diff --git a/extensions/blocks/premium-content/logged-out-view/logged-out-view.php b/extensions/blocks/premium-content/logged-out-view/logged-out-view.php
index 4a4878d40274b..a7d361811778d 100644
--- a/extensions/blocks/premium-content/logged-out-view/logged-out-view.php
+++ b/extensions/blocks/premium-content/logged-out-view/logged-out-view.php
@@ -48,6 +48,10 @@ function render_loggedout_view_block( $attributes, $content, $block = null ) {
 		return '';
 	}
 
+	if ( should_render_frontend_preview() ) {
+		return $content;
+	}
+
 	$visitor_has_access = current_visitor_can_access( $attributes, $block );
 
 	if ( $visitor_has_access ) {
diff --git a/extensions/blocks/premium-content/login-button/login-button.php b/extensions/blocks/premium-content/login-button/login-button.php
index c7a4afdaf4a61..e30c89d645f1e 100644
--- a/extensions/blocks/premium-content/login-button/login-button.php
+++ b/extensions/blocks/premium-content/login-button/login-button.php
@@ -42,6 +42,10 @@ function render_login_button_block( $attributes, $content ) {
 		return '';
 	}
 
+	if ( should_render_frontend_preview() ) {
+		return $content;
+	}
+
 	if ( is_user_logged_in() ) {
 		// The viewer is logged it, so they shouldn't see the login button.
 		return '';
@@ -49,6 +53,8 @@ function render_login_button_block( $attributes, $content ) {
 
 	Jetpack_Gutenberg::load_styles_as_required( LOGIN_BUTTON_NAME );
 
-	$url = subscription_service()->access_url();
-	return preg_replace( '/(<a\b[^><]*)>/i', '$1 href="' . esc_url( $url ) . '">', $content );
+	$url          = subscription_service()->access_url();
+	$login_button = preg_replace( '/(<a\b[^><]*)>/i', '$1 href="' . esc_url( $url ) . '">', $content );
+
+	return "{$login_button}";
 }
diff --git a/extensions/blocks/premium-content/premium-content.php b/extensions/blocks/premium-content/premium-content.php
index 52837b29ac879..91095fa5e6dce 100644
--- a/extensions/blocks/premium-content/premium-content.php
+++ b/extensions/blocks/premium-content/premium-content.php
@@ -33,8 +33,15 @@ function register_block() {
 		array(
 			'render_callback' => __NAMESPACE__ . '\render_block',
 			'plan_check'      => true,
+			'attributes'      => array(
+				'isPremiumContentChild' => array(
+					'type'    => 'boolean',
+					'default' => true,
+				),
+			),
 			$provides         => array(
 				'premium-content/planId' => 'selectedPlanId',
+				'isPremiumContentChild'  => 'isPremiumContentChild',
 			),
 		)
 	);
@@ -54,6 +61,56 @@ function render_block( $attributes, $content ) {
 		return '';
 	}
 
+	// Show upgrade nudge.
+	if ( ! required_plan_checks() && current_user_can_edit()
+	) {
+		$upgrade_nudge = render_upgrade_nudge();
+		return $upgrade_nudge . $content;
+	}
+
+	// Stripe connection nudge.
+	if ( ! membership_checks() && current_user_can_edit() ) {
+		$stripe_nudge = render_stripe_nudge();
+		return $stripe_nudge . $content;
+	}
+
 	Jetpack_Gutenberg::load_styles_as_required( FEATURE_NAME );
 	return $content;
 }
+
+/**
+ * Server-side rendering for the upgrade nudge.
+ *
+ * @return string Final content to render.
+ */
+function render_upgrade_nudge() {
+	$required_plan = ( defined( 'IS_WPCOM' ) && IS_WPCOM ) ? 'personal-bundle' : 'jetpack_personal';
+
+	jetpack_require_lib( 'components' );
+
+	return \Jetpack_Components::render_upgrade_nudge(
+		array(
+			'plan' => $required_plan,
+		)
+	);
+}
+
+/**
+ * Server-side rendering for the stripe connection nudge.
+ *
+ * @return string Final content to render.
+ */
+function render_stripe_nudge() {
+	jetpack_require_lib( 'components' );
+
+	return \Jetpack_Components::render_component(
+		'stripe-nudge',
+		array(
+			'blockName'        => 'premium-content',
+			'postId'           => get_the_ID(),
+			'stripeConnectUrl' => null,
+		)
+	);
+
+	return '';
+}
diff --git a/extensions/blocks/premium-content/subscriber-view/subscriber-view.php b/extensions/blocks/premium-content/subscriber-view/subscriber-view.php
index 63751f16a519f..68bb1e2be105d 100644
--- a/extensions/blocks/premium-content/subscriber-view/subscriber-view.php
+++ b/extensions/blocks/premium-content/subscriber-view/subscriber-view.php
@@ -43,7 +43,7 @@ function register_subscriber_view_block() {
  * @return string
  */
 function render_subscriber_view_block( $attributes, $content, $block = null ) {
-	if ( ! pre_render_checks() ) {
+	if ( ! pre_render_checks() || should_render_frontend_preview() ) {
 		return '';
 	}
 
diff --git a/extensions/blocks/recurring-payments/edit.jsx b/extensions/blocks/recurring-payments/edit.jsx
index bb629869b8c97..3ffb403a13afb 100644
--- a/extensions/blocks/recurring-payments/edit.jsx
+++ b/extensions/blocks/recurring-payments/edit.jsx
@@ -18,7 +18,7 @@ import {
 	SelectControl,
 } from '@wordpress/components';
 import { InspectorControls, InnerBlocks, BlockIcon } from '@wordpress/block-editor';
-import { Fragment, Component } from '@wordpress/element';
+import { Component } from '@wordpress/element';
 import { applyFilters } from '@wordpress/hooks';
 
 /**
@@ -522,7 +522,7 @@ class MembershipsButtonEdit extends Component {
 		);
 
 		return (
-			<Fragment>
+			<>
 				{ this.props.noticeUI }
 				{ ! this.isPremiumContentChild && this.renderUpgradeNudges() }
 				{ ! this.isPremiumContentChild && this.renderPlanNotices() }
@@ -541,7 +541,7 @@ class MembershipsButtonEdit extends Component {
 					] }
 					templateLock="all"
 				/>
-			</Fragment>
+			</>
 		);
 	};
 }
diff --git a/modules/memberships/class-jetpack-memberships.php b/modules/memberships/class-jetpack-memberships.php
index ebef1fb8d0c56..a03528e50a6db 100644
--- a/modules/memberships/class-jetpack-memberships.php
+++ b/modules/memberships/class-jetpack-memberships.php
@@ -242,6 +242,7 @@ public function render_button_preview( $attrs, $content = null ) {
 		if ( ! empty( $content ) ) {
 			$block_id = esc_attr( wp_unique_id( 'recurring-payments-block-' ) );
 			$content  = str_replace( 'recurring-payments-id', $block_id, $content );
+			$content  = str_replace( 'wp-block-jetpack-recurring-payments', 'wp-block-jetpack-recurring-payments wp-block-button', $content );
 			return $content;
 		}
 		return $this->deprecated_render_button_v1( $attrs, null );
@@ -309,6 +310,7 @@ public function render_button( $attributes, $content, $block ) {
 		if ( ! empty( $content ) ) {
 			$block_id      = esc_attr( wp_unique_id( 'recurring-payments-block-' ) );
 			$content       = str_replace( 'recurring-payments-id', $block_id, $content );
+			$content       = str_replace( 'wp-block-jetpack-recurring-payments', 'wp-block-jetpack-recurring-payments wp-block-button', $content );
 			$subscribe_url = $this->get_subscription_url( $plan_id );
 			return str_replace( 'href="#"', 'href="' . $subscribe_url . '"', $content );
 		}