Widget

The widget is an agent that you can integrate into your website or e-commerce, acting as an informant and a customer service available 24/7. Swiftask makes it easy to create this widget, even if you have no programming skills. Integrating the agent into your site is easy thanks to the links provided during the creation of your agent.

1

Go to the "Agents" section

2

Click on "Create an agent."

3

Give your agent a name.

4

Select an Agent template. Choose Blank template if you want to customize manually your agent.

5

Customize your prompt.

6

Attach a knowledge base if necessary.

Provide custom knowledge that your assistant will access to inform its responses. Your assistant will retrieve relevant sections from the knowledge base based on the user message. The data in the knowledge base may be made viewable by other users through assistant responses or citations.

To know more about each knowledge bases

7

Add skills to extend the agent's capabilities.

This collection of skills enables our agent to intelligently interpret and respond to user requests. It includes capabilities for natural language understanding and data analysis, providing personalized responses. The resulting interactions showcase the agent's efficiency and advanced skills.

To know more about each skills

8

Customize its appearance.

To customize the appearance of your agent, go to the Widget section. There you can modify the subtitle, the prompt text for the input, the welcome message, the avatar, the chat color with the agent, the widget icon, the greeting message, and the starter questions.

9

Test its effectiveness.

10

Switch to Developer section and Copy/Pate the link to embed your widget in your website

Even without any programming knowledge, you can easily integrate your agent into your website as a widget. To do this, once your agent is configured, go to the "Developer" section where you will find the codes to copy and paste onto your site.

Detailed Explanation

1. Agent Client Token

• Purpose: This token is a unique identifier for your agent. It is used for authentication purposes when making requests to Swiftask's backend services.

• Usage: Ensure that this token is kept secure, as it grants access to your agent's functionalities.

• Example: "23521f93-7487-496b-9dac-bc9db0e69cae"

2. Agent Slug

• Purpose: The slug is a user-friendly identifier for your agent, typically used in URLs and API calls. It should be unique within the Swiftask ecosystem.

• Usage: This slug can be referenced when embedding the agent in your website or when making API requests.

• Example: "documentation-agentik3cc"

3. Widget Integration

• Purpose: This section provides options to generate code snippets that can be embedded directly into your website to display the agent widget.

• Usage: Once you configure your agent, you can copy the provided HTML/JavaScript code and paste it into your website's codebase.

• Example: A simple snippet might look like:

  Copy<script src="https://yourwidgeturl.com/widget.js"></script>

4. Iframe Integration

• Purpose: This option allows you to embed the agent in an iframe, which can be useful for isolating the agent's interface from the rest of your website's styling.

• Usage: Similar to widget integration, you would copy the iframe code and place it in your HTML.

• Example:

  Copy<iframe src="https://yourwidgeturl.com/iframe" width="400" height="600"></iframe>

5. API Integration

• Purpose: This section provides information on how to interact with the agent programmatically using APIs. It may include endpoints for sending messages, receiving responses, and managing user sessions.

• Usage: Developers can use this API to build custom interactions or automate tasks.

• Example: A typical API call might look like:

  Copyfetch('https://api.swiftask.com/agent/interact', {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${agentClientToken}`,
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({ message: 'Hello, agent!' })
  });

API INTEGRATION