add media_url & meta_desc

build/index.asset.php

@@ -0,0 +1 @@
+<?php return array('dependencies' => array('wp-components', 'wp-data', 'wp-edit-post', 'wp-element', 'wp-i18n', 'wp-plugins', 'wp-polyfill'), 'version' => '56803822ba7351846a42a7c8e45ba986');

build/index.js

@@ -0,0 +1,260 @@
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = "./src/index.js");
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ "./src/index.js":
+/*!**********************!*\
+  !*** ./src/index.js ***!
+  \**********************/
+/*! no exports provided */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
+/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _wordpress_plugins__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/plugins */ "@wordpress/plugins");
+/* harmony import */ var _wordpress_plugins__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_plugins__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/edit-post */ "@wordpress/edit-post");
+/* harmony import */ var _wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
+/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
+/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
+/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__);
+/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
+/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__);
+
+
+
+
+
+
+
+var PluginMetaFields = function PluginMetaFields(props) {
+  return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__["PanelBody"], {
+    title: Object(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__["__"])("Media URL", "textdomain"),
+    icon: "format-video",
+    intialOpen: true
+  }, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__["TextControl"], {
+    value: props.text_metafield,
+    label: Object(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__["__"])("meta property og:video meta", "textdomain"),
+    help: "postmeta:media absolute url to video",
+    onChange: function onChange(value) {
+      return props.onMetaFieldChange(value);
+    }
+  })));
+};
+
+var PluginMetaFields_desc = function PluginMetaFields_desc(props) {
+  return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__["PanelBody"], {
+    title: Object(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__["__"])("Meta Excerpt", "textdomain"),
+    icon: "format-aside",
+    intialOpen: true
+  }, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__["TextareaControl"], {
+    value: props.text_metafield_desc,
+    label: Object(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__["__"])("meta name=description", "textdomain"),
+    help: "postmeta:meta-desc alternative to post excerpt from the function dw_good_excerpt",
+    onChange: function onChange(value) {
+      return props.onMetaFieldChange_desc(value);
+    }
+  })));
+};
+
+PluginMetaFields = Object(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__["withSelect"])(function (select) {
+  return {
+    text_metafield: select('core/editor').getEditedPostAttribute('meta')['media']
+  };
+})(PluginMetaFields);
+PluginMetaFields_desc = Object(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__["withSelect"])(function (select) {
+  return {
+    text_metafield_desc: select('core/editor').getEditedPostAttribute('meta')['meta_desc']
+  };
+})(PluginMetaFields_desc);
+PluginMetaFields = Object(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__["withDispatch"])(function (dispatch) {
+  return {
+    onMetaFieldChange: function onMetaFieldChange(value) {
+      dispatch('core/editor').editPost({
+        meta: {
+          media: value
+        }
+      });
+    }
+  };
+})(PluginMetaFields);
+PluginMetaFields_desc = Object(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__["withDispatch"])(function (dispatch) {
+  return {
+    onMetaFieldChange_desc: function onMetaFieldChange_desc(value) {
+      dispatch('core/editor').editPost({
+        meta: {
+          meta_desc: value
+        }
+      });
+    }
+  };
+})(PluginMetaFields_desc);
+Object(_wordpress_plugins__WEBPACK_IMPORTED_MODULE_1__["registerPlugin"])('dw-sidebar', {
+  icon: 'welcome-widgets-menus',
+  render: function render() {
+    return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__["PluginSidebarMoreMenuItem"], {
+      target: "dw-sidebar"
+    }, Object(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__["__"])('Meta Options', 'textdomain')), Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(_wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__["PluginSidebar"], {
+      name: "dw-sidebar",
+      title: Object(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__["__"])('Post Meta', 'textdomain')
+    }, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(PluginMetaFields, null), Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__["createElement"])(PluginMetaFields_desc, null)));
+  }
+});
+
+/***/ }),
+
+/***/ "@wordpress/components":
+/*!*********************************************!*\
+  !*** external {"this":["wp","components"]} ***!
+  \*********************************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+(function() { module.exports = this["wp"]["components"]; }());
+
+/***/ }),
+
+/***/ "@wordpress/data":
+/*!***************************************!*\
+  !*** external {"this":["wp","data"]} ***!
+  \***************************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+(function() { module.exports = this["wp"]["data"]; }());
+
+/***/ }),
+
+/***/ "@wordpress/edit-post":
+/*!*******************************************!*\
+  !*** external {"this":["wp","editPost"]} ***!
+  \*******************************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+(function() { module.exports = this["wp"]["editPost"]; }());
+
+/***/ }),
+
+/***/ "@wordpress/element":
+/*!******************************************!*\
+  !*** external {"this":["wp","element"]} ***!
+  \******************************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+(function() { module.exports = this["wp"]["element"]; }());
+
+/***/ }),
+
+/***/ "@wordpress/i18n":
+/*!***************************************!*\
+  !*** external {"this":["wp","i18n"]} ***!
+  \***************************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+(function() { module.exports = this["wp"]["i18n"]; }());
+
+/***/ }),
+
+/***/ "@wordpress/plugins":
+/*!******************************************!*\
+  !*** external {"this":["wp","plugins"]} ***!
+  \******************************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+(function() { module.exports = this["wp"]["plugins"]; }());
+
+/***/ })
+
+/******/ });
+//# sourceMappingURL=index.js.map

dw_guten.php → dw-guten.php

@@ -9,6 +9,9 @@ Author URI: https://davidawindham.com
 
 defined( 'ABSPATH' ) or die( 'yeah right' );
 
+
+/*********  add sup/sub to Gutenberg wp.editor.RichTextToolbarButton **********/
+
 function dw_guten_script_register() {
 	wp_register_script(
 		'dw-guten-js',
@@ -23,4 +26,19 @@ function dw_guten_enqueue () {
 }
 add_action( 'enqueue_block_editor_assets', 'dw_guten_enqueue' );
 
+
+/*********  add custom metaboxes (meta_desc,media) to Gutenberg sidebar **********/
+
+include_once('metabox.php');
+
+function dw_guten_enqueue_assets() {
+	wp_enqueue_script(
+		'dw-gutenberg-sidebar',
+		plugins_url( 'build/index.js', __FILE__ ),
+		array( 'wp-plugins', 'wp-edit-post', 'wp-element', 'wp-components', 'wp-data' )
+	);
+}
+add_action( 'enqueue_block_editor_assets', 'dw_guten_enqueue_assets' );
+
+
 ?>

metabox.php

@@ -0,0 +1,115 @@
+<?php
+
+function dw_guten_register_media_meta() {
+	register_meta('post', 'media', array(
+		'show_in_rest' => true,
+		'type' => 'string',
+		'single' => true,
+		'sanitize_callback' => 'sanitize_text_field',
+		'auth_callback' => function() { 
+			return current_user_can('edit_posts');
+		}
+	));
+}
+add_action('init', 'dw_guten_register_media_meta');
+
+function dw_guten_register_desc_meta() {
+	register_meta('post', 'meta_desc', array(
+		'show_in_rest' => true,
+		'type' => 'string',
+		'single' => true,
+		'sanitize_callback' => 'sanitize_text_field',
+		'auth_callback' => function() { 
+			return current_user_can('edit_posts');
+		}
+	));
+}
+add_action('init', 'dw_guten_register_desc_meta');
+
+function dw_guten_add_media_meta_box() {
+	add_meta_box( 
+		'dw_guten_post_options_metabox', 
+		'Post Options', 
+		'dw_guten_post_options_metabox_html', 
+		'post', 
+		'normal', 
+		'default',
+		array('__back_compat_meta_box' => true)
+	);
+}
+add_action( 'add_meta_boxes', 'dw_guten_add_media_meta_box' );
+
+function dw_guten_add_desc_meta_box() {
+	add_meta_box( 
+		'dw_guten_post_options_metabox', 
+		'Post Options', 
+		'dw_guten_post_options_metabox_desc', 
+		'post', 
+		'normal', 
+		'default',
+		array('__back_compat_meta_box' => true)
+	);
+}
+add_action( 'add_meta_boxes', 'dw_guten_add_desc_meta_box' );
+
+function dw_guten_post_options_metabox_html($post) {
+    $field_value = get_post_meta($post->ID, 'media', true);
+    wp_nonce_field( 'dw_guten_update_post_metabox', 'dw_guten_update_post_nonce' );
+    ?>
+    <p>
+        <label for="dw_guten_media_metafield"><?php esc_html_e( 'Media URL', 'textdomain' ); ?></label>
+        <br />
+        <input class="widefat" type="text" name="dw_guten_media_metafield" id="dw_guten_media_metafield" value="<?php echo esc_attr( $field_value ); ?>" />
+    </p>
+    <?php
+}
+
+function dw_guten_post_options_metabox_desc($post) {
+    $field_value = get_post_meta($post->ID, 'media', true);
+    wp_nonce_field( 'dw_guten_update_post_metabox_desc', 'dw_guten_update_post_nonce' );
+    ?>
+    <p>
+        <label for="dw_guten_desc_metafield"><?php esc_html_e( 'Meta Excerpt', 'textdomain' ); ?></label>
+        <br />
+        <input class="widefat" type="text" name="dw_guten_desc_metafield" id="dw_guten_desc_metafield" value="<?php echo esc_attr( $field_value ); ?>" />
+    </p>
+    <?php
+}
+
+function dw_guten_save_post_metabox($post_id, $post) {
+    $edit_cap = get_post_type_object( $post->post_type )->cap->edit_post;
+    if( !current_user_can( $edit_cap, $post_id )) {
+        return;
+    }
+    if( !isset( $_POST['dw_guten_update_post_nonce']) || !wp_verify_nonce( $_POST['dw_guten_update_post_nonce'], 'dw_guten_update_post_metabox' )) {
+        return;
+    }
+
+    if(array_key_exists('dw_guten_media_metafield', $_POST)) {
+        update_post_meta( 
+            $post_id, 
+            'media', 
+            sanitize_text_field($_POST['dw_guten_media_metafield'])
+        );
+    }
+}
+add_action( 'save_post', 'dw_guten_save_post_metabox', 10, 2 );
+
+function dw_guten_save_post_metabox_desc($post_id, $post) {
+    $edit_cap = get_post_type_object( $post->post_type )->cap->edit_post;
+    if( !current_user_can( $edit_cap, $post_id )) {
+        return;
+    }
+    if( !isset( $_POST['dw_guten_update_post_nonce_desc']) || !wp_verify_nonce( $_POST['dw_guten_update_post_nonce_desc'], 'dw_guten_update_post_metabox_desc' )) {
+        return;
+    }
+
+    if(array_key_exists('dw_guten_desc_metafield', $_POST)) {
+        update_post_meta( 
+            $post_id, 
+            'meta_desc', 
+            sanitize_text_field($_POST['dw_guten_desc_metafield'])
+        );
+    }
+}
+add_action( 'save_post', 'dw_guten_save_post_metabox_desc', 10, 2 );

package.json

@@ -1,16 +1,26 @@
 {
   "name": "dw_guten",
-  "version": "1.0.0",
-  "description": "I needed to strip out some of the functionality of my theme in order to build the features back into the gutenberg editor.",
-  "main": "dw-guten.js",
+  "version": "0.2.0",
+  "description": "Add custom fields into the gutenberg editor.",
+  "repository": {
+    "type": "git",
+    "url": "https://code.davidawindham.com/david/dw_guten"
+  },
+  "main": "index.js",
   "scripts": {
-	  "start": "wp-scripts start",
-	  "build": "wp-scripts build"
+    "start": "wp-scripts start",
+    "build": "wp-scripts build"
   },
   "author": "windhamdavid",
   "license": "ISC",
   "devDependencies": {
-    "@wordpress/scripts": "^5.0.0"
+    "@wordpress/scripts": "^5.1.0"
+  },
+  "dependencies": {
+    "@wordpress/components": "^8.5.0",
+    "@wordpress/data": "^4.12.0",
+    "@wordpress/edit-post": "^3.11.0",
+    "@wordpress/i18n": "^3.8.0",
+    "@wordpress/plugins": "^2.10.0"
   }
-
 }

readme.md

@@ -1,5 +1,11 @@
-### DW Gutenberg ( WordPress Plugin )
+### DW Gutenberg 
+######( WordPress Plugin )
 
-#### I needed to strip out some of the functionality of my theme in order to build the features back into the gutenberg editor. 
+#### build theme features into the gutenberg editor using a plugin.  
+ [https://davidawindham.com/gutenberg-sidebar/](https://davidawindham.com/gutenberg-sidebar/)
 
-###### ver 0.1 - Add Superscript and Subscript to Gutenberg so I can make citations in my posts.
+v. 0.1 - Add Superscript and Subscript to Gutenberg so I can make citations in my posts.  
+
+v. 0.2 - Add 'Meta Excerpt' for postmeta:meta-desc alternative to post excerpt from the function 'dw_ good_excerpt'  
+
+v. 0.3 - Add 'Media' URL postmeta for the OpenGraph/Twitter embedded media container

src/index.js

@@ -0,0 +1,101 @@
+import { registerPlugin } from "@wordpress/plugins";
+import { PluginSidebar, PluginSidebarMoreMenuItem } from "@wordpress/edit-post";
+import { __ } from "@wordpress/i18n";
+import { PanelBody, TextControl, TextareaControl } from "@wordpress/components";
+import { withSelect, withDispatch } from "@wordpress/data";
+
+let PluginMetaFields = (props) => {
+	return (
+	<>
+		<PanelBody
+			title={__("Media URL", "textdomain")}
+			icon="format-video"
+			intialOpen={ true }
+		>
+		<TextControl 
+			value={props.text_metafield}
+			label={__("meta property og:video meta", "textdomain")}
+			help="postmeta:media absolute url to video"
+			onChange={(value) => props.onMetaFieldChange(value)}
+		/>
+		</PanelBody>
+	</>
+	)
+}
+
+let PluginMetaFields_desc = (props) => {
+	return (
+	<>
+		<PanelBody
+			title={__("Meta Excerpt", "textdomain")}
+			icon="format-aside"
+			intialOpen={ true }
+		>
+		<TextareaControl 
+			value={props.text_metafield_desc}
+			label={__("meta name=description", "textdomain")}
+			help="postmeta:meta-desc alternative to post excerpt from the function dw_good_excerpt"
+			onChange={(value) => props.onMetaFieldChange_desc(value)}
+		/>
+		</PanelBody>
+	</>
+	)
+}
+
+PluginMetaFields = withSelect(
+    (select) => {
+        return {
+             text_metafield: select('core/editor').getEditedPostAttribute('meta')['media']
+        }
+    }
+)(PluginMetaFields);
+
+PluginMetaFields_desc = withSelect(
+    (select) => {
+        return {
+             text_metafield_desc: select('core/editor').getEditedPostAttribute('meta')['meta_desc']
+        }
+    }
+)(PluginMetaFields_desc);
+
+PluginMetaFields = withDispatch(
+    (dispatch) => {
+        return {
+            onMetaFieldChange: (value) => {
+                dispatch('core/editor').editPost({meta: {media: value}})
+            }
+        }
+    }
+)(PluginMetaFields);
+
+PluginMetaFields_desc = withDispatch(
+    (dispatch) => {
+        return {
+            onMetaFieldChange_desc: (value) => {
+                dispatch('core/editor').editPost({meta: {meta_desc: value}})
+            }
+        }
+    }
+)(PluginMetaFields_desc);
+
+registerPlugin( 'dw-sidebar', {
+    icon: 'welcome-widgets-menus',
+    render: () => {
+        return (
+            <>
+                <PluginSidebarMoreMenuItem
+                    target="dw-sidebar"
+                >
+                    {__('Meta Options', 'textdomain')}
+                </PluginSidebarMoreMenuItem>
+                <PluginSidebar
+                    name="dw-sidebar"
+                    title={__('Post Meta', 'textdomain')}
+                >
+                    <PluginMetaFields />
+                    <PluginMetaFields_desc />
+                </PluginSidebar>
+            </>
+        )
+    }
+})