Adding a URL Under a Title Header

Question

I currently have a title header using JSON in a SharePoint list that works as I would like it to. I want to add a URL under the Title which points to a standard operating procedure outlining how to use the list. I need to know how to add the URL code so it will show under the title. See the the yellow highlighted area in the picture below for reference. I used this forum to find the proper code for adding a URL but am unsure of how to put the two together. Thank you in advance.

Header/Title Code Being Used (this works):

{ "elmType": "div", "attributes": { "class": "ms-bgColor-blue" }, "style": { "width": "99%", "border-top-width": "0px", "border-bottom-width": "1px", "border-left-width": "0px", "border-right-width": "0px", "border-style": "solid", "margin-bottom": "16px" }, "children": [ { "elmType": "div", "style": { "display": "flex", "box-sizing": "border-box", "align-items": "center" }, "children": [ { "elmType": "div", "attributes": { "iconName": "HomeVerify", "class": "ms-fontSize-42 ms-fontWeight-regularms-fontColor-neutralLight", "title": "Details" }, "style": { "flex": "none", "padding": "0px", "padding-left": "0px", "height": "36px" } } ] }, { "elmType": "div", "attributes": { "class": "ms-fontColor-white ms-fontWeight-bold ms-fontSize-24" }, "style": { "box-sizing": "border-box", "width": "100%", "text-align": "left", "padding": "21px 12px", "overflow": "hidden" }, "children": [ { "elmType": "div", "txtContent": "='Used for ticket refund requests ONLY' + [$Title]" } ] } ] 

}

URL Code (How do I add this to the code above?):

{ "elmType": "a", "txtContent": "Request link here", "attributes": { "href": "[$RequestLink]" } 

}

Answer 1

Add the URL code to your existing JSON code by adding it as a child element under the main "div" element.

• The URL will be added under the title.
• The URL will be displayed as "Request link here".
• The URL will link to the URL stored in the [$RequestLink] field.
• If your URL is static, please replace [$RequestLink] with your actual URL.
• If your URL is dynamic and stored in a SharePoint list column, then ensure the column name matches exactly with [$RequestLink].

Please test and let me know if this helps.

{ "elmType": "div", "attributes": { "class": "ms-bgColor-blue" }, "style": { "width": "99%", "border-top-width": "0px", "border-bottom-width": "1px", "border-left-width": "0px", "border-right-width": "0px", "border-style": "solid", "margin-bottom": "16px" }, "children": [ { "elmType": "div", "style": { "display": "flex", "box-sizing": "border-box", "align-items": "center" }, "children": [ { "elmType": "div", "attributes": { "iconName": "HomeVerify", "class": "ms-fontSize-42 ms-fontWeight-regularms-fontColor-neutralLight", "title": "Details" }, "style": { "flex": "none", "padding": "0px", "padding-left": "0px", "height": "36px" } } ] }, { "elmType": "div", "attributes": { "class": "ms-fontColor-white ms-fontWeight-bold ms-fontSize-24" }, "style": { "box-sizing": "border-box", "width": "100%", "text-align": "left", "padding": "21px 12px", "overflow": "hidden" }, "children": [ { "elmType": "div", "txtContent": "='Used for ticket refund requests ONLY' + [$Title]" } ] }, { "elmType": "a", "txtContent": "Request link here", "attributes": { "href": "[$RequestLink]" } } ] }