Forum Discussion
Drogon365
Nov 15, 2021Copper Contributor
JSON to change font from Times to anything else - Syntax??
Using SharePoint Online, and we have a list with a column that is formatted as a clickable email address. While all the other columns are some nice font, like Segoe or something, this email column is Times New Roman and it looks awful, but I have been unsuccessful in using JSON to format it.
I've tried adding this to the formatting, but it remains TNR:
"style":
{"font-Family": "Segoe UI"}
Do I have the syntax wrong? I've tried substituting "Verdana" and "Arial", but nothing changes.
Thanks!
Drogon365 I have used below JSON & it is working fine for me.
Example:
{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "a", "txtContent": "@currentField", "attributes": { "target": "_blank", "href": "https://google.com/" }, "style": { "font-family": "Segoe UI" } }
Output:
Try using similar JSON styles & let me know if it works for you.
Also, are you using column formatting as well as view formatting in the same list?
Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.
- Drogon365Copper Contributor
ganeshsanap That didn't work for me. I used:
"style":{"font-family":"Segoe UI","font-size":"12px"}and while the font size does change based on the px value I indicate, font-family won't change at all, even with Verdana, Arial, etc.No other formatting is being used on this list, although the full code for this particular column is pasted below for context. I've tried adding the font-family code to other, more basic lists in SharePoint, and the result there is that the data in the column disappears (screenshot below).{"debugMode": true,"elmType": "div","children": [{"elmType": "a","txtContent": "@currentField","attributes": {"iconName": "Mail","class": "sp-field-quickAction","href": {"operator": "+","operands": ["mailto:","@currentField"]}}}],"style":{"font-family":"Segoe UI","font-size":"12px"}}Drogon365 Try copy pasting below JSON as it is & let me know if it works for you:
{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "children": [ { "elmType": "a", "txtContent": "@currentField", "style": { "font-family": "Segoe UI", "font-size": "12px" }, "attributes": { "iconName": "Mail", "href": { "operator": "+", "operands": [ "mailto:", "@currentField" ] } } } ] }
Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.