Show internal column names in SharePoint with Tampermonkey

6 maj 2024 Oprindeligt udgivet på alexanderhenkel.dk

Learn how to create a keyboard shortcut, to display a column’s internal name (along with a copy function) in SharePoint

In an earlier post I described how you could make a keyboard shortcut that would take you to the list or library settings.

Here I will give you an example of how you can display the internal column names of a list or library, including a function for copying the internal name.

Here is a SharePoint list with two columns

SharePoint list showing two columns with their display names before pressing the ALT+I keyboard shortcut

By pressing ALT + I on my keyboard, I’m now able to view the internal names of the columns

SharePoint list after pressing ALT+I showing each column header expanded to display the internal name in parentheses alongside a clipboard copy icon

Clicking on the copy 📋 icon enables me to easily copy the internal name to my clipboard.

Here is the script in action

Animated demonstration of pressing ALT+I to reveal internal column names in SharePoint and clicking the copy icon to copy an internal name to the clipboard

If you don’t already have the Tampermonkey Chrome Extension, you can read in this previous post how to install and use the extension

The code

Here is the Tampermonkey script

// ==UserScript==
// @name         SharePointInternalNames
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Show Internal Names in SharePoint List (with copy function)
// @author       Alexander Henkel - www.alexanderhenkel.dk
// @match        https://*.sharepoint.com/*
// @icon         https://img.icons8.com/color/48/000000/ms-share-point.png
// ==/UserScript==

function showNotification(message) {
    const notificationElement = document.createElement('div');
    notificationElement.style.cssText = `
    position: fixed;
    top: 50px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px;
    background-color: #a3e6b7;
    border: 1px solid #4caf50;
    border-radius: 4px;
    color: #4caf50;
    font-weight: bold;
    z-index: 9999;
        `;
    notificationElement.textContent = message;

    document.body.appendChild(notificationElement);

    setTimeout(() => {
        document.body.removeChild(notificationElement);
    }, 2000);
}

window.addEventListener("keydown", (event) => {
    if (event.altKey && event.key === "i") {
        const headers = document.querySelectorAll("[Role='columnheader']");
        const gridcells = document.querySelectorAll("[Role='gridcell']");

        for (const header of headers) {
            if (header.children.length > 1) {
                const displayName = header.children[1].children[0].children[0].innerText;
                const internalName = header.dataset.itemKey;
                header.dataset.internalName = internalName;
                header.style.position = 'relative';
                const copyIcon = document.createElement('span');
                copyIcon.innerHTML = '📋';
                copyIcon.style.position = 'absolute';
                copyIcon.style.top = '50%';
                copyIcon.style.transform = 'translateY(-50%)';
                copyIcon.style.left = '10px';
                copyIcon.style.cursor = 'pointer';
                copyIcon.title = 'Copy Internal Name';
                copyIcon.addEventListener('click', (event) => {
                    const target = event.target.closest("[Role='columnheader']");
                    if (target) {
                        const internalName = target.dataset.internalName;
                        navigator.clipboard.writeText(internalName)
                            .then(() => showNotification(internalName + " was copied to your clipboard"))
                            .catch((error) => console.error('Unable to copy internal name: ', error));
                    }
                });
                header.appendChild(copyIcon);
                header.children[1].children[0].children[0].style.marginLeft = '20px';
                header.children[1].children[0].children[0].innerHTML += `(${internalName})`;
            }
            header.style.width = (parseInt(header.style.width.replace("px", "")) * 1.5) + "px";
        }

        for (const gridcell of gridcells) {
            gridcell.style.width = (parseInt(gridcell.style.width.replace("px", "")) * 1.5) + "px";
        }
    }
}, false);

I am a low-coder, so the above script can probably be fine tuned - you can always contact me through x.com if you have any ideas or improvements to the script

‎