diff --git a/includes/plugin-sidebars/class-convertkit-plugin-sidebar-post-settings.php b/includes/plugin-sidebars/class-convertkit-plugin-sidebar-post-settings.php index 9b2a882fe..9f2f7f45e 100644 --- a/includes/plugin-sidebars/class-convertkit-plugin-sidebar-post-settings.php +++ b/includes/plugin-sidebars/class-convertkit-plugin-sidebar-post-settings.php @@ -197,9 +197,25 @@ public function get_fields() { 'label' => __( 'Form', 'convertkit' ), 'type' => 'select', 'description' => array( - __( 'Default', 'convertkit' ) . ': ' . __( 'Uses the form specified on the settings page.', 'convertkit' ), - __( 'None', 'convertkit' ) . ': ' . __( 'do not display a form.', 'convertkit' ), + sprintf( + '%s: %s %s', + esc_html__( 'Default', 'convertkit' ), + esc_html__( 'Uses the form specified on the', 'convertkit' ), + esc_url( convertkit_get_settings_link() ), + esc_html__( 'settings page', 'convertkit' ) + ), + sprintf( + '%s: %s', + esc_html__( 'None', 'convertkit' ), + esc_html__( 'do not display a form.', 'convertkit' ) + ), __( 'Any other option will display that form after the main content.', 'convertkit' ), + sprintf( + '%s %s', + esc_html__( 'To make changes to your forms,', 'convertkit' ), + esc_url( convertkit_get_sign_in_url() ), + esc_html__( 'sign in to Kit', 'convertkit' ) + ), ), 'values' => $forms, 'resource_type' => 'forms', @@ -207,7 +223,14 @@ public function get_fields() { 'landing_page' => array( 'label' => __( 'Landing Page', 'convertkit' ), 'type' => 'select', - 'description' => __( 'Select a landing page to make it appear in place of this page.', 'convertkit' ), + 'description' => array( + esc_html__( 'Select a landing page to make it appear in place of this page.', 'convertkit' ), + sprintf( + /* translators: Link to sign in to ConvertKit */ + esc_html__( 'To make changes to your landing pages, %s', 'convertkit' ), + '' . esc_html__( 'sign in to Kit', 'convertkit' ) . '' + ), + ), 'values' => $landing_pages, 'post_type' => 'page', 'resource_type' => 'landing_pages', @@ -215,14 +238,34 @@ public function get_fields() { 'tag' => array( 'label' => __( 'Tag', 'convertkit' ), 'type' => 'select', - 'description' => __( 'Select a tag to apply to visitors of this page who are subscribed. A visitor is deemed to be subscribed if they have clicked a link in an email to this site which includes their subscriber ID, or have entered their email address in a Kit Form on this site.', 'convertkit' ), + 'description' => array( + esc_html__( 'Select a tag to apply to visitors of this page who are subscribed.', 'convertkit' ), + esc_html__( 'A visitor is deemed to be subscribed if they have clicked a link in an email to this site which includes their subscriber ID, or have entered their email address in a Kit Form on this site.', 'convertkit' ), + ), 'values' => $tags, 'resource_type' => 'tags', ), 'restrict_content' => array( 'label' => __( 'Restrict Content', 'convertkit' ), 'type' => 'select', - 'description' => __( 'Select the Kit form, tag or product that the visitor must be subscribed to, permitting them access to view this member-only content.', 'convertkit' ), + 'description' => array( + esc_html__( 'Select the Kit form, tag or product that the visitor must be subscribed to, permitting them access to view this member-only content.', 'convertkit' ), + sprintf( + '%s: %s', + esc_html__( 'Form', 'convertkit' ), + esc_html__( 'Displays the Kit form. On submission, the email address will be subscribed to the selected form, granting access to the member-only content. Useful to gate free content in return for an email address.', 'convertkit' ) + ), + sprintf( + '%s: %s', + esc_html__( 'Tag', 'convertkit' ), + esc_html__( 'Displays a WordPress styled subscription form. On submission, the email address will be subscribed to the selected tag, granting access to the member-only content. Useful to gate free content in return for an email address.', 'convertkit' ) + ), + sprintf( + '%s: %s', + esc_html__( 'Product', 'convertkit' ), + esc_html__( 'Displays a link to the Kit product, and a login form. Useful to gate content that can only be accessed by purchasing the Kit product.', 'convertkit' ) + ), + ), 'values' => $restrict_content, 'resource_type' => 'restrict_content', ), diff --git a/resources/backend/css/wp-list-table-buttons.css b/resources/backend/css/wp-list-table-buttons.css index 5bd7b7883..83e9b7ce5 100644 --- a/resources/backend/css/wp-list-table-buttons.css +++ b/resources/backend/css/wp-list-table-buttons.css @@ -1,10 +1,12 @@ .wrap .page-title-action.convertkit-action { - width: 124px; + display: inline-block; + width: 127px; background: url(../images/logomark.svg); background-repeat: no-repeat; background-size: 16px 16px; background-position: 8px 50%; padding-left: 30px; + box-sizing: border-box; } .wrap .page-title-action.convertkit-action::after { @@ -14,28 +16,40 @@ padding: 5px 0 0 0; } -.wrap .page-title-action.convertkit-action span { +.wrap .page-title-action.convertkit-action span.convertkit-actions { visibility: hidden; display: none; opacity: 0; position: absolute; - margin: 0; padding: 10px; left: -1px; + z-index: 99999; background-color: #f0f0f1; border-left: 1px solid #0a4b78; border-right: 1px solid #0a4b78; border-bottom: 1px solid #0a4b78; } -.wrap .page-title-action.convertkit-action span a { +.wrap .page-title-action.convertkit-action span.convertkit-actions a { display: block; text-decoration: none; } -.wrap .page-title-action.convertkit-action:hover > span, -.wrap .page-title-action.convertkit-action span:hover { +.wrap .page-title-action.convertkit-action:hover > span.convertkit-actions, +.wrap .page-title-action.convertkit-action span.convertkit-actions:hover { visibility: visible; opacity: 1; display: block; } + +@media screen and (max-width: 782px) { + + .wrap .page-title-action.convertkit-action { + width: 134px; + } + + .wrap .page-title-action.convertkit-action::after { + padding-top: 10px; + } +} + diff --git a/resources/backend/js/gutenberg.js b/resources/backend/js/gutenberg.js index d32096a80..da344a0ba 100644 --- a/resources/backend/js/gutenberg.js +++ b/resources/backend/js/gutenberg.js @@ -1011,14 +1011,35 @@ function convertKitGutenbergRegisterPluginSidebar(sidebar) { values: fieldValues[key] || field.values, }); + // Build the help element. Supports HTML in the description by + // rendering each line as a paragraph via element.RawHTML, which + // allows inline tags like and to render correctly. + let helpElement; + if (Array.isArray(field.description)) { + helpElement = el( + 'span', + {}, + field.description.map(function (line, index) { + return el( + 'p', + { + key: 'help-' + index, + style: { margin: '0 0 0.5em 0' }, + }, + el(element.RawHTML, {}, line) + ); + }) + ); + } else if (field.description) { + helpElement = el(element.RawHTML, {}, field.description); + } + // Define some field properties shared across all field types. const fieldProperties = { key: 'convertkit_plugin_sidebar_' + key, id: 'convertkit_plugin_sidebar_' + key, label: field.label, - help: Array.isArray(field.description) - ? field.description.join('\n\n') - : field.description, + help: helpElement, value: settings[key] || field.default_value || '', // Add __next40pxDefaultSize and __nextHasNoMarginBottom properties,