Master List of Compatible HTML

Forum|Forum|3 years ago
January 3, 2023
5 replies
3795 views

I'm trying to find some master list of compatible HTML/CSS with Workfront reporting. How far can you go? Can you use javascript potentially? I'm going to leave a list of coding I have found and how I use it, if you have anything to add, please leave it below!

HTML:

<a href:"link here">Click Here</a> (Not particularly useful, you can create a functional link tied to a field using other code. This is just possible to do)

<b></b> (Bold)

<i></i> (Italics)

<strong></strong> (Defined Bold)

<em></em> (Defined Italics)

<div style="element: value;"></div> (Container that can be used to add CSS by adding an inline style element)

<font></font> (Can add style elements to font like color, size)

<p></p> (paragraph)

<br> (line break)

<hr> (line break with a visual line)

CSS:

border: value type color;

border-radius: value; (used to round off border corners)

background: color-value;

padding: value; (adds distance between the content within the border)

text-align: value; (left, center, right)

This is all that I have used so far, I haven't experimented with much else yet as I am still learning these languages. I'm hoping this will be useful for those like me who have not learned how to write script yet, but want to take their reports to the next level

lgaertner

Hello Matthew,

such a list is very helpful! I am currently trying around a lot in Workfront and as I learned about text mode in reporting recently, I will check the HTML/CSS/JS(?) capabilities as soon as possible. Hopefully, I will be able to add some useful stuff here within the next days/weeks.

Regards

Lars

lgaertner

Hello Matthew,

can you please provide me with an example on how to work with HTML tags in reporting? How do you add them in textmode on values?

I tried

valueexpression=<strong>{DE:abcBriefingGeneralHeightPerformanceTestLabel}</strong>
valueformat=HTML

But doing that leads to the fact, that the column is blank.

Besides that something like

value= Home Team: 

works.

Thanks in advance.

Regards
Lars

MATTHEW450Author

To use HTML, you can only use it one way, in a value line

displayname=Circle
value=<div style="background: #0000FF; border-radius: 50%; padding: 5px; width: 50px; height: 50px; text-align: center;"><font color=#0F0F0F>Maybe</font><div>
valueformat=HTML
sharecol=true

To apply it to a field, you need to wrap the column in spacing columns with the element opening in the first one and closing in the last one

column.1.displayname=Very Late Rating
column.1.value=<font color=#FF0000>
column.1.valueformat=HTML
column.1.sharecol=true
column.2.displayname=Very Late
column.2.valueexpression=IF(WEEKDAYDIFF({plannedCompletionDate},{actualCompletionDate})>5,"1"," ")
column.2.valueformat=customString
column.2.sharecol=true
column.3.displayname=
column.3.value=</font>
column.3.valueformat=HTML

You cannot use HTML in a valueexpression

MATTHEW450Author

Thanks so much for the reply - I am trying to digest it. The following is a Screenshot of what my current Report looks like using modified Shared Column Text Mode Code, based on your 04-01-2023 reply:

Modified Code (producing the results above):

column.13.displayname=Event Name Final
column.13.sharecol=true
column.13.textmode=true
column.13.value=<div style="text-align: center"><font color=#03a219><b>
column.13.valueformat=HTML
column.14.displayname=
column.14.listdelimiter=
column.14.listmethod=nested(tasks).lists
column.14.sharecol=true
column.14.shortview=true
column.14.textmode=true
column.14.type=iterate
column.14.valueexpression=IF({milestone}.{ID}="63c1c239002cd7d68451d42e0e0445c3",IF(ISBLANK({actualCompletionDate}),CONCAT({plannedCompletionDate}),"DELIVERED"))
column.14.valueformat=HTML
column.15.displayname=
column.15.textmode=true
column.15.value=</b></font><div>
column.15.valueformat=HTML

It seems as though you are stating that my Text Mode Code line, just below, needs to be revised:

column.14.valueexpression=IF({milestone}.{ID}="63c1c239002cd7d68451d42e0e0445c3",IF(ISBLANK({actualCompletionDate}),CONCAT({plannedCompletionDate}),"DELIVERED"))

I would like the Planned Completion Date to display (should there be one), and, when an Actual Completion Date is found, display "DELIVERED", which appears to be happening...questions:

Should I revise the Line of Code for enhanced stability, performance or another more ideal scenario?

If yes, are you able to assist me with the updated "IF" statement?

Thanks again for your time and help.

I would say that your CONCAT({plannedCompletionDate}) is unnecessary, you can just use {plannedCompletionDate}. For the color, you can't format just a single item on the list, it will always format every item on the list. If you are isolating a single task on the list, then you can create two separate lists with IF(ISBLANK logic and format those separately. If there will be multiple items on a list, you can't format different items independently. If tasks will always be the same, you could create a list for each task and format each one independently using CONTAINS and IF(ISBLANK statements

MATTHEW450Author

So far I am not seeing a limitation on CSS as long as it is inline. Just made some shapes and adjustments

CSS:

margin: value;

width: value;

height: value;

margin: value;

display: value;

align-items: value;

Rafal_Bainie

Community Advisor

I used

to properly aling multiple html objects in single cell

MATTHEW450Author

Could you provide an example? Something I could copy and past and see what you mean. Thank you!

Rafal_Bainie

Community Advisor

Sure, so for instance I have cell that looks like that:

aligning these icons in a single row or in 2 separate rows without inline-block was impossible to achieve

Doug_Den_Hoed__AtAppStore

Community Advisor

Thanks @matthew450 (et al): this is an interesting thread.

As it does pertain to both textmode and html in a fairly advanced fashion, I'm tagging @matt-thomas who's leading the New Reporting Experience team for his thoughts / assurance / cautions about how / whether / if these techniques will port to NRE.

Regards,

Doug

Matt-Thomas

Adobe Employee

Thanks for tagging me @doug_den_hoed__atappstore! With the Reporting Canvas the goal has always been to make this type of customization of Reporting much easier and visual. @mattmi3 is probably the best person to comment on this thread as he now owns Reporting Canvas.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded