Announcements
Events
Groups
Ideas

XM Community
Developer Corner
Custom Code

Custom Code

Discuss custom code (HTML, CSS, JavaScript, etc.) solutions, best practices, & more.

7,199 Topics
22,580 Replies

When you subscribe we will email you when there is a new topic in this category

7199 Topics

Recently active

Most replies Most views Newest first

flebLevel 3 ●●●

asked in Custom Code

How to change design of the dropdown list?

Hallo, I'd like to change the basic background color and the background color on mouseover of the dropdown (multiple choice question). I tried to guess which line form this style-sheet could change it, but I was wrong. (I tried this one: `.JFEScope .Skin .q-matrix .dropdown-arrow .dropdown-down {background-color: #F3E0BD;}`) I also found this code: `.Skin .MC .ChoiceStructure .Selection {background-color: #F3E0BD;}` which should change the basic background color here but it doesn't work. Thank you for any help

I would like to create an inventory tracking form. I wanted to make use of Quotas to track the total number of items when they are returned/loaned. Is there any way to decrease the quota?

5 years ago

RonavdDussen

asked in Custom Code

How can you enforce a participant to watch a youtube video till it ends?

In our survey we want to show a short youtube clip that has to be watched till the end. Is it possible to remove the 'continue' button while the video isn't played yet or is still playing? (for example with Java script) Also, is it possible to remove related video's, the title and other things distracting the attention from the video? Thanks in advance

5 years ago

Ran

asked in Custom Code

Advertisement - Time Measurement

Hi I am doing a research looking at the time it takes to a person to skip an advertisement. There are two things that are important to me: 1. Finding how much time was spent on watching the video (a video I created). 2. Adding a "Skip Button" that will appear at the 5th second of the video. I'd really appreciate your answer and guidance. I hope I was managed to be clear regarding my need. Thanks in advance, Ran

5 years ago

Gail

asked in Custom Code

Is it possible to have a graduated bar for slider type questions?

Is it possible to have a graduated bar for slider type questions? Currently a solid color, a gradation from light to dark might be more appropriate. Is there code that can be added to accomplish this?

5 years ago

GabrielRibeiro

asked in Custom Code

Change fixed numerical labels on a multiple choice NPS question

Hey guys! Right now I have a multiple choice question option (NPS), that is locked for values from 0 to 10. I want to change those values to be displayed from -5 to 5. What would be the proper way to code this? Also, I have tried adding static, unclickable labels to the extremes of a multiple choice question, but was unsuccessful. Could you guys help? This is the question format which I want to change from 0 to 10 to -5 to 5: ! Thanks!

5 years ago

uhrxx005Level 3 ●●●

asked in Custom Code

Custom CSS to set survey background to hex value

Can anyone help me with this? I have seen similar posts about changing the background color, but that is not quite what I am looking for. I want to change both the background color and the background color that each question sits on top of. So ideally, when the survey is accessed, everything will be the same color except for the text and answer choices. Any help would be greatly appreciated. Thank you!

5 years ago

Christoph

asked in Custom Code

Slider and Math operations question

5 years ago

flebLevel 3 ●●●

asked in Custom Code

CSS classes for questions/apply CSS style to some questions only

Hello, I want to change padding using following CSS code. However, I want to apply it to some questions only. Is there some way how to define a CSS class for questions in Qualtrics or to change CSS style in some question only using its ID or something like that? Thank you very much for any ideas in advance. .Skin .Separator { margin:0px 20px; } .Skin .QuestionText { font-size: 100%; padding: 2px; } .Skin .QuestionBody { padding:0px 1px 0px 1px; } .Skin .MC .MAHR .QuestionBody table td span.LabelWrapper label, .Skin .MC .SAHR .QuestionBody table td span.LabelWrapper label { padding-bottom: 5px !important; }

5 years ago

shphill

asked in Custom Code

Statement Text Formatting - Preview looks different

For the following text + html code, the statement formats exactly like I want it in edit mode ... with four sub bullets under a header: SWOT Analysis - Description (mouse over) - Click for more info (link) - Key considerations for Industry 4.0 - Scoring Guidance However, when I preview it, I lose the bullets and line breaks ------------------------ 1) SWOT Analysis  <ul> <li style="text-align: left;"><span style=";color:red;cursor:pointer" title="A SWOT Assessment identifies internal Strengths & Weaknesses as well as external Opportunities & Threats for an organization. It provides the foundational information needed to develop winning strategies. ">Description</span></li> <li style="text-align: left;"><a href="https://en.wikipedia.org/wiki/SWOT_analysis" target="_blank">Click for more info</a></li> <li style="text-align: left;"><span style=";color:red;cursor:pointer" title="Key considerations for Industry

5 years ago

StephanieB

asked in Custom Code

Embedded video stops before it should

Hi everyone, I embedded a video from Youtube in my survey. The video has a duration of 2.08 minutes but when i run the survey myself (with the anonymous link), the video stops before the end (roughly at 1.55) and opens directly the next page of questions. Is there a time-limit on the videos? What could I be doing wrong? Many thanks in avance !!

5 years ago

univa2018

asked in Custom Code

Modal window with reference to previous answers

Hi everybody :) , I'm trying to create a modal window alerting people to control their answers, before going on. To be precise, my survey questions are (more or less) like these: 1. How many apples did you buy yesterday? (this is a text entry type of question - single line - with options: force responce and custom validation (value greater or equal than 0)) 2. (this question is displayed only if the answer to the previous question is greater than 0) About those apples, did/will you: - make a cake (number of apples) - store them (number of apples) (This is a side by side question type - with options (custom validation - all entries are Not empty and column options: numerical value) I would like that when a person answers to question 2 and pushes on "next botton", a modal window opens saying something like: "Please, before passing to next question, verify that the sum of apples is equal to ANSWER TO question 1." So the message will be customized for every respondent. My probl

5 years ago

yangye0312

asked in Custom Code

Error message when saving JS code (updated)

New here. Our JS code (for a customized audio player) worked very well until a few days ago when a problem occured. The problem is every time I open the JS dialogue for an item and then try to save the JS script even without any editing, I got this error message: "Invalid JavaScript! You cannot save until you fix all errors: Unexpected reserved word" The funny thing is, the item with the script still runs properly on Qualtrics survey, which means it might not be "Invalid JavaScript" afterall (I guess). But right now I am not able to change anything in the script (without finding out what the real bug is, that is). Please help. * Code included in comment* * Code included in comment* *Question updated, error replicated with minimal code*

5 years ago

Christoph

posted in Custom Code

Complex scoring of a form and sharing it with the user - example

I wanted to score the SF-36, a popular general physical and mental health questionnaire and share the results with the client. I needed to solve two main issues: How to do the scoring and how to do the workflow so that there would be the least amount of disruption and a user would receive a pdf with all 10 scores listed (8 primary and 2 summary scores). The scoring was done by javascript as I couldn"t see how Math alone could do the job. The scoring feature didn"t work as it only shares one score in the end, even though you can calculate at least the 8 primary scales (I didn"t check whether the 2 summary scores could be done). The latter was achieved by using a timing question, in a block of its own at the end, which runs the javascript on load and moves to the next question after 1 second with the text "Calculating scores ...". In the next block was a text paragraph giving the scores and by clicking on "next", the user received a pdf with the scores at the end. Here is the javascr

5 years ago

Tom_R

asked in Custom Code

Copying embedded variables from one survey to another - edit .qsf file?

Hi. I have what amounts to about an hour or so of tediously typing about 150 embedded variables into a survey. (basically to take question responses and put them into universal variables that are easily parsed by our analytics software). Has anyone created some sort of editor to do this on a .qsf file? I could figure out how to do a cut/paste, but need to make sure it's error free : -) Or a guide to a .qsf file structure would be helpful. Thanks!

5 years ago

Shane78

asked in Custom Code

Disabling the next arrow on every question except the first consent prompt?

Hello, I am trying to disable the next arrow for every question on my survey, except for the first prompt which is consent to research. I followed the directions in a community post and did Look and Feel > Advanced > Custom CSS and then entered code: PreviousButton, NextButton{ display: none; } This code removes all the next arrows, but then I don't have a way to submit an answer for my first prompt, the only one I need an arrow for. Does anyone know a way around this?

5 years ago

Warby

asked in Custom Code

EASY question (Im sure) but I'm struggling - adding numbers to scale labels

Hi All, I have a matrix question, and I would like to add numbers to the scale labels. I have rather elegantly demonstrated this in the picture. I have seen someone add a tiny piece of code to do this but have since lost the info. Grateful for your help, thanks in advance !

5 years ago

cpkelley5

asked in Custom Code

Pull top 5 responses from constant sum

In my current survey, I have a constant sum question with 20+ answer options. I am asking respondents to input the percentage of time (0 - 100) they spend across 20+ daily activities. I want to then ask a number of follow-up questions regarding the activities that they spend most of their time on. The current options with qualtrics allow me to carry forward answers that are greater than a certain amount from that constant sum question. Although this is a potential solution, it does not solve my problem perfectly (think of selecting 10% as my greater than amount and having individuals allocate all their time on single digit % increments, etc.). Most of my follow-up questions will be matrix tables. Is there any way to pull forward the top 5 answers from a prior constant sum based on the inputted values from the respondent? Thanks ahead of time for the help!

5 years ago

jaegtiz

asked in Custom Code

Slider questions customisation

Hi all For a questionnaire I have different blocks with slider questions. In one block, I need the handle to appear only when people click on the track. This issue is already resolved: in the look and feel section the css code is: .handle{ visibility:hidden; } and I added some javascript in the question part to make it appear again: var q = jQuery("#"+this.questionId); q.find(".track").on("click", function() { jQuery(this).find(".handle").css('visibility', 'visible'); }); The problem that I have now is that in another block I need the the handle to be visible when the questions appears. I tried to reverse the css code and added to the javascript: var styles = { //.handle handleClass: { visibility: "visible" } } Unfortunately, this didn't work. As I am not really a coder, my coding knowledge is quite limited. Does someone have a better idea how to resolve my problem? Thanks in advance!

5 years ago

GradStudent4

asked in Custom Code

A way to change the position of the labels in a slider question?

Hello! Is there a way to change the position of the labels in a slider question? I would like to change the labels to appear below the actual slider instead of the default way which is above the slider.

5 years ago

Madiha

asked in Custom Code

Custom button not working as intended

I have created a custom button using following code: <button id="service5">Add another service</button> Whenever user clicks the button a text-box show up. I did that using JavaScript Problem is even if user click outside of the button, inside the area shown in the picture, for some reason button gets clicked and the text box appears. I do not understand what I am doing wrong. I am new in qualtrics and would really appreciate your help. I have also attached the .qsf file here. !

5 years ago

DPl

asked in Custom Code

What are the classes and ID's available to change with CSS?

Since we are not directly marking up the survey with html, I have no idea what classes and ID's Qualtrics is using for elements in the Look and Feel page. Thanks

5 years ago

rakesh_dayalan

asked in Custom Code

Need a Code to Modify the padding for - Question Body

Hi Team, I have been going through the forum and so far it has been very useful. I am in need of code to reduce the padding for the question Body. I am using the below code in the Custom CSS Code, however in the preview of the survey this doesnt come into effect. .Skin .QuestionText { padding-left: 1px; padding-top: 1px; padding-right: 1px; padding-bottom: 10px; } The above code for Question Text is working. However for Question body the padding remains the same it is at 30px 20px 30px. I want it to be updated as per below. .Skin .QuestionBody { padding: 1px 1px 5px; } ! Would anyone be able to help? Thank you!

5 years ago

CameronBudd

asked in Custom Code

Sizing my drop down Menu

So i am having some issues with a dropdown menu i have. Essentially what is happening is the menu is not sized correctly to fit the choices. This only started happening when i started using Select2. Select2 seems to work fine in other drop downs I have. Is there a way for me to hard code the width of the drop down in? ! Thank you! Cameron

5 years ago

shayla

asked in Custom Code

customizable slider question

Hello! I would like to insert a slider question, but i would like it as a distribution graph. So the participant can respond to the question by sliding a distribution graph. I would like one that looks similar to the one on this website, where the red one can be slid but the black one stays in place. Just two normal distributions with no numbers. https://www.desmos.com/calculator/h2xsfakrik If anyone could help me figure out how to do this, that would be amazing. I talked with qualtrics support and they mentioned I would probably have to use JavaScript, but I know nothing about JavaScript so I am reaching out here. Thank you

5 years ago

Page 271 / 288

Motivational Playlist

Terms & Conditions

Sign up

Already have an account? Login

Social Login

Login to the community

Social Login

Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.

Enter your e-mail address

Back to overview

Scanning file for viruses.

Sorry, we're still checking this file's contents to make sure it's safe to download. Please try again in a few minutes.

This file cannot be downloaded

Sorry, our virus scanner detected that this file isn't safe to download.