SharePoint Online Create custom columns for the Portal series

? Preface

SharePoint online comes with a library with two levels of pages and detailed pages, which is AllItems pages and Dispform pages, but it is not beautiful, especially for the portal, the enterprise façade, even more unacceptable.

Below, we begin to learn how to customize the SPO level two pages and detailed pages.

A. Level two page of the SharePoint online customization list

Create a view on the list page of the news Center to use as a level two page, such as:

View type, select Create a new view based on all items, such as:

The input view name is called "News Center" and is also set as the default view, such as:

Select the column, we select the title, of course, if there are other needs, we can continue to modify, such as:

Set the sort so that the latest news releases are displayed at the top, such as:

Set the table view and remove the options so that there is no check box in front of each item, such as:

Modify the URL of the view so that it does not display a name that is not easily understood by View1, such as:

Open the Web site in designer, edit the view below the news center list, such as:

In the view file, right-click to edit the file in advanced mode, such as:

Modify the master page to modify the master page that we customized, such as:

Preview in the browser, and then modify the HTML, such as:

Simply adjust the style, such as:

In fact, the right side can also continue to use CSS or JavaScript optimization, but because of the demo, they did not spend too much time to optimize;

Ii. detailed pages of the SharePoint online customization list

First look at the default detailed page display for SharePoint online, such as:

such as the show, we can say that there is no way to accept, too ugly, below, we use the designer to customize this page. First designer opens the news list, then finds the Dispform page and right-opens it in advanced mode:

After you open the page, first modify the master page, such as:

Insert a display list form, such as:

Select Add and Remove Columns on the Ribbon menu to display the title, content, creation time, and creator, such as:

Modify the following HTML on the Dispform page to modify the display, such as:

Then everyone can see my modified effect, not particularly good-looking, but more beautiful than the default, such as:

In addition to modifying the page style, you also need to create a filter, otherwise the page only displays the first message, click Filter on the Ribbon menu, such as:

On the pop-up filter, select the ID, and create a new parameter, such as:

Add a parameter named ID, the parameter source selects the query string, and the query string variable is an ID, such as:

Then click OK, then. When you switch the ID on the Dispform page, the content on the page switches. Select ID 2 is not just id=1 test data, such as:

Summary

In fact, the method of customizing pages in SharePoint Online is basically consistent with the version of SharePoint Server, which is customized by the designer and is also easy to look at. This also means that SharePoint online is a system based on the server version.

Well, it's late, just get here, rest, take a break.

SharePoint Online Create custom columns for the Portal series