Complete Examples

// Fixed corner popup
const supportChat = Querlo.embed({
    id: 'ID_1',
    template: 'darkstudio',
    embedType: 'popup',
    posX: 'right',
    posY: 'bottom',
});

// Always-visible inline chat in a page section
const inlineChat = Querlo.embed({
    id: 'ID_2',
    template: 'kawaii',
    embedType: 'inpage',
    container: '#assistant-panel',
    width: '100%',
    height: '500px',
});

// Close everything when user logs out
Querlo.close();

const previewChat = Querlo.embed({
    id: 'ID_3',
    template: 'liquidmetal',
    embedType: 'inpage_popup',
    container: '#chat-preview-area',
    width: '100%',
    height: '280px',
    speakerName: 'Support',
});

// Programmatically open the overlay from a button elsewhere on the page
document.getElementById('open-chat-btn').addEventListener('click', () => {
    previewChat.open();
});

const chat = Querlo.embed({ id: 'ID_1' });

// Later, redirect to a different chat with parameters
chat.changeChat('OTHER_CHAT_ID', { user_name: 'John' });