> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://support.easystore.co/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Relocate Messenger Chat Box

Having issue of Messenger chat box blocking your mobile navigation bar? No worries, we got your back. Now the Messenger chat box's location can be relocate above the mobile navigation bar :)

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/b-2023-10-11t161453957_12n5qi4.png)

**⚠️Caution:**
1. Please re-do the coding, if you change theme as the coding is not implant in the new theme yet.  
2. The coding below is only for Messenger Channels plug-in.  
---
## How to relocate the Messenger button？

**Step 1：**Proceed to EasyStore Admin Panel > Channels > Online Store > Edit Sources > Look for **base.css**
  
**Step 2：**Add the below coding in the bottom of **base.css.**  

``` div#fb-root iframe {bottom: 90px !important;}```

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/b-2023-10-11t161706904_1v9fpxf.png)

**Step 3：**Save and done!  
---
End result as below：

### Mobile View

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/b-2023-10-11t161819973_1as8diu.png)

### Desktop view:

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/b-2023-10-11t161853028_wupm6g.png)

If you have more than 2 chat buttons and if they overlap with each other, you can also refer to the steps given above to avoid the overlapping issue.

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/b-2023-10-11t162011052_1kgo3qv.png)

The end result would appear as the image shown below:

![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/b-2023-10-11t162049119_1gjfu4m.png)