Skip to content

badasswp/search-and-replace

Repository files navigation

search-and-replace

Search and Replace text within the Block Editor quickly and easily.

search-and-replace

Download

Download from WordPress plugin repository.

You can also get the latest version from any of our release tags.

Why Search and Replace for Block Editor?

This plugin brings the familiar Search and Replace functionality that PC users have grown accustomed to while using Microsoft Word and Google Docs to the Block Editor.

Now you can easily search and replace text right in the Block Editor. Its easy and does exactly what it says. You can also match the text case using the 'Match Case | Expression' toggle.

search-and-replace-text-for-block-editor.mov

Hooks

search-replace-for-block-editor.allowedBlocks

This custom hook (filter) provides the ability to include the search and replace functionality for your custom block:

import { addFilter } from '@wordpress/hooks';

addFilter(
  'search-replace-for-block-editor.allowedBlocks',
  'yourBlocks',
  (allowedBlocks) => {
    if (allowedBlocks.indexOf('your/block') === -1) {
      allowedBlocks.push('your/block');
    }

    return allowedBlocks;
  }
);

Parameters

  • allowedBlocks {string[]} List of Allowed Blocks.

search-replace-for-block-editor.keyboardShortcut

This custom hook (filter) provides a way for users to specify their preferred keyboard shortcut option. For e.g to use the 'K' option on your keyboard, you could do like so:

import { addFilter } from '@wordpress/hooks';

addFilter(
  'search-replace-for-block-editor.keyboardShortcut',
  'yourShortcut',
  (shortcut) => {
    return {
      character: 'k',
      ...shortcut,
    }
  }
);

Parameters

  • shortcut {Object} By default this is an object, containing modifier and character properties which together represent the following command CMD + SHIFT + F.

search-replace-for-block-editor.caseSensitive

This custom hook (filter) provides a way for users to specify the case sensitivity of each Search & Replace activity. For e.g. to make it case sensitive, you can do like so:

import { addFilter } from '@wordpress/hooks';

addFilter(
  'search-replace-for-block-editor.caseSensitive',
  'yourCaseSensitivity',
  (isCaseSensitive) => {
    return true;
  }
);

Parameters

  • isCaseSensitive {bool} By default, this is a falsy value.

Development

Setup

  • Clone the repository into your wp-content/plugins folder.
  • Make sure you have Node installed on your computer.
  • Install yarn globally: npm install --global yarn.
  • Run yarn install && yarn build to build JS dependencies.
  • For local development, you can use Docker or Local by Flywheel.