How to Add a Document to a Library from the Page

Have you ever wondered if you can add a document to a SharePoint list right from the site page, by just clicking a button? Good news: you can easily accomplish this using ShortPoint Page Builder elements and the Connect Feature.

After clicking the button, the user will see a lightbox popping up, with a form to upload a new document:

Please read through the following steps to accomplish the same on your site.

Step 1: Create a URL for uploading a document

Open the Document Library you would like to add a document to. Choose the Library tab in the Ribbon and click Library Settings:

From the address line of the browser, copy the part of the URL that goes after List= , like this:

Now, this part of the URL needs to be decoded. Please open an URL decoding tool and paste the copied part there. Then, please press Decode URL:

Copy the results from the window on the right:

Now, finally, use this part of the URL to substitute the part highlighted in red here:

http://sitecollectionurl/_layouts/Upload.aspx?List={document library id}

Don't forget to substitute the part highlighted in green with your site address. Here is an example of what we have used in our case:

https://somewhatcompany.sharepoint.com/_layouts/Upload.aspx?List={BDD7438E-78D6-405B-B7EF-689275CF43FB}

That's it for now. Keep this URL to use in one of the next steps of this tutorial.

Step 2: Insert a Panel

Open the page you are working on in Edit mode.

In the Ribbon, choose the Insert tab and click Insert:

After ShortPoint Page Builder opens, choose Panel:

For the sake of this example, I will simply add a Title to my Panel, but remember you can customize any field you would like to:

Scroll down to find the Link settings. Here is where we will create the + Add a Document button. Here is a reference on the fields to fill in:

• Link Text: Create a name for your button. 
• Link: Use the link you created in Step 1.
• Link Type: Choose Button.
• Linking Options: We have chosen Lightbox to open the document upload form in a popup window in the center of the page, but feel free to set it differently (e.g., choose new-window to open in a new browser tab. For more references on this please read this article: Types of Linking Options in ShortPoint Page Builder Elements).

Step 3. Add the File List inside the Panel.

Now, everything you need to do is to add the File List inside the Panel you have just created.

In the edit mode of the page, click inside the Panel and press Insert on the top to open the Page Builder:

Choose File List:

Connect your File List to the Documents Library you want to display, and map the items. For more details on how to use ShortPoint Connect, please check our Connect Basic Tutorial.

Here is what you will see in edit mode when everything is ready:

And here is how the page will look like in view mode: