We have created a Likert scale question with multiple rows but want the question part of the row to take up more space. The question currently takes up the same space as the Agree, Neutral, Disagree columns but the questions are much longer so we want the question to have a larger proportion of the space across the screen
Can anyone help with this please?
Regards
Tony E.
Can you share a link to the page on your site where we can see the form?
Hi Chris, and thanks for the reply.
This is the beginnings of a form with such a question in.
https://profiler.advanced-workplace.com/formpage/2020-survey/#gf_27
On the 2nd page you will see a Likert scale question, with days of the week as the options.
The Days of the week headings are nice and big and bold and the actual questions are squashed in to 1/8th of the width as each column is being given equal width.
Regards
Tony E
You can add this CSS to your theme (or child theme) stylesheet or via the Appearance Customizer (Appearance > Customize > Additional CSS):
th.gsurvey-likert-row-label:first-of-type {
width: 33%!important;
}
It looks like this when applied to your form: https://d.pr/i/VR1oQ9 You can change the 33% to whatever you like. Let me know if you need anything else.
That is great Chris. Thanks very much for your help. I will give it a try now. Thanks again.
Tony E.
1 Like
Let us know if you still need assistance. I’ll leave this topic open in case you want to update it with your results or additional questions.
Hi Chris
Everything worked great thank you.
I was hoping I could use the Likert question values with calculations and even potentially with conditional routing but that does not seem to be possible.
Thanks for your help
Regards
Tony E.
Most of the Survey questions are not supported in conditional logic. We do have that on our list of open feature requests, and I will add a comment for you there.
Hi Chris, thanks so much for this!
I have now increased the spacing…
What CSS would I have to enter to align the text to the left rather than the centre?
Many thanks,
Jimi
Hi Jimi. Do you mean the column headings, here (in the red box)? Annotation on 2021-02-02 at 18-00-58.png • Droplr
If so, you can use this CSS to align that text to the left:
body .gform_wrapper table.gsurvey-likert th.gsurvey-likert-choice-label {
text-align: left;
}
It looks like this when applied: firefox RtQqnc7zTI.png • Droplr
You can add this CSS to your theme (or child theme) stylesheet or via the Appearance Customizer (Appearance > Customize > Additional CSS).
I rather prefer the centre alignment, but if you want to change it, this is the CSS to do it.
Hi Chris, thanks for this!
Although I was talking about the row headings - see below for the table I’m talking about.
If there is a way of using CSS to align those to left instead that would be great.
I agree, the column headings definitely need to stay centrally aligned!
Jimi
if there’s also the option to remove the underline in the text… once I go to the page my form is on all the row headers are underlined (see attachment)
is there CSS that can also remove those?
Thanks again for your help Chris!
Jimi
Hi Jimi. On which page of the form can I see that field? Also, are there specific choices I need to make in the form to see that field? I made some choices and skipped from step 2 to 10 I believe. If you can tell me how to get that field to display, I can help you with the CSS. The Likert field on page 2 already has left-aligned row headings, but maybe another field is treated differently. Thank you.
Hi Chris, it is on Page 4 of my survey with no conditional logic. There are 8 identical likert style questions on page 4, all of which look exactly the same as the above. I just need the row labels to be left-aligned and if the underline could be removed that would be great. Thank you!
It’s now on Page 3 if that makes any difference 
I must be doing something different from when you are testing, because I keep skipping from page 2 to page 10:
Can you let me know what choices to make in the first couple of pages, so I can see page 3 or 4? Thank you.
Hi Jimi. I was definitely looking at the wrong site. For your site, there are two issues.
- You have some unclosed
<u>tags for the question labels, like this one:
firefox OJzSJ8Xr4G.png • Droplr
That is making lots of stuff underlined. Close the tag with </u>, rather than another open tag like you have, and that will fix the underlines.
- For the text alignment, you can add this CSS to your theme (or child theme) stylesheet or via the Appearance Customizer (Appearance > Customize > Additional CSS):
body .gform_wrapper td.gsurvey-likert-row-label {
text-align: left;
padding-left: 10px;
}
That should take care of both items. Let me know how it goes.
HI Chris, you’re an absolute Wizard! that’s amazing - all sorted now
I was wondering whether you knew whether it was possible to change the values associated with the likert style questions. When I pull them through to Power Flow the values are exported like so:
glikertrowdb1ee34e:glikertcol584dfb2355
The above text occurs when I choose option 1 in my first likert table… and the same sort of value occurs for each likert column.
Is it possible to change the way the likert questions are exported?
I want the likert columns to be exported as their true values… i.e. when I select ‘1’ that same value pulls through on the other side, rather than the ‘glikertrow…:glikertcol…’
I started to read this but it’s hard to follow and put into practice:
gform_export_field_value - Gravity Forms Documentation
If you could help me at all that would be greatly appreciated!
Hi Jimi. How are you sending your data to Power Flow? Is that with custom code, or Zapier, or our Webhooks add-on?
If you test exporting entries for a Survey-likert field you’ll find that the unique values are replaced with the choice/row labels configured on field. If that isn’t working for you, then you most likely have a conflict with another plugin or code in the theme on your site. If you share with us the code you are using, we can go from there. Thank you.
1 Like