.github/workflows/assets-readme-update.yml

@@ -0,0 +1,19 @@
+name: Plugin asset/readme update
+on:
+  push:
+    branches:
+    - trunk
+env:
+  SVN_PASSWORD: ${{ secrets.SVN_PASSWORD }}
+  SVN_USERNAME: ${{ secrets.SVN_USERNAME }}
+  SLUG: getdave-responsive-navigation-block
+  README_NAME: "readme.md"
+  IGNORE_OTHER_FILES: true # only copy README file and .wordpress-org directory
+jobs:
+  trunk:
+    name: Push to trunk
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@master
+    - name: WordPress.org plugin asset/readme update
+      uses: 10up/action-wordpress-plugin-asset-update@stable

.wordpress-org/blueprints/blueprint.json

@@ -8,7 +8,7 @@
 			"step": "installPlugin",
 			"pluginZipFile": {
 				"resource": "wordpress.org/plugins",
-				"slug": "responsive-navigation-block"
+				"slug": "getdave-responsive-navigation-block"
 			},
 			"options": {
 				"activate": true

CHANGELOG.md

@@ -0,0 +1,13 @@
+## Changelog
+
+### 1.0.9
+
+Fixes bug with settings deleting other settings https://github.com/getdave/responsive-navigation-block/issues/5.
+
+### 1.0.8
+
+Adds transforms support to block variations to enable transforming directly to a Navigation block.
+
+### 1.0.7
+
+Initial version.

getdave-responsive-navigation-block.php

@@ -3,7 +3,7 @@
  * Plugin Name:       Responsive Navigation Block
  * Description:       Allows you to show different navigation menus based on the screen size using the Navigation block.
  * Requires at least: 6.5
- * Version:           1.0.7
+ * Version:           1.0.9
  * Author:            Dave Smith
  * Author URI:        https://aheadcreative.co.uk
  * Plugin URI:        https://github.com/getdave/responsive-navigation-block
@@ -135,6 +135,7 @@ function enqueue_block_assets() {
 	wp_add_inline_style( GDRNB_PLUGIN_SLUG . '-style', $css );
 }
 
+
 function add_settings_page() {
 	add_options_page(
 		__( 'Responsive Navigation Block Settings', 'getdave-responsive-navigation-block' ), // Page title
@@ -151,7 +152,7 @@ function settings_page_callback() {
 		<h1><?php echo esc_html( get_admin_page_title() ); ?></h1>
 		<form action="options.php" method="post">
 			<?php
-			settings_fields( 'reading' );
+			settings_fields( GDRNB_PLUGIN_SLUG . '_responsive_nav' ); // Use your custom settings group
 			do_settings_sections( GDRNB_PLUGIN_SLUG . '_responsive_nav' );
 			submit_button( __( 'Save Settings', 'getdave-responsive-navigation-block' ) );
 			?>
@@ -162,22 +163,22 @@ function settings_page_callback() {
 
 function register_settings() {
 	register_setting(
-		'reading',
+		GDRNB_PLUGIN_SLUG . '_responsive_nav', // Custom settings group
 		GDRNB_PLUGIN_SLUG . '_responsive_nav_breakpoint',
 		array(
 			'type'              => 'integer',
-			'description'       => __( 'The breakpoint at which the navigation will switch to mobile view', 'getdave-responsive-navigation-block' ),
+			'description'       => __( 'The breakpoint value at which the navigation will switch.', 'getdave-responsive-navigation-block' ),
 			'sanitize_callback' => 'absint',
 			'default'           => GDRNB_DEFAULT_BREAKPOINT,
 		)
 	);
 
 	register_setting(
-		'reading',
+		GDRNB_PLUGIN_SLUG . '_responsive_nav', // Custom settings group
 		GDRNB_PLUGIN_SLUG . '_responsive_nav_unit',
 		array(
 			'type'              => 'string',
-			'description'       => __( 'The unit of the navigation breakpoint', 'getdave-responsive-navigation-block' ),
+			'description'       => __( 'The unit used for the breakpoint.', 'getdave-responsive-navigation-block' ),
 			'sanitize_callback' => 'sanitize_text_field',
 			'default'           => GDRNB_DEFAULT_UNIT,
 		)
@@ -207,6 +208,7 @@ function register_settings() {
 	);
 }
 
+
 function settings_section_callback() {
 	echo '<p>' . esc_html__( 'Set the breakpoint and unit at which the special Navigation block variations "Desktop Navigation" and "Mobile Navigation" will switch.', 'getdave-responsive-navigation-block' ) . '</p>';
 	echo '<p>' . esc_html__( '⚠️ Please note: setting this value will have no effect on the standard Navigation block.', 'getdave-responsive-navigation-block' ) . '</p>';

package.json

@@ -1,6 +1,6 @@
 {
   "name": "getdave-responsive-navigation-block",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "description": "Show different navigation menus based on the screen size using the Navigation block.",
   "main": "index.js",
   "scripts": {

readme.md

@@ -1,10 +1,10 @@
 # Responsive Navigation Block
 
--   Stable tag: 1.0.7
+-   Stable tag: 1.0.9
 -   Tested up to: 6.6
 -   License: GPL-2.0-or-later
--   Tags: navigation, menus, responsive, blocks
--   Contributors: [get_dave](https://profiles.wordpress.org/get_dave/)
+-   Tags: navigation, menus, responsive, blocks, mobile
+-   Contributors: get_dave
 -   Source code: https://github.com/getdave/responsive-navigation-block
 
 ![](.wordpress-org/banner-1544x500.png)
@@ -15,20 +15,30 @@ Complete control over your navigation menus based on screen size including style
 
 This Plugin allows you to display and apply alternative styling to different navigation menus based on the screen size using the WordPress Navigation block.
 
-[![](https://img.shields.io/wordpress/plugin/installs/responsive-navigation-block?style=flat-square)](https://wordpress.org/plugins/responsive-navigation-block/)
+[![Active Installs](https://img.shields.io/wordpress/plugin/installs/getdave-responsive-navigation-block?logo=wordpress&logoColor=%23fff&label=Active%20Installs&labelColor=%2323282D&color=%2323282D)](https://wordpress.org/plugins/getdave-responsive-navigation-block/) [![Playground Demo Link](https://img.shields.io/wordpress/plugin/v/getdave-responsive-navigation-block?logo=wordpress&logoColor=%23fff&label=Playground%20Demo&labelColor=%233858e9&color=%233858e9)](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/getdave/responsive-navigation-block/refs/heads/trunk/.wordpress-org/blueprints/blueprint.json)
+
+### Video Walkthrough
+
+[youtube https://www.youtube.com/watch?v=R5kzAaEsDMg]
 
 ### Features
 
+-   Two new Navigation Block (variations) for:
+    -   Mobile
+    -   Desktop
 -   Style your menu differently depending on screen size.
 -   Use a different menu for each screen size.
 -   Customize the "breakpoint" (where you switch between mobile and desktop).
 -   Automatically switch editor to "mobile" preview when editing the mobile navigation.
 
 ### Usage
 
-This Plugin creates two block variations from the Navigation block which will be automatically hidden/shown at the configured breakpoint (screensize)
+This Plugin creates two block variations from the Navigation block which will be **automatically hidden/shown at the configured screensize** (breakpoint):
 
-This affords the ability to independently style mobile vs desktop navigation and even allows for completely different menus to be used.
+-   Navigation (Mobile) - will be displayed only on smaller screen sizes.
+-   Navigation (Desktop) - will be displayed only on larger screen sizes.
+
+This affords the ability to **independently style mobile vs desktop navigation** and even allows for **completely different menus** to be used.
 
 The Plugin should be used as follows:
 
@@ -38,6 +48,8 @@ The Plugin should be used as follows:
 -   Add the "Mobile Navigation" block - style and configure the menu for "mobile" as required.
 -   View the front of your website and resize your browser to see the navigations swap out at the appropriate breakpoint/screensize.
 
+Alternatively you can transform the default Navigation block to either `Mobile` or `Desktop` variations via the block's interface.
+
 ### Support
 
 Please see FAQs. If you still have an issue please:
@@ -83,7 +95,7 @@ Due to complications with the way the default WordPress Navigation block works y
     -   text color - `Styles -> Color -> Submenu & overlay text`.
 -   Mobile menu toggle button ("hamburger"):
     -   icon color - `Styles -> Color -> Text`.
-    -   background color - `Styles -> Color -> Text`.
+    -   background color - `Styles -> Color -> Background`.
 
 Styles for Desktop Navigation can be applied using the standard controls.
 
@@ -112,13 +124,22 @@ To run the tests - in your terminal of choice:
 
 ### Releasing
 
-Releasing the Plugin is the prerogative of the Plugin owner (@get_dave). The process is as follows:
+Releasing the Plugin to the WordPress.org Plugin repo is the prerogative of the Plugin owner (@get_dave). The process is as follows:
 
--   Commit all changes to `trunk` branch.
--   TBC
-
-## Changelog
+#### Test the Plugin
 
-### 1.0.7
-
-Initial version.
+-   Commit all changes to `trunk` branch.
+-   Push changes to `trunk` (only) - `git push origin trunk`.
+-   In Github:
+    -   Actions
+    -   Select the [`Build Release Zip` action](https://github.com/getdave/responsive-navigation-block/actions/workflows/build-release-zip.yml).
+    -   Select the `Run workflow` dropdown and run the workflow to generate a zip file.
+    -   When action completes download the generated Plugin zip artifact.
+    -   Manually install and test the .zip.
+
+#### Deploy to WP.org
+
+-   When ready to deploy.
+-   Bump Plugin version and tag release - `npm run bump-version`.
+-   Push trunk and tags - `git push origin trunk --tags`
+-   Deployment to WP.org will be handled automatically.

src/index.js

@@ -17,6 +17,7 @@ registerBlockVariation( 'core/navigation', {
 		'Navigation block preconfigured for larger viewports.',
 		'getdave-responsive-navigation-block'
 	),
+	scope: [ 'block', 'inserter', 'transform' ],
 	attributes: {
 		overlayMenu: 'never',
 		className: desktopClassName,
@@ -36,6 +37,7 @@ registerBlockVariation( 'core/navigation', {
 		'Navigation block preconfigured for smaller viewports.',
 		'getdave-responsive-navigation-block'
 	),
+	scope: [ 'block', 'inserter', 'transform' ],
 	attributes: {
 		overlayMenu: 'always',
 		className: mobileClassName,