Custom Side by Side Question with 7 columns | XM Community
Skip to main content
We are trying to create a Custom Side by Side Question with choice options on both sides and question text at the middle but no luck. i.e. we need 7 columns, with three columns of text in the middle and two columns of choices either side. The choice options are to be grouped per row as the user is expected to only choose one option per row.

Attached is the sample screenshot of the question I am trying to achieve. Can someone help please?
Hey @manu0079,



You may use Matrix table question to accomplish this please follow below steps:



Step 1 : Please Create a Matrix question with 7 scale points, refer attached snapshot for reference.

!



Step 2 : Paste the attached code in java script tab in the question



Step 3 : Enjoy the view 🙂 attached is the image how it is looking at my end

!





Please let me know in case of any questions.



Regards,

Samarth
@Samarth



Thanks for the quick response. It really looks very nice. Can you share your project please? I tried the same steps but the formatting is not very nice in my side(please find attached my copy of the project). Please let me know how I can adjust the width of the columns so that it will look nice.



Thanks,

Manu
@manu0079



Theme you are using is different than mine I have a custom theme at my end . Slight update in code is done. Also I have added a css code in theme so that borders are visible.



I will suggest not to increase size of boxes as rendering on mobile while be impacted currently i have not increased the size if you wish I can share the code.



Please let me know in case of any questions!



Regards,

Samarth
@Samarth



Thanks very much for your help. I think this should work for us. I'll let you know if we need to increase the size of the boxes.



Again, thanks very much.



Regards,

Manu
@Samarth



We created the survey but when we create multiple questions within the same survey, it doesn't really work.



The custom text appears to be presented perfectly when I view them by selecting the "preview question" option individually but some or all of the custom text does not appear when I preview the entire survey for Question 2 and Question 3. It works fine for the first question or when there is only one question but doesn't work when more than 1 question exists.



Please find attached sample survey project - please review and go to page 2 or 3 and you'll see the issue.



Can you help please?



Thanks,

Manu
Hi @manu0079,



The funny story is that we have a feature in Qualtrics under Look & Feel section where you can change the page transition and by-default it is set to fade which is the reason for trouble. Please change it to "none" and it should work for you.

!



I can go on and get into technicalities of this but instead I would Key for successfully working with custom codes in Qualtrics is to always keep page transition to none



I can also see that you haven't used new code and custom css as blank answer options visible and borders are missing you may use the code if you wish to, let me know in case of any question

Regards,

Samarth
@Samarth



Thanks very much for the tip. I don't think I would have ever figured out this :)



Regarding the css and new code, the user is happy with this formatting and I have it in one of my test projects anyway in case if we need to go back to it.

Leave a Reply