SharePoint List

Question

I'm having difficulty making the mail icon appear before my current field (email address), I've moved around the code many ways to achieve this and still get a JSON error. Here's the code I'm using. Thanks for any help you're able to offer :)

{<br><br>    "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",<br><br>    "elmType": "div",<br><br>    "children": [<br><br>      {<br><br>        "elmType": "span",<br><br>        "style": {<br><br>          "padding-right": "8px"<br><br>        },<br><br>        "txtContent": "@currentField"<br><br>      },<br><br>      {<br><br>        "elmType": "a",<br><br>        "attributes": {<br><br>          "iconName": "Mail",<br><br>          "class": "sp-field-quickActions",<br><br>          "href": "='mailto:' + @currentField + '?subject=Mortgagee Updated Needed For:\r\n---\r\n' + @currentField + '\r\nClick this link for more info. http://contoso.sharepoint.com/sites/ConferencePrep/Tasks/Prep/DispForm.aspx?ID=' + [$ID]"<br><br>        }<br><br>      }<br><br>    ]<br><br>  }<br><br> <br><br> <br><br>

Answer 1

Thanks so much for the suggestion. I think I'll just accept that the image is to the right of the email address. What I'd really like is for the column not to wrap and make the row even wider on my list. like it's currently doing now. I like how my website hyperlink autoformats to the column width and shows .... Any ideas how to add that feature to the JSON code by chance?

Answer 2

Put the icon in a span before the a element? You may have to add a column with just the icon for the best effect.

Answer 3

Hi Vanessa Holland,

Thanks for your valuable feedback and sharing updates with us and I really appreciate your effort and your precious time doing. 

 And I appreciate your kind words.

Yes by default, the Email icon appear after Email address name in a SharePoint online list using given JSON code. For customization I need to find and search a code to see if your requirement meet.

Your understanding and patience will be highly appreciated. I hope that you are keeping safe and well!

Sincerely,

Waqas Muhammad

Answer 4

Thanks so much, if that's how it's designed to appear then I completely understand. I primarily wanted to make my email address not wrap and shorten just how the web address stops at the column width and adds periods ... I'd be super happy with that look the most. Thanks again for your help, super appreciative. :)

PII is mask by MSFT

Answer 5

Dear Vanessa Holland,

Good day! Thank you for posting to Microsoft Community. We are happy to help you.

As per your description, I also meet the same scenario(the adding Email icon button appear after Email address name in a SharePoint online list when I enter email address. Here is my test screenshot for your reference

According to this article Add an action button to a field (advanced) unfortunately I cannot find mentioned format the Email icon button appear before the Email address in SharePoint online list.

For customization in order to Email icon button appear before the Email address, if possible could you please allow me some time to do more test/investigate and I will updates here ASAP after I get result.

However, if you want to make a email address as a linkable in SharePoint Lists instead of Email icon, you may refer my this thread(JSON code): Email link in SharePoint Lists

Your understanding and patience will be highly appreciated. I hope that you are keeping safe and well!

Sincerely, 

Waqas Muhammad