{"id":358,"date":"2016-05-18T09:00:32","date_gmt":"2016-05-18T04:00:32","guid":{"rendered":"https:\/\/learnsf.wordpress.com\/?p=358"},"modified":"2023-12-30T17:09:32","modified_gmt":"2023-12-30T23:09:32","slug":"formatting-long-text-fields-in-reports-and-page-layouts","status":"publish","type":"post","link":"https:\/\/blog.felineflock.com\/index.php\/2016\/05\/18\/formatting-long-text-fields-in-reports-and-page-layouts\/","title":{"rendered":"Revolutionize Your Reports and Page Layouts with SVG:  an innovative field format"},"content":{"rendered":"<p>If you add a long text field to a report, you may end up with something undesirable\u00a0like the image below: \u00a0a field of plain text squeezed and stripped of any formatting.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone  wp-image-361\" src=\"http:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-10-36-35-pm.png\" alt=\"Screen Shot 2016-05-17 at 10.36.35 PM.png\" width=\"536\" height=\"712\" srcset=\"https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-10-36-35-pm.png 822w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-10-36-35-pm-226x300.png 226w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-10-36-35-pm-771x1024.png 771w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-10-36-35-pm-768x1020.png 768w\" sizes=\"auto, (max-width: 536px) 100vw, 536px\" \/><\/p>\n<p>The &#8220;normal&#8221; way of fixing that would be to create a plain text field and use a workflow to copy the first 255 characters of the long text field to it &#8211; that is, truncating the long text field.<\/p>\n<p>This article shows another\u00a0way of overcoming\u00a0that limitation and making long text fields display with a fixed size and word wrap and in color without truncation.<\/p>\n<p>In the <a href=\"https:\/\/learnsf.wordpress.com\/2016\/05\/17\/custom-formats-in-reports-and-page-layouts\/\">previous article<\/a> it was shown how to display formatted text using a VisualForce page that accepted parameters and converted text to a SVG image.<br \/>\nNow that idea\u00a0will be expanded: \u00a0\u00a0create a page that will accept any field from any object and generate an image after applying word wrap and color to its text value. The result is below:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-377\" src=\"http:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-00-43-pm.png\" alt=\"Screen Shot 2016-05-17 at 11.00.43 PM.png\" width=\"1204\" height=\"812\" srcset=\"https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-00-43-pm.png 1204w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-00-43-pm-300x202.png 300w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-00-43-pm-1024x691.png 1024w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-00-43-pm-768x518.png 768w\" sizes=\"auto, (max-width: 1204px) 100vw, 1204px\" \/><\/p>\n<p>Much nicer!<\/p>\n<p>Here is how it was done: \u00a0an IMAGE formula field (below) that sends parameters to a VisualForce page which\u00a0returns a SVG image.<\/p>\n<blockquote><p>IMAGE( &#8216;\/apex\/FieldToImage?wrap=60&amp;color=&#8217;<br \/>\n+ IF( CONTAINS( &#8216;Energy|Construction|Transportation|Shipping|Utilities|Manufacturing|Agriculture&#8217;, TEXT( Industry ) ), &#8216;red&#8217;, &#8216;green&#8217; )<br \/>\n+ &#8216;&amp;object=Account&amp;fieldName=description&amp;id=&#8217; + Id, &#8216;Color Description&#8217; )<\/p><\/blockquote>\n<p>Please notice the following parameters passed to the FieldToImage VisualForce page:<\/p>\n<ol>\n<li><strong>wrap=60<\/strong> &#8211; this limits each line to 60 characters<\/li>\n<li><strong>color= red or green<\/strong>, depending on the Account Industry &#8211; self-explanatory<\/li>\n<li><strong>object=Account<\/strong> &#8211; this tells the page controller to retrieve data from the Account<\/li>\n<li><strong>fieldName=description<\/strong> &#8211; this tells the page controller to retrieve data from the Account.Description field<\/li>\n<li><strong>id= the Account ID<\/strong> &#8211; self-explanatory<\/li>\n<\/ol>\n<p>Instead of passing the text directly to the page, we passed the names of the object and field because formulas\u00a0cannot reference\u00a0long text fields directly (by the way, <a href=\"https:\/\/success.salesforce.com\/ideaView?id=08730000000BrhEAAS\">this idea<\/a> needs more upvotes).<\/p>\n<p>The code that implements the page and controller is here (GitHub links):<\/p>\n<ol>\n<li><a href=\"https:\/\/github.com\/Fernando-Fernandez\/SVG-Images-For-Salesforce\/blob\/master\/FieldToImageController.cls\">FieldToImageController.cls<\/a><\/li>\n<li><a href=\"https:\/\/github.com\/Fernando-Fernandez\/SVG-Images-For-Salesforce\/blob\/master\/FieldToImage.page\">FieldToImage.page<\/a><\/li>\n<\/ol>\n<p>The Apex controller uses the parameters &#8220;object&#8221;, &#8220;fieldName&#8221; and &#8220;id&#8221; to create a dynamic SOQL query. It then fetches the text from the object and substitutes\u00a0a couple of special characters in order to not break the SVG syntax.<\/p>\n<blockquote><p>\/\/ fetch the field and convert to text<br \/>\nList&lt;SObject&gt; objList = Database.query( &#8216;SELECT ID, &#8216; + fieldName<br \/>\n+ &#8216; FROM &#8216; + objectName + &#8216; WHERE ID = \\&#8221; + theID + &#8216;\\&#8217; LIMIT 1&#8242; );<br \/>\nif( objList.size() &lt;= 0 ) {<br \/>\nreturn;<br \/>\n}<br \/>\nString rawText = String.valueOf( objList[ 0 ].get( fieldName ) );<br \/>\nif( rawText == null ) {<br \/>\nreturn;<br \/>\n}<br \/>\nrawText = rawText.replace( &#8216;&lt;&#8216;, &#8216;&amp;lt;&#8217; ).replace( &#8216;&amp;&#8217;, &#8216;&amp;amp;&#8217; );<\/p><\/blockquote>\n<p>This idea can be expanded to make the VisualForce page return\u00a0and display long text\u00a0from related records\u00a0or combined with parent records.<br \/>\nThis is\u00a0something that is not possible to do with just a\u00a0formula since long text fields cannot be referenced\u00a0in formulas and there are limited ways of accessing children records in the context of a page layout or report.<\/p>\n<p>The next article will show a way to create dynamic\u00a0hyperlink buttons &#8211; like the ones below &#8211; to display on page layouts and reports:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-449\" src=\"http:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-48-14-pm.png\" alt=\"Screen Shot 2016-05-17 at 11.48.14 PM\" width=\"1232\" height=\"192\" srcset=\"https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-48-14-pm.png 1232w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-48-14-pm-300x47.png 300w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-48-14-pm-1024x160.png 1024w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-48-14-pm-768x120.png 768w\" sizes=\"auto, (max-width: 1232px) 100vw, 1232px\" \/><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-448\" src=\"http:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-38-52-pm.png\" alt=\"Screen Shot 2016-05-17 at 11.38.52 PM\" width=\"990\" height=\"198\" srcset=\"https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-38-52-pm.png 990w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-38-52-pm-300x60.png 300w, https:\/\/blog.felineflock.com\/wp-content\/uploads\/2016\/05\/screen-shot-2016-05-17-at-11-38-52-pm-768x154.png 768w\" sizes=\"auto, (max-width: 990px) 100vw, 990px\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>If you add a long text field to a report, you may end up with something undesirable\u00a0like the image below: \u00a0a field of plain text squeezed and stripped of any formatting. The &#8220;normal&#8221; way of fixing that would be to create a plain text field and use a workflow to copy the first 255 characters [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":377,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"categories":[11],"tags":[],"class_list":["post-358","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-formula"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/posts\/358","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/comments?post=358"}],"version-history":[{"count":7,"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/posts\/358\/revisions"}],"predecessor-version":[{"id":554,"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/posts\/358\/revisions\/554"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/media\/377"}],"wp:attachment":[{"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/media?parent=358"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/categories?post=358"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.felineflock.com\/index.php\/wp-json\/wp\/v2\/tags?post=358"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}