Vertical heading for side-by-side question option | XM Community
Solved

Vertical heading for side-by-side question option

  • 3 August 2018
  • 8 replies
  • 398 views
E
Badge +2
Hi,

I am hoping to integrate a vertical heading in the Likert scale within the side-by-side question. I am informed that I would be required to use a JavaScript code and wondering whether anyone would be able to help me out with this.

Thank you!
icon

Best answer by TomG 4 August 2018, 20:19

View original

8 replies

A
Hello @Estha ,

From what I have understood is that you need a text at circled part!

Here is a way you can do it too.
1. Open the survey question in preview mode in the browser and press ctrl+shift+c and keep the mouse pointer at that vertical header part, as shown in the image.!.
Copy the id(highlighted by the arrow) of that element.

2. Open the java script option of side-by-side question and copy following line in onload function:
<strong>document.getElementById('style~header~QID6~7').innerHTML="Your Text";</strong>
!

3. Save the js and preview the question. You will also see the vertical header.
!
E
Badge +2
HI @Shashi,

Thank you for your response! Apologies if I was not clear in my phrasing. I was wondering whether/how I could do a rich text formatting of Answer 1 and Answer 2, as well as rotate them in a 90-degree anti-clockwise direction (as per attached document).

Wonder whether you would know how I can do this in Qualtrics?
1 Attachment
TomG
Rank
Userlevel 7
Badge +27
@Estha,

The doesn't require JavaScript, just CSS:
```
.Skin .SBS .Answers th.SBS1 {
transform: rotate(-90deg);
white-space: nowrap;
vertical-align: middle;
padding:0px;
height:100px;
}
.Skin .SBS .Answers th.SBS2 {
vertical-align: bottom;
}
```
E
Badge +2
@TomG

Thank you; very much appreciated. That works for the first instance of the answer header!
E
Badge +2
Hello!

I encountered another issue, though. I repeat the headers in the middle of my side-by-side question format. Is there any way in which the formatting of the second repeated can follow the first header?

Thank you!
TomG
Rank
Userlevel 7
Badge +27
> @Estha said:
> Hello!
>
> I encountered another issue, though. I repeat the headers in the middle of my side-by-side question format. Is there any way in which the formatting of the second repeated can follow the first header?
>
> Thank you!

Update for repeated headers:
```
.Skin .SBS .Answers th.SBS1, .Skin .SBS .RepeatHeader td.SBS1 {
transform: rotate(-90deg);
white-space: nowrap;
vertical-align: middle;
text-align: left;
padding:0px;
height:100px;
}
.Skin .SBS .Answers th.SBS2, .Skin .SBS .RepeatHeader td.SBS2 {
vertical-align: bottom;
}
```
S
Badge

hello please I need your help 

I couldnt delete recorded surveys which i used just to see whether the survey layout is functional

 

please help me with that

 

Nam Nguyen
Rank
Userlevel 7
Badge +20

hello please I need your help 

I couldnt delete recorded surveys which i used just to see whether the survey layout is functional

 

please help me with that

 

Hi @sihem , you should contact support, they will handle this thing quicker and more proficient. https://www.qualtrics.com/support/

-Nam Nguyen-

Leave a Reply


Terms & Conditions