Forum Discussion
Change a Hyperlink Column Type long hyperlink to button or word
I am not having luck making this work. How can I use Json to make everyone of my column items in the Link to Item column a button that takes me to this link. Something prettier than this. The column type is a hyperlink and the column name is link to item. Hopefully this is enough information.
VeeExcelLearn Use JSON column formatting like:
{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "a", "attributes": { "href": "@currentField", "target": "_blank" }, "style": { "text-decoration": "none" }, "children": [ { "elmType": "button", "txtContent": "Link to Item", "style": { "cursor": "pointer", "width": "100%" } } ] }Output:
You can applying CSS styling using available properties given in documentation: formatting-syntax-reference style
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.
3 Replies
VeeExcelLearn Use JSON column formatting like:
{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "a", "attributes": { "href": "@currentField", "target": "_blank" }, "style": { "text-decoration": "none" }, "children": [ { "elmType": "button", "txtContent": "Link to Item", "style": { "cursor": "pointer", "width": "100%" } } ] }Output:
You can applying CSS styling using available properties given in documentation: formatting-syntax-reference style
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.
- Its working but it did give me this error...when I tried to save. I am not sure why it did that but the buttons do appear and they work..never seen that before.
]
}
Error saving column format: {"d": {"CustomFormatter": "{\"$schema\":\"https:\u002F\u002Fdeveloper.microsoft.com\u002Fjson-schemas\u002Fsp\u002Fv2\u002Fcolumn-formatting.schema.json\",\"elmType\":\"a\",\"attributes\":{\"href\":\"@currentField\",\"target\":\"_blank\"},\"style\":{\"text-decoration\":\"none\"},\"children\":[{\"elmType\":\"button\",\"txtContent\":\"Link to Item\",\"style\":{\"cursor\":\"pointer\",\"width\":\"100%\"}}]}", "Id": ""}}
Switch to design mode
This formatting JSON will be discardedVeeExcelLearn I am not getting this error while saving JSON.
Refresh the page & try again saving the JSON formatting.
Please consider giving Like if my post helped you in any way.
