How to add Fluent Forms into a chat bubble for offline communication.

Jorge de los Reyes That sounds interesting. Do you have the code any place available? It would be interesting to take a look.

Paal Joachim Romdahl Not really. The code is buried somewhere in a Fluent Boards task 😂.

But I can look for it if you want. I think I saved the GPT conversation.

Here’s what happened:

👉 I asked ChatGPT how to build a “bubble chat” for my AI.

👉 Took the first code it gave me.

👉 Dropped in some ad hoc API keys on a test site.

👉 Got it working… and then immediately hit pause.

Why?

Because it was exposing API keys in raw 😅. I figured I’d need a webhook or something safer.

So yeah - if you ask ChatGPT the same question, you’ll probably get the same literal snippet 😄

For me, it was a short-lived “vibe coding” experiment.

I had no clue where to host the code privately, so I just killed it fast.

I was looking for the new containers on bunny as an example. But was not sure if they are made for this kind of experiments 😂

And -lawyer brain here 🤓- all I could see were potential issues everywhere.

I guess that using something like N8n to keep everything encrypted could work. But, I have not retaken the experiment. Maybe in the future, not sure!

Hey Jorge de los Reyes 
1997? Not sure where you got that from. I went to a tech school at that time and learned Photoshop and basic HTML. I had my first web site in perhaps 1999 using HTML and CSS. WordPress I began with in perhaps 2010 and began with easywebdesigntutorials.com in 2012. I work freelance and have various types of customers.

Paal Joachim Romdahl I was referring to this paragraph

"A passion that became mixed in with Photoshop back in 1997. At the time I was taught Dreamweaver and built my first web page."

:)

Jorge de los Reyes Ahhh yes! I remember it was so cool to use Dreamweaver as it was one step up from coding using HTML.

Paal Joachim Romdahl I remember those times too. I remember myself using it while also creating one "My Space" 🤣

Jorge de los Reyes O yeah! "My Space"...:)

Hey arjun arjun I asked ChatGPT about this here was one thing I am copying and pasting. "If you use Fluent Support, simply connect your Fluent Form (inside the chat bubble) to Fluent Support so every submission becomes a support ticket."

Does this answer your question? If not what are your thoughts?

Some more thoughts from ChatGPT.
Step 1 – Add a Fluent Form Inside the Chat Bubble

In the baseline code, we’re already embedding a Fluent Form shortcode:

<?php echo do_shortcode('[fluentform id="10"]'); ?>

Replace 10 with the ID of the form you want to connect to Fluent Support.

Step 2 – Create an Automation in Fluent Support

1. Go to Fluent Support → WorkFlows → Add New Workflow.

2. Choose Trigger → Form Submission (Fluent Forms).

3. Select the same form you placed in the chat bubble.

4. Add an action: Create a Support Ticket.

   • Map the form fields to ticket fields (name, email, message, etc.).
   • Choose the inbox/department where the ticket should land.

Step 3 – Test the Workflow

• Open your website, click the chat bubble, and send a test message.
• Check Fluent Support → Tickets — you should see the new ticket created automatically.

I can always test it out and add it to the tutorial if you feel that helps.

Paal Joachim Romdahl Thank you so much Paal...you are so very helpful...appreciate your readiness in helping out with this sort of effort.

Hi arjun arjun I went to test it out and came across this documentation: https://fluentsupport.com/docs/fluent-form-integration/
I added a link in relation to integrating Fluent Forms into Fluent Support Form at the end of my tutorial.

Paal Joachim Romdahl Thank you Paal for the added detail.

Hi Kristian Pesti I tried first adding a shortcode into the offline message box in WP Social Ninja regular and Pro but it is currently not possible. So I went to ChatGPT and after a few hours work was able to get a result I was happy with. Hopefully the team will add shortcode support into the message boxes in WP Social Ninja.