Google Search Plugin

A Jodit plugin that adds a Google search button to the toolbar. This plugin allows users to quickly search for selected text or the current paragraph in Google.

Features

• Adds a "Google search" button to the Jodit toolbar
• Searches for selected text or the current paragraph if no text is selected
• Opens search results in a new browser tab
• Automatically disables the button when the editor is empty

Installation

Add "google-search" to your Jodit's extraPlugins configuration:

const editor = Jodit.make('#editor', {
    extraPlugins: ['google-search']
});
Copy

Usage

1. Select text in the editor or place the cursor within a paragraph
2. Click the "Google search" button in the toolbar
3. A new browser tab will open with Google search results for the selected text or paragraph

Configuration

The plugin adds a button to the toolbar in the "search" group. You can customize the toolbar to include this button:

const editor = Jodit.make('#editor', {
    extraPlugins: ['google-search'],
    buttons: ['bold', 'italic', 'google']
});
Copy

You can also customize the button's position by defining a custom toolbar:

const editor = Jodit.make('#editor', {
    extraPlugins: ['google-search'],
    toolbar: {
        items: [
            'source', '|',
            'bold', 'italic', '|',
            'google', '|',
            'ul', 'ol', '|',
            'font', 'fontsize', 'brush', 'paragraph'
        ]
    }
});
Copy

Programmatic Usage

You can trigger the Google search functionality programmatically using the startSearch command:

const editor = Jodit.make('#editor', {
    extraPlugins: ['google-search']
});

// Trigger Google search for the selected text or current paragraph
editor.execCommand('startSearch');
Copy

Examples

Basic Usage

const editor = Jodit.make('#editor', {
    extraPlugins: ['google-search'],
    buttons: ['bold', 'italic', 'google']
});
Copy

Custom Button Position

const editor = Jodit.make('#editor', {
    extraPlugins: ['google-search'],
    toolbar: {
        items: [
            'source', '|',
            'bold', 'italic', '|',
            'ul', 'ol', '|',
            'font', 'fontsize', 'brush', 'paragraph', '|',
            'google'
        ]
    }
});
Copy

Adding a Custom Search Button

const editor = Jodit.make('#editor', {
    extraPlugins: ['google-search']
});

// Create a custom button outside the editor
const searchButton = document.createElement('button');
searchButton.textContent = 'Search in Google';
document.body.appendChild(searchButton);

// Add event listener to trigger Google search
searchButton.addEventListener('click', () => {
    editor.execCommand('startSearch');
});
Copy

How It Works

The plugin registers a command called startSearch that performs the following actions:

1. If text is selected in the editor, it uses the selected text as the search query
2. If no text is selected, it uses the text of the current paragraph as the search query
3. It opens a new browser tab with Google search results for the query

The button is automatically disabled when the editor is empty, ensuring that users can only perform searches when there is content to search for.