Handling HTML Output in Salesforce Digital Experience Chatbots

Question:

We are building a chatbot for a Salesforce Digital Experience site and need it to handle HTML-formatted output dynamically. Currently, we use prompts in Prompt Builder that generate HTML-formatted text. This text is written into Salesforce long rich text area fields, leveraging their rich text formatting capabilities. However, when the same HTML-formatted output is displayed in a Digital Experience site via the chatbot, the content appears as plain text, including all the HTML tags and elements, rather than being rendered as formatted output.

Our challenge is to create a solution where the chatbot either parses the HTML properly for display in Digital Experience or dynamically adapts its output based on whether it is being used in Digital Experience (formatted output) or written into a Salesforce record (HTML output). We want to avoid duplicating prompts for these two use cases. Is there a way to achieve this flexibility, or do we need separate prompts for each scenario? Are there alternative solutions to handle this issue effectively?

CRS Info Solutions offers industry-leading Salesforce training with real-time projects, certification guidance, interview coaching, and a practical approach to make you job-ready.

Answer:

The problem lies in how Salesforce Digital Experience handles output from the chatbot and how HTML is rendered (or not rendered) in its interface. Below are several approaches to resolve the issue:

1. Ensure HTML Rendering in Digital Experience

First, verify whether the Digital Experience site supports HTML rendering for chatbot outputs. Salesforce chatbots often work with plain text by default. If HTML rendering is possible, enable it through the Digital Experience settings or by modifying the chatbot’s configuration.

For example, check if the chatbot’s component or container on the Digital Experience page can be configured to parse and display HTML. This might involve customizing the underlying component’s attributes or using an enhanced container for rich text.

2. Conditionally Strip HTML Tags Using Code

If the chatbot cannot directly render HTML, you can use logic within the flow or an Apex class to strip HTML tags when the output is sent to the Digital Experience chatbot. For example, using the stripHtmlTags method in Apex:

public static String stripHtmlTags(String input) {
    return input.replaceAll('<[^>]*>', '');
}

Explanation:

The stripHtmlTags method removes HTML tags from a given string using the replaceAll method with a regular expression. The pattern <[^>]*> matches any HTML tag by identifying text enclosed within angle brackets (< >), and replaces it with an empty string (''). This effectively cleans the input string by stripping out all HTML elements while preserving the plain text content.

Example:
Input:

<p>This is a <b>bold</b> text.</p>

Output:

This is a bold text.

Summary:

This method strips all HTML tags from the input string, leaving behind only the text content. It’s useful when you want to display raw text without any HTML formatting or when processing content for environments (like chatbots or records) that don’t support HTML.

In this approach, you would:

1. Check the context (Digital Experience chatbot vs. backend storage).
2. Apply the stripHtmlTags method only for chatbot output.
3. Retain HTML for the backend storage scenario.

3. Middleware for Dynamic Formatting

Introduce a middleware or transformation layer, such as an Apex utility class or a Flow action, to dynamically adjust the output format based on the target context. This layer can detect whether the output is meant for Digital Experience or Salesforce records and transform the content accordingly.

Example implementation in Apex:

public class ChatbotOutputProcessor {
    public static String processOutput(String input, Boolean forDigitalExperience) {
        if (forDigitalExperience) {
            return stripHtmlTags(input); // Plain text for chatbot
        } else {
            return input; // Keep HTML for records
        }
    }
    
    private static String stripHtmlTags(String input) {
        return input.replaceAll('<[^>]*>', '');
    }
}

Explanation:

The ChatbotOutputProcessor class processes chatbot output based on the forDigitalExperience flag. If forDigitalExperience is true, it removes HTML tags using the stripHtmlTags method; otherwise, it returns the original input. This ensures plain text for chatbot interactions while preserving HTML formatting for records.

The provided code defines a public class called ChatbotOutputProcessor, which includes two methods designed to process and format the output text based on whether it is meant for a Digital Experience chatbot or for storage in a Salesforce record.

Use Case:

• When the output is being prepared for display in a Digital Experience chatbot (or any context where raw HTML should not be shown), the processOutput method will strip out the HTML tags and return the plain text.
• When the output is intended for storing in a Salesforce record (such as in a rich text field), the HTML tags are kept intact for proper formatting.

This code helps streamline the process of managing output that needs to be displayed differently depending on the context (Digital Experience chatbot vs. Salesforce record storage).

Call this processor from a Flow or directly in the chatbot integration.

4. Separate Prompts for Different Use Cases

If dynamic transformation or middleware solutions are not feasible, the fallback solution is to maintain two versions of each prompt: one for Digital Experience (plain text) and one for backend storage (HTML). This approach ensures clear separation but requires duplication and additional maintenance.

5. Use Rich Text Fields in Digital Experience

If the Digital Experience chatbot supports embedding rich text fields, consider saving the formatted output to a rich text area field and referencing it dynamically within the chatbot. This approach leverages the existing rich text formatting capabilities without displaying raw HTML tags.

Recommendation

The best approach depends on your specific requirements and constraints. If your chatbot usage is flexible, consider solutions 1 or 3 to dynamically adapt the output. If HTML rendering in Digital Experience is not feasible, solution 2 provides a streamlined fallback. Solution 4 should only be used if no other options are viable, as it increases complexity.

Summing Up

In Salesforce Digital Experience chatbots, handling HTML-formatted output requires careful management to ensure content displays correctly across different contexts. When generating output for the chatbot, raw HTML can appear as plain text with tags visible, which is undesirable. To address this, solutions like dynamically stripping HTML tags or utilizing conditional logic based on the context (whether the content is for a Digital Experience chatbot or Salesforce record storage) can be employed.

By implementing techniques like using Apex classes to conditionally process and transform the output, you can ensure the appropriate format is displayed in each scenario. These methods help maintain content flexibility, allowing HTML formatting to be preserved where necessary while ensuring plain text is shown in the chatbot for a clean, readable experience.

Master Salesforce in Hyderabad: Your Path to Success

Enhance your Salesforce expertise with our comprehensive training program designed to make you industry-ready. Salesforce training in Hyderabad Our curriculum covers Admin, Developer, and AI tracks with well-structured modules, hands-on experience, and in-depth class notes. Gain the skills to achieve certification, ace interviews, and excel in your career. Join our free demo class today to experience expert guidance and practical learning that paves the way to your dream job!