Hello folks,
how can you change the favicon of the window when you maximise the livechat in the frontend and show it in a new window? I have already changed all favicons in the assets, but the favicon in the frontend does not change. (see picture)
Version of Rocket.Chat Server: Latest
Which version is that?
See here on using latest tags with docker. Answer = DON’T
Also see how to provide proper debugging info here:
https://gist.github.com/reetp#information-that-support-or-devs-will-require
What licence are you using? Starter, Community?
I have a svg favicon on three different servers - EE/Starter/CE and it works fine.
I just downgraded to 6.13.0 just to check a few things, so I’m on 6.13.0 Starter.
Where can I set the favicon for this specific case?
I have changed it in the “Assets” menu everywhere you can change it, but nothing. On the serverside in the panel the favicon is correct. However on the frontend on our WordPress page, there is still the stock RocketChat favicon when you open the chat in a new window.
And
Consider what you have said and where your issue might lie.
Have you checked the URL for the favicon in your WP page?
Thanks for your reply.
I had another idea. Simply hide the maximize button via Livewidget API, but unfortunately nothing happens. I add the code directly in RocketChat (Additional Scripts) nothing. I add the code directly in WordPress, nothing.
How to use this? Why don’t I see any difference?
RocketChat(function(){
this.setTheme({
hideExpandChatButton: true
});
});
I have officially installed RocketChat via Dockercompose as specified by RocketChat.
I have added the code to the script code of the chat (ignore the *****):
Not really sure as it’s a Wordpress issue really.
Check your browser and see what code it generates on your WP site and any errors.
Thank you for your help. The only error code the inspector spits out regarding Rocketchat is this one:
I think you are wildly leaping about making guesses and not actually methodically debugging here.
You started off with favicon and now on live chat and I’m still not exactly sure of your setup.
We are stumbling into an XY problem here.
Explain how & where rocket is deployed, the same with WP, and the relationship to wordpress?
Is it just livechat embedded in the WP site? You need to be sure of how you do that as likely WP may try & mangle the code.
Or are you trying to put Rocket in an iframe on WP? Same issue applies.
Go back, read all the links in my gist, and explain properly step by step what you have done and what you are trying to achieve.
Remember, you know what you have done but we can’t see any of it. Explain like we are blind.
Thanks for your help. Very glad.
Okay, let me explain:
RocketChat runs on a separate domain in a Docker image - per official instructions from RocketChat with Docker Compose (MongoDB 6+RocketChat).
I then connected the domain to which RocketChat is running using a Docker proxy rule (in Plesk) and entered the necessary NGINX directives so that everything works with the reverse proxy. The replica set of MongoDB is also initiated and works.
WordPress runs on a different domain.
I added RocketChat there using a script (the script that RocketChat gave me in the omnichannel). I only integrated the live chat in WordPress. The rest is rather unimportant for our project. It is therefore only about the live chat.
The RocketChat script runs in an iFrame either way, even if you integrate it with the script that RocketChat generates. I have integrated it directly into “Elementor Custom Codes” as …</script) and let it load in the body (end).
WordPress is installed as normal on the (other) domain, via Plesk directly.
Both domains run with an SSL certificate and can be accessed without any problems. RocketChat works flawlessly except for the aforementioned problem that the CSS and scripts I add are ignored.
Rocket - OK.
Wordpress - OK
If you did that correctly it shoudl just work.
This doesn’t make a whole lot of sense. Yes the code generates an iframe for the livechat widget.
The most important thing is to look at your WP site and View Source and look where the JS is.
Mine is like this (on a different site, but the principle is the same):
</div>
</footer>
</div><!-- .site-wrapper -->
<!-- Start of Rocket.Chat Livechat Script -->
<script type="text/javascript">
(function(w, d, s, u) {
w.RocketChat = function(c) { w.RocketChat._.push(c) }; w.RocketChat._ = []; w.RocketChat.url = u;
var h = d.getElementsByTagName(s)[0], j = d.createElement(s);
j.async = true; j.src = 'https://chat.mydomain.com/livechat/rocketchat-livechat.min.js?_=201901010000';
h.parentNode.insertBefore(j, h);
})(window, document, 'script', 'https://chat.mydomain.com/livechat');
</script>
</body>
</html>
It MUST go right at the end. Don’t trust WP to do that. Mine is manually inserted in a file.
You might also want to look at the communications between WP and Rocket - you might be able to see each one remotely - but they may not be able to see each other.
I have now turned the Internet upside down. Unfortunately, I haven’t come to any results with your suggestions either. Additional scripts are not implemented and the uploaded favicon is also not displayed in popup mode.
What I have noticed in the inspector is that the favicons are loaded correctly from the /assets folder in the Rocketchat workspace. In the livechat widget in popup mode, the favicon.ico is loaded from the base directory of the URL/domain.
Here is the workspace:
Here is the live widget in popup mode:
I believe at this point that a change of this favicon is not intended by RocketChat.
