UPDATES: You can easily design your tour flow with Tour templates! 



In the following article, we will explain how to add a user picture to a modal manually as shown below:



  1. Add this code to the top of your modal (using the editor of the modal)


<p class="text-center"><span style="font-size: 18pt;"><strong><img style="margin-left: 25px; position: relative; top: -130px; border-radius: 50px; margin-bottom: -150px;" src="{PICTURE_PATH_HERE}" alt="" width="100" height="100" /><br />waving hand Hello there!<br /><br /></strong> </span></p>


  1. Create a new theme with this custom CSS:

.#{$classNamePrefix}-modal {

overflow-x: visible !important; 

overflow-y: visible !important; 

top: 100px}


  1. Assign the theme to the tour. Edit the step content accordingly. Done!