Once you have installed Intercom on your site, you should see the Messenger in the bottom right of your screen. You may now want to tailor how the Messenger appears on your site.

Messenger alignment

By default the Messenger will appear on the bottom right corner of you site, but you can change its position if you like. To do this simply add the extra lines below to you installation script:

window.intercomSettings = {
    app_id: ‘abc123’,
    alignment: 'left',			# Customize left or right position of messenger
    horizontal_padding: 20,		# Customize horizontal padding
    vertical_padding: 20		# Customize vertical padding

Interactive Configuration Example

Intercom Configure Example

The above link is to a Codepen where you can test the different configuration options outlined here. Codepen allows you to copy and paste code into an JS (or HTML and CSS) editor where you see the results immediately. You can use your own App ID if you have one or your can user our test example App ID, whatever you find easier.

What's Next

To see more examples of how you can customize the Messenger, view both our docs on customization and our Javascript API.

Customize the Messenger (Technical)
The Intercom JavaScript API


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.