Back to limesurvey.org

Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Slider: Increase text width

More
3 years 1 week ago #231346 by gorp
Slider: Increase text width was created by gorp
Please help us help you and fill where relevant:
Your LimeSurvey version: Version 5.3.30+220808
Own server or LimeSurvey hosting: Own server
Survey theme/template: Fruity Theme ( fruity)
==================

I have a Multiple numeric input question with slider option. Each side of the slider have text-answers. I am trying to increase the width for how that text is displayed. 

I have tried the Text input box width setting under Display (but nothing happens). 

(I have managed to left align the text. The separator that I use i | ) 

Any help is much appreciated. 
Thanks in advance. 
 

Please Log in to join the conversation.

More
2 years 11 months ago - 2 years 11 months ago #231975 by Pascal_RU
Replied by Pascal_RU on topic Slider: Increase text width
I would like to push this thread as I have the same problem (see picture below). I would like to broaden the space for texts left and right to the slider, which, I assume, can be achieved by reducing the width of the actual slider (the horizontal bar). I haven't found any options in LimeSurvey to do so, so I guess I will have to change or add something in the custom.css or theme.css or so.

I'd greatly appreciate any tips, hints or solutions! Thank you in advance. :-)

Best,
Pascal

I'm using Version 3.7.2+180508, in case that's relevant/helpful.

Edit:
I found part of the answer. You can add the width of the slider to your .slider-container in your custom.css file (see the theme-editor). It makes the slider-bar smaller. However, the text boxes aren't getting any wider for some reason. I guess their widths are not linked to the width of the slider-bar. So... Now I have to figure out how to increase their width above the 100% which are possible in LimeSurvey.

.slider-container {
margin-bottom: 0.5em;
margin-top: 0.5em;
  overflow: hidden;
  width: 10%;
}


 
Last edit: 2 years 11 months ago by Pascal_RU.

Please Log in to join the conversation.

More
2 years 11 months ago #231979 by tammo
Replied by tammo on topic Slider: Increase text width
I would rephrase the question, as it is a scale between internal and external factors.

So the scale itself could be from external to internal, all other text could be placed in the question itself or in help text.
Tammo ter Hark at Respondage
For Limesurvey reporting, education and customized themes
respondage.nl

Please Log in to join the conversation.

More
2 years 11 months ago #231991 by tpartner
Replied by tpartner on topic Slider: Increase text width
The element widths are controlled with Bootstrap classes .

Adding this script to the question source will equalize the widths of the left/right text and slider wrapper.

Code:
<script type="text/javascript" data-author="Tony Partner">
  $(document).on('ready pjax:scriptcomplete',function(){
 
    var thisQuestion = $('#question{QID}')
 
    // Modify some Bootstrap classes
    $('.slider-left.col-sm-2, .slider-right.col-sm-2', thisQuestion).removeClass('col-sm-2').addClass('col-sm-4');
    $('.slider-container', thisQuestion).removeClass('col-sm-8').addClass('col-sm-4');
  });
</script>



Sample survey attached: 

File Attachment:

File Name: limesurvey...3293.lss
File Size:18.45 KB


Alternatively, you could add that JavaScript to your custom.js file or modify the core custom question theme.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
2 years 11 months ago #231996 by Pascal_RU
Replied by Pascal_RU on topic Slider: Increase text width
Thank you very much tammo and tpartner for your comments! I ended up with a solution I am quite happy with, i.e. your script tpartner combined with setting the Label Column Width on "hidden" in the "display" option menu of the question. Now, there are only three columns which indeed are of equal width.
Thanks!

Please Log in to join the conversation.

Moderators: tpartner, holch

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans
Get started

Legal

About Us

Open Source