ChatGPT via WYSIWYG

Artificial intelligence applications have hit like a massive wave over this past year, with ChatGPT being the most prominent. ChatGPT can take any written command and suggest content to match. What better than having the power of AI content creation than doing so within your own WYSIWYG editor! That’s what Froala can provide you — instant content creation with the power and intelligence of ChatGPT AI!

Quick Hits

• The ChatGPT plugin can be installed in your WYSIWYG editor
• Type a command, highlight that text, click the ChatGPT button, and wait for the response!
• Help with content creation makes the written experience more enjoyable and the generated content more creative
• Easy to implement from a technical perspective!

Implementing ChatGPT AI into Froala

Adding ChatGPT capability into your Froala WYSIWYG instance is really simple. Start by adding the button, registering the command, and adding it into the toolbar:

// Add the icon to the Chat GPT UI
FroalaEditor.DefineIcon('chatGPT', { NAME: 'help', SVG_KEY: 'help' });

// Register its functionality
FroalaEditor.RegisterCommand('chatGPT', {
  title: 'Ask ChatGPT',
  focus: false,
  undo: false,
  refreshAfterCallback: false,
  callback: async function callback() {
    const CHAT_GPT_KEY = 'YOUR API KEY HERE';
    const data = {
      model: 'text-davinci-003',
      prompt: this.selection.text(),
      max_tokens: 256,
      temperature: 0,
    };
    // Make the API call to ChatGPT
    const response = await fetch('https://api.openai.com/v1/completions', {
      method: 'post',
      headers: {
        'Content-Type': 'application/json',
        Authorization: `Bearer ${CHAT_GPT_KEY}`
      },
      body: JSON.stringify(data)
    });
    const { choices } = await response.json();
    // Insert the suggestion into selected text
    this.html.insert(choices[0].text);
  }
});

// Add ChatGPT to the toolbar during initialization
new FroalaEditor('#editor', {
  toolbarButtons: [['undo', 'redo', 'bold'], ['chatGPT']]
});

That’s all it takes to implement an incredible, powerful AI into your WYSIWYG editor!

ChatGPT and Froala in Tandem

Froala, the next generation WYSIWYG editor, is a perfect host for ChatGPT AI. Content creation is difficult, especially if you’ve run into writer’s block or simply want a better way to express your idea. Since ChatGPT is so smart, it can act as a thesaurus, dictionary, and writing partner all at once.

Use cases for ChatGPT in your WYSIWYG might include:

• Rewording a sentence to improve creativity in the content
• Asking a question to cut down on manual research
• Getting a definition for a word you may not know
• Getting translations for another language
• Many more possibilities!

Building Smarter Interfaces

By incorporating ChatGPT AI into your WYSIWYG content editor, you’re able to build smarter content, applications, and interfaces. How? By asking ChatGPT to incorporate imagery, videos, and even embeddable HTML snippets. Take the following text example:

For example, this is what a healthy dog looks like:

Fetch a picture of a healthy dog <-- selected

After selecting “Fetch a picture of a healthy dog” and clicking the WYSIWYG’s ChatGPT button, the AI will respond by embedding a photo in your content. Likewise, if you ask ChatGPT to insert a video from YouTube, the amazing AI will do so.

Advanced Features

Froala is loaded with advanced features even before you add Chat GPT. Whether it’s image editing, PDF exporting, theming, or AJAX support, you’re really providing the best WYSIWYG available today. One of those crazy-awesome Froala abilities is realtime collaboration, which is even more powerful with ChatGPT — now every realtime collaborator has access to ChatGPT content generation!

Furthermore imagine this: Froala WYSIWYG users can ask ChatGPT to fetch images, videos, and other media to improve their content. The user doesn’t even need to know how to find or embed that media — Froala and ChatGPT do all of the work!

Making AI Accessible

“AI” and “ChatGPT” as keywords can feel intimidating to even the most tech-savvy users. By adding ChatGPT to your Froala WYSIWYG editor, you can make AI technology easy and accessible. Your user can then parlay that AI accessibility into much more rich, quality content to increase conversion and make more money.

Froala has always been an amazing WYSIWYG editor and seeing the addition of ChatGPT makes the WYSIWYG an incredible tool for content creation. Empowering users to create rich web content is all the better with the help of AI. Give Froala WYSIWYG a try and you’ll likely never look back — it keeps getting better!