# Static chat ### Section overview The Static chat section creates a simulated chat interface for your Shopify store, allowing you to display conversations with animated typing indicators, timed message reveals, and support for text, avatars, images, and videos. #### Common use cases * Creating interactive customer support demonstrations * Showcasing product Q\&A in a conversational format * Displaying testimonials or customer experiences in a chat-like interface * Creating guided tutorials or onboarding flows in a friendly chat format #### Usage tips * Use the delay settings to create a natural conversation flow by timing message appearances * Alternate between left and right alignment to create the appearance of a two-person conversation * For best readability, keep your column width between 50-70% on desktop * Add avatar blocks after text blocks to create a more personalized conversation experience Mobile responsiveness considerations: * The chat interface automatically adapts to smaller screens, with content reflow * Consider using shorter messages for better mobile readability * Test your chat section on mobile to ensure the timing feels natural on smaller screens ### Section settings | Setting | Description | | -------------------- | ----------------------------------------------------------------------------------------- | | Top spacing | Controls the amount of padding above the chat section (in pixels) | | Bottom spacing | Controls the amount of padding below the chat section (in pixels) | | Color scheme | Sets the background color for the entire chat section | | Custom color | Allows choosing a custom background color when "Custom" is selected as the color scheme | | Text color | Controls the text color for the entire section (default, light, or dark) | | Border color | Sets the color for any borders (subtle or strong) | | Enable color fade | Makes the background and text color fade in when the section enters the viewport | | Border position | Controls where borders appear (none, top, bottom, or both) | | Horizontal alignment | Sets the horizontal alignment of the chat column (left, center, or right) | | Column width | Controls the width of the chat content column as a percentage of the container on desktop | | Enable margin | When enabled, adds horizontal margin to the section | | Visibility | Controls when the section is visible (all devices, mobile only, or desktop only) | ### Block settings #### Text Text blocks display chat messages with typing indicators and timed reveals. Each text block can be styled and positioned independently. Limit: 50 blocks | Setting | Description | | -------------------- | ------------------------------------------------------------------- | | Content | Rich text editor for the message content | | Color scheme | Sets the background and text color for this message bubble | | Horizontal alignment | Controls whether the message appears on the left or right side | | Delay | Sets how many seconds to wait before revealing this message (0-10s) | #### Avatar Avatar blocks display a profile image with a timestamp, typically used to indicate who is speaking in the conversation. Limit: 50 blocks | Setting | Description | | -------------------- | ----------------------------------------------------------------------------- | | Image | The profile image to display (shows a placeholder if none selected) | | Time | Text displayed next to the avatar (typically shows when the message was sent) | | Horizontal alignment | Controls whether the avatar appears on the left or right side | #### Image Image blocks display an image within the chat interface, with typing indicators and timed reveals. Limit: 50 blocks | Setting | Description | | -------------------- | ----------------------------------------------------------------------- | | Image | The image to display in the chat (shows a placeholder if none selected) | | Horizontal alignment | Controls whether the image appears on the left or right side | | Delay | Sets how many seconds to wait before revealing this image (0-10s) | #### Video Video blocks embed videos in the chat interface, with typing indicators and timed reveals. | Setting | Description | | -------------------- | ----------------------------------------------------------------- | | Video | The video to display in the chat | | Enable autoplay | When enabled, the video plays automatically when revealed | | Enable mute toggle | When enabled, displays a button to toggle sound on/off | | Enable loop | When enabled, the video will repeat continuously | | Horizontal alignment | Controls whether the video appears on the left or right side | | Delay | Sets how many seconds to wait before revealing this video (0-10s) | --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://help.brickspacelab.com/space/sections/forms/static-chat.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.