HelpSpot Help Desk Software | HelpSpot Blog | HelpSpot Support

Remove additional line breaks between custom fields in admin request window - here is how!


#1

When there are many custom fields the list on the right side of the screen becomes rather long: after each custom field HelpSpot inserts 2 line breaks. According to the friendly people of HelpSpot this cannot be changed, but I have found a way nevertheless. :wink:

Here is how:

  1. Open the default.css file in any texteditor (this file is located in the Helpspot root folder).
  2. Scroll down to the bottom of this file and add the following for each Custom# field:

/* Re-adds a little space before each Custom field */
#Custom1_wrapper {
margin-top: 0.33em;
}

/* Removes all line breaks within the Custom field section */
#Custom1_wrapper br {
display: none;
}

/* Moves any inputbox, textbox of dropdown list below the Custom field name */
#Custom1_wrapper input,
#Custom1_wrapper textarea,
#Custom1_wrapper select {
display: block;
}

  1. To make HelpSpot reload the default.css file you must clear the HelpSpot internal cache by opening the http://yoursite.com/admin.php?clearcache page

  2. If you do not see any changes in your browser: clear your browser’s cache and/or restart your web browser first, and try again.

–Ronald


#2

Very tricky!! Have to say I never tried using display none on a BR so it never crossed my mind. Very nice hack!


#3

v3 allows much more control on the design of the staff area. I’ll check if there’s a specific class on these though (or at least a easy way to select via css)


#4

Thanks, Ian!

I have taken this a little further. By (ab)using some dummy custom fields I have been able to display some custom fields inside table cells. This allowed me to display 2 custom fields next to each other. I needed the dummy fields to ‘insert’ a new table-row (Customfield #45 is a dummy custom field):

#Custom45_wrapper {
margin-top: 0.33em;
display: table-row;
}

#Custom45_wrapper br {
display: none;
}

#Custom45_wrapper input,
#Custom45_wrapper textarea,
#Custom45_wrapper select,
#Custom45_wrapper label
{
display: none;
}

This only works in Firefox (no problem for us), and the dummy custom fields show up in more places of course. But I really like the new layout (screenshot): http://professionalplanner.nl/images/customfieldslayout.PNG

It would be great if we could achieve something like this in version 3.0 without needing any hacks like these! :wink:


#5

That’s just down right tricky!

We’ll take a look. Creating a complex layout manager like that probably wouldn’t be in 3.0 but it’s something we’ll keep in mind for sure.