Search code examples
sharepoint-online

How to make the size of my profile picture bigger with JSON?

I have set my profile picture in the list column Person. When i go to the Gallery view i think my profile picture is a little bit small and could get bigger like 72x72. But what to put in the json code to make my profile picture 72x72 ?

Gr. P

I have tried: "Width":"72px"; "height""72px"

But no luck

Solution

  • When creating a gallery, the default JSON formatting for the Author column is:

                "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "sp-card-userEmptyText"
                },
                "txtContent": "=if(length([$Author]) == 0, '–', '')"
              },
              {
                "forEach": "personIterator in [$Author]",
                "elmType": "a",
                "attributes": {
                  "class": "=if(loopIndex('personIterator') >= 5, 'sp-card-userContainer', 'sp-card-userContainer sp-card-keyboard-focusable')"
                },
                "style": {
                  "display": "=if(loopIndex('personIterator') >= 5, 'none', '')"
                },

    default size

    If you want to change the CSS, you can add width and height to 72px. On your gallery view, click on Format current view > Advanced mode to edit the JSON definition. Can you share your code to see what's wrong?

                "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "sp-card-userEmptyText"
                },
                "txtContent": "=if(length([$Author]) == 0, '–', '')"
              },
              {
                "forEach": "personIterator in [$Author]",
                "elmType": "a",
                "attributes": {
                  "class": "=if(loopIndex('personIterator') >= 5, 'sp-card-userContainer', 'sp-card-userContainer sp-card-keyboard-focusable')"
                },
                "style": {
                  "display": "=if(loopIndex('personIterator') >= 5, 'none', '')",
                  "width": "72px",
                  "height": "72px"
                },

    72px square

    Please note that by default the user profile picture is using the S size (small, 32px). You can also change the URL to use the M size (medium, 72px): check the second argument of the getUserImage function.

                    "children": [
                  {
                    "elmType": "img",
                    "defaultHoverField": "[$personIterator]",
                    "attributes": {
                      "src": "=getUserImage([$personIterator.email], 'M')",
                      "title": "[$personIterator.title]",
                      "class": "sp-card-userThumbnail"
                    },