Agent Configuration Example
An example showcasing how to customize your Foldspace Agent’s look and behavior.
foldspace.agent('API-KEY').setConfiguration({
// String properties
agentDisplayName: "Foldspace Assistant",
entryMessage: "What can I help with?",
logoUrl: "https://assets.foldspace.com/logos/foldspace-logo-light.svg",
renderMode: "IFRAME",
promptBarHint: "Ask me anything...",
// Boolean properties
allowAgentDrag: true,
enableVoiceChat: true,
enableSpeechToText: true,
displaySparkIcon: true,
// Position property (format: "VERTICAL_HORIZONTAL")
initialAgentPosition: "BOTTOM_RIGHT",
// Session timeout in minutes
sessionTimeout: 30,
// Theme object
theme: {
primaryColor: "#0066FF",
primaryFontColor: "#0B1220",
backgroundColor: "#FFFFFF",
fontFamily: "Roboto",
fontSize: 14,
secondaryFontColor: "#6B7280",
secondaryColor: "#F3F4F6",
borderColor: "#E6E9EE"
},
// Dark mode settings
darkModeSettings: {
darkTheme: {
primaryColor: "#3B82F6",
primaryFontColor: "#FFFFFF",
backgroundColor: "#0F1724",
fontFamily: "Roboto",
fontSize: 14,
secondaryFontColor: "#9CA3AF",
secondaryColor: "#111827",
borderColor: "#1F2937"
},
darkLogoUrl: "https://assets.foldspace.com/logos/foldspace-logo-dark.svg"
},
// Border animation settings
borderAnimationSettings: {
enableBorderAnimation: true,
borderColors: ["#0066FF", "#3B82F6", "#60A5FA"]
},
// Conversation starters settings
conversationStartersSettings: {
defaultConversationStarter: "KNOWLEDGE",
startNewConversationOnStarterClick: true,
conversationStarters: {
KNOWLEDGE: [
{ title: "What is your return policy?" },
{ title: "How do I track my order?" },
{ title: "Show me product specifications" }
],
ACTION: [
{ title: "Schedule a demo" },
{ title: "Check my order status" },
{ title: "Contact support" }
]
}
},
// Style override
styleOverride: {
entryComponentStyle: {
header: {
horizontalAlignment: "start"
},
conversationStarter: {
borderColor: "#E6E9EE",
borderWidth: 1
}
},
speechBubbleStyle: {
padding: "14px 16px",
borderRadius: "12px",
backgroundColor: "#FFFFFF",
color: "#0B1220",
fontSize: "14px",
lineHeight: "1.4"
}
},
shareStateSettings: {
active: true,
tooltipText: "Enable Tandem Mode — allow the assistant to read the page to help complete tasks",
tooltipStarters: [
"Fill out this form for me",
"Suggest values for the fields on this page"
]
},
screenSharingSettings: {
active: true,
tooltipText: "Allow the assistant to understand this page and provide helpful suggestions",
tooltipStarters: [
"Summarize this page for me",
"Highlight important information here"
],
shareMode: "both"
}
});Updated 1 day ago