Shopify Inbox Widget Customization

[BlueJayAlley]

I would like to request an enhancement to the Shopify Inbox app theme editor settings. I would appreciate the change from the plain-text box for the “Greeting Message” field to a rich-text box. This would facilitate the separation of information for customers. Additionally, we would like the ability to select a custom message (text) for the actual widget before it opens, rather than relying on a dropdown menu of predetermined labels. Furthermore, there should also be an option to upload a custom icon. Lastly, we would like the option to name the AI agent, which would provide a more personalized touch. These few simple updates would significantly improve the experience and make it more tailored to each store. Thank you.

[Ploqo]

The default Shopify button:

After applying fix:

Your own button in its place:

Clicking it opens the real Inbox chat:

---

Coming back to your problem

The Label is a set list (Chat, Help, Support, and so on). You cannot type your own.

The Icon is the same, six presets with no upload.

Custom button text and a custom icon - free, with one code block

• Hide Shopify’s button and add your own.
• The chat button is added by an app, so it is not in your theme files. Go to Online Store > Themes > Edit code, open layout/theme.liquid, and paste this just before the closing </body> tag. A Custom Liquid section only shows on the one page you add it to, so theme.liquid is better for a store-wide button.
• Upload a light-colored icon under Settings, Files and use its URL in place of YOUR-ICON-URL.

<style>
#my-chat-launcher{position:fixed;right:20px;bottom:20px;z-index:2147483000;display:flex;align-items:center;gap:8px;background:#7a3cff;color:#fff;border:none;border-radius:999px;padding:12px 20px;font:600 15px/1 system-ui,sans-serif;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.25)}
#my-chat-launcher img{width:22px;height:22px}
</style>

<button id="my-chat-launcher" type="button">
  <img src="YOUR-ICON-URL" alt="">
  <span>Message our team</span>
</button>

<script>
(function () {
  var HIDE = '.activator{opacity:0!important;visibility:hidden!important;pointer-events:none!important;width:0!important;height:0!important;overflow:hidden!important}';
  function allRoots() {
    var rs = [document];
    (function walk(r) {
      r.querySelectorAll('*').forEach(function (el) {
        if (el.shadowRoot) { rs.push(el.shadowRoot); walk(el.shadowRoot); }
      });
    })(document);
    return rs;
  }
  function findActivator() {
    var rs = allRoots();
    for (var i = 0; i < rs.length; i++) {
      var el = rs[i].querySelector('button.activator');
      if (el) return { el: el, root: rs[i] };
    }
    return null;
  }
  function hideDefault() {
    var f = findActivator();
    if (f && !f.root.querySelector('style[data-hide-default]')) {
      var st = document.createElement('style');
      st.setAttribute('data-hide-default', '1');
      st.textContent = HIDE;
      f.root.appendChild(st);
    }
  }
  setInterval(hideDefault, 400);
  hideDefault();
  document.getElementById('my-chat-launcher').addEventListener('click', function () {
    var f = findActivator();
    if (f && f.el) f.el.click();
  });
})();
</script>

Rich-text greeting message - not available yet

Naming the AI agent - not available yet

Inbox does not give the assistant a name field.

Regards,
Ajay

[BlueJayAlley]

Thank you! That’s very helpful. I appreciate your insight and time.