You have been slaving away at getting a page to look just right, with some contents on the page and a list of documents on the right hand side to showcase further reading material. But lo and behold.. SharePoint cuts off the full length of the document name! What? Oh no!
This is just another example of SharePoint trying to be clever with the use of space on your page. But if you have somewhat longer document names, it really is cumbersome!
Thankfully, there is a quick fix for this using the Formatting options. I already touched upon using the formatting options here to show how easy it is to make something look great and here to add an Edit button to your items. You can find more information on the docs site here.
Solution
Go the library where the documents are stored. Click on the name column and choose to “Format this column”. This will open a side bar where you can apply formatting, like color coding and other nice things.
In this case, you will want to go to the Advanced mode by clicking on the button below. There you are greeted with some sample code. Just replace that code with the one below:
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "div",
"txtContent": "@currentField"
}
What this code does is adding a DIV layer around the field, making it unbreakable for SharePoint! Next, it will show the current field, which in this case is the name of the document.
Ofcourse, this trick is also usable on other metadata columns, thereby giving you a clearer view of the contents of the metadata field. It also works with multiline textfields.
The result is that the full name is now shown, and if the text is longer than what is available, it will nicely create a new line for the document name.
Now off you go, finish that nice looking page with some useful source material on the right-hand side and have a great result to showcase to your users!