How to change Avatar dynamically (Landbot v3)

Pau Sanchez Updated by Pau Sanchez

If you want to change the Avatar due to any conversation design reason, you can do it easily with this snippet:

/*CHANGE THE URL BELOW FOR THE ONE OF YOUR DESIRED NEW AVATAR*/
var picUrl = "https://upload.wikimedia.org/wikipedia/commons/6/6e/Mona_Lisa_bw_square.jpeg"

/*DO NOT EDIT BELOW THIS LINE*/
var avatares = this.document.querySelectorAll(".Avatar:not(.avatarOriginal)")
window.cssRuleApplied;
if(window.cssRuleApplied != true){
	for (var i=0; i< avatares.length; i++){
		avatares[i].classList.add('avatarOriginal');
		window.cssRuleApplied = true
	}
}
var cssRule = `.Avatar:not(.avatarOriginal) {content: url(${picUrl})!important;}`
this.document.styleSheets[0].insertRule(cssRule);
/*DO NOT EDIT ABOVE THIS LINE*/

Add it in a Code block in the step where you want the Avatar to change:

To set your own Avatar, only change the url in the second line where is "var picUrl"

Bear in mind that this change can only be applied once

How did we do?

Javascript in WhatsApp

Contact