Adding JS links to body section | XM Community
Question

Adding JS links to body section

  • 18 July 2019
  • 4 replies
  • 34 views
Jtalbot
Hi everyone,

I am trying to add the emoji picker to an open text field.

The instructions say:

1. In your <head> section, add the following stylesheet links. Adjust the lib/css path to match yours.
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet">
<link href="lib/css/emoji.css" rel="stylesheet">

2. Before the end of your <body> section, add the following JavaScript links. This library depends on jQuery, so jQuery must also be included, before these scripts are run. Once again, adjust the lib/js path to match yours.

<!-- Don't forget to Add jQuery here -->
<script src="lib/js/config.js"></script>
<script src="lib/js/util.js"></script>
<script src="lib/js/jquery.emojiarea.js"></script>
<script src="lib/js/emoji-picker.js"></script>

3. On any input field, add the data attribute data-emojiable="true".

I can add the stylesheet links through the customisable header - I added it to the custom css section, is that correct?

However, I am then struggling to add the Java Script links to the body section. I tried putting it into the custom header but that didn't work.

Also, how do I add the data attribute into the JS field of the actual question field? Which values do I have to use?

Apologies for the many questions, I am an absolute newbie to code.

Thanks so much in advance for your help!

Best
Johanna

4 replies

JenCX
Rank
Userlevel 7
Badge +11
I think you may actually be looking for this instead: Javascript Editor
Jtalbot
Hi JenCX,

Thanks so much for your reply.

I know I have to add a component into the Editor in the question as well, but I don't know where to put the part that belongs to the <body> section?
here are the instructions :
https://github.com/OneSignal/emoji-picker

What's worse, the commands from the instructions differ to the ones used here in qualtrics I believe... E.g. <> is not accepted.

Do you know how to "translate" this?

Thanks so much

Johanna
JenCX
Rank
Userlevel 7
Badge +11
Ah, I see what you're trying to do. I misunderstood your original question. Looks like you need to include jQuery. I don't know much about this so it's basically the blind leading the blind until we get some our JS geniuses to answer, but I did find this which might be helpful to you: How to add jQuery
M
Badge +1

https://community.qualtrics.com/XMcommunity/discussion/comment/15966#Comment_15966HiJtalbot ! I´m Manuel from Argentina.
I am trying to do the same.
Could you solve the problem? Any idea to you help me.
Thanks!

Leave a Reply


Terms & Conditions