Customize end-user portal - Show service items as one column without truncation of title and description

  • 5 October 2021
  • 2 replies
  • 184 views

Userlevel 1
Badge

Hello All,

 

I recently came across a use-case where a customer wanted to display their service items in the service catalog as a single column without the title and description of the service items being truncated.

Before and after images are attached to this post.

 

 

 

 

The code snippets are given below:

 
STYLESHEET:

 

Paste the below snippet in Admin → Helpdesk rebranding → Portal customization → Stylesheet.

#catalog-list-page #catalog-list-container #catalog-list-items #list-items .catalog-item{

min-width: 900px;

}

 
JQUERY:

 

Paste the below snippet in Page Layout

<script>

jQuery(document).on('PageUpdate NewContent', function() {

jQuery('#list-items').children('a').each(function () {

var itemInfo = jQuery(this).children('div.catalog-item-info'); // "this" is the current element in the loop

var shortTitle = jQuery(itemInfo).children('h4');

var shortDesc = jQuery(itemInfo).children('p');

var itemFullInfo = jQuery(this).children('div.service-item-tooltip'); // "this" is the current element in the loop

var longTitle = jQuery(itemFullInfo).children('h3');

var longDesc = jQuery(itemFullInfo).children('p');

shortTitle.text(longTitle.text());

shortDesc.text(longDesc.text());

});

});

</script>

 

Thanks!


2 replies

Badge

Hi,

Would you be able to provide more information as to where in the Page Layout the script should be pasted? I have tried it to no avail.

Thanks,

Sam

 

EDIT: I figured out my mistake. I mistakenly did not save after updating the stylesheet, which then didn’t allow the script to run successfully. Thank you. 

Userlevel 1
Badge

Hi,

Would you be able to provide more information as to where in the Page Layout the script should be pasted? I have tried it to no avail.

Thanks,

Sam

 

Hi Sam,

Can you go to Admin → Helpdesk rebranding → Portal customization → Layout & pages → Portal layout → Page layout and paste the script at the end and check if this helps?

If not, please send an email to support@freshservice.com and we can get this checked. 

Thank you!

Reply