Skip to the content

SharePoint Designer: How to use it for your SharePoint sites

SharePoint Designer is the app to design SharePoint sites.

From layout to workflows, this tool will help you build dynamic and branded communication and collaboration channels.

So let's find out together how to use it to give your users the best browsing experience!

What is SharePoint Designer and how to get started using it

SharePoint Designer is Microsoft's home-grown web and application design program.

Its goal is to help people build custom, data-rich SharePoint sites and applications without writing code.

Its features also allow people to create workflows to automate tasks and processes in any organization.

In this article, we will look together at what the main features of SharePoint Designer are and how to use it to deliver the best user experience, providing users with comprehensive and uniquely designed solutions.

What is intranet.ai?


It's the ready-to-use SharePoint intranet,
designed to reduce costs and implementation time.

  • Starting price is 2.450€ for a fully-featured intranet.
  • More than 25 features, including Intelligent Search, Document Management, Company News, and Teams Push Notifications.
  • 100% integrated with Microsoft 365, Viva, and Power Platform.


As the name suggests, SharePoint Designer is a design program closely related to SharePoint, the Microsoft 365 platform developed to create smart corporate sites.

In fact, you can use SharePoint to build team sites - ideal for project and initiative management - and communication sites, such as intranet and extranet, within which you can collaborate on documents stored in the Microsoft cloud or publish internal communications, employee services, training content and more.

 

To learn more, we suggest you read our article on SharePoint and its 7 key features.

 

SharePoint Designer fits into this context with its features to customize SharePoint sites, from the layout down to the individual components that make them up.

Among the components, we emphasize applications that you can integrate to provide your users with information and services of any kind capable of significantly enhancing their experience.

With its design and editing capabilities, SharePoint Designer enables you to transform SharePoint sites from simple document repositories to dynamic, business-process-based portals.

It does this by offering a single space from which you can edit the elements that makeup sites and related pages. But that's not all.

SharePoint Designer also allows you to work on the relationships that bind those elements, so you can design user navigation within the site and set up workflows to automate the most repetitive and lowest-value-added tasks.

How to connect a SharePoint site to SharePoint Designer

To begin using SharePoint Designer, you must connect the SharePoint site of your interest to the program.

But first, you must make sure you belong to one of the following SharePoint groups:

  • Site collection admin.
  • Designer.
  • Owners.

In fact, such groups are characterized by having the appropriate level of authorization to access the more advanced features of both SharePoint and SharePoint Designer.

In this way, your organization can control and manage the ability to edit sites, preventing unauthorized users from harming their navigation and components.

Once you have obtained permission to join one of the listed groups, you can finally connect one or more SharePoint sites to Designer.

To do so, you will simply follow these steps:

  1. Open SharePoint Designer.
  2. Click on "File" in the top menu of the interface.
  3. Select "Open Site".
  4. Enter the URL of the SharePoint site you wish to edit in the "Site Name" box.
  5. Indicate the mode of editing. Here, you will be able to choose whether to take direct action on the site or to make a copy of it to publish the changes later.
  6. Click "Ok".

Now, you can start using the features of SharePoint Designer to design and build your SharePoint site, from the general navigation down to the individual components.

How to access the design features of SharePoint Designer

As mentioned earlier, SharePoint Designer allows you to edit in detail the SharePoint sites to which it is linked.

With its features, you can act at the layout level, to build custom pages according to your company brand, influence the relationship that binds the different components of the pages, create automated workflows, or even link different data sources to the site and integrated apps, to provide users with a wide range of useful information.

In short, you can use Designer in an extremely flexible way, adapting it to the needs of your organization and its internal processes.

The user interface is the starting point.

Here, you will indeed find the 3 command panes containing the program's main design features. Specifically, you have at your disposal:

  • The navigation pane.

Inside it, all the components of your site are listed.

You can use SharePoint Designer's navigation commands to reach each individual element that makes up the pages of your site, isolate it, and edit it.

  • Gallery and Summary.

These screens allow you to view the list of site components and a brief description of their relative functionality, respectively.

  • Ribbon bar.

In this section, you can access all the design and editing commands that SharePoint Designer makes available to you.

It is interesting to note the relevance with which these commands are offered by the program.

In fact, each time you select a site component, you are shown the most relevant commands for the element you have chosen.

In this way, SharePoint Designer tries to support you and give you the best advice on how to create or modify your site components, making them more useful for your users.

From the ribbon, you can also connect different data sources to SharePoint sites and Office client apps.

Specifically, you can decide whether to connect external databases, SOAP services, REST services, and more.

In this way, you will allow users of your site to access the information they are interested in directly from a single view, without then having to go into each of the external data sources.

You will be able to bring information together on a single page and combine it with SharePoint Designer to create customized dashboards and dynamic templates.

Finally, you will also have the ability to customize the toolbars and ribbons associated with the data by default so that users can interact with them in the way your organization sees fit.

Subscribe to our newsletter!


You will find:

  • Short training and update videos on Microsoft 365 news.
  • Our guides for business digitisation.
  • In-depth articles on how to improve your intranet by making the most of your Microsoft 365 subscription.


You can always unsubscribe at any time.

How to create automated workflows with SharePoint Designer

Among the most popular design features of SharePoint Designer is the ability to create workflows to automate any type of process related to the lists and libraries of a SharePoint site.

Specifically, the workflows you can build with Designer are used to make two types of processes automatic:

  • Processes related to site components.

An example would be updating a specific data source after an initial data source, such as a document library, has been modified.

  • Processes of collaboration between people.

In this case, we might give the example of approving a document once it has been added to a specific SharePoint list.

With workflows, you then have the possibility of tying to the actions that users perform in a SharePoint site a concatenation of events aimed at completing repetitive tasks or those "bureaucratic" operations that every day steal time, energy and space from far more profitable chores.

So to create a workflow with SharePoint Designer, follow these brief directions:

  1. Open SharePoint Designer.
  2. Open the drop-down menu for the "List Workflow" item in the navigation bar.
  3. Select "New".
  4. Indicate the SharePoint site list from which you want to start the workflow.
  5. Enter the name and description of the workflow.
  6. Make sure that "SharePoint 2013 Workflow" appears in the "Platform Type" section.
  7. Select "Ok".

Now, the new workflow is ready to be structured.

If you are not familiar with the workflows of platforms such as Power Automate, you should in fact know that each workflow is based on certain structural elements, such as Actions, Conditions, Phases, Steps, and Loops.

In this article, we will not go into them in detail.

However, we would like to point out that Actions trivially correspond to what is done by the flow as an event and its related Conditions occur.

For example, you might set as a Condition the addition of a particular file type to a SharePoint list and as an Action the sending of an approval request to a specific user group.

At that point, the flow automatically starts to accomplish step by step all the Actions assigned to it, possibly broken down into Phases and subsequent Steps.

Finally, the term "Loop" refers to the ability to make certain activities of the created workflow repetitive.

So have fun experimenting and thus refining your company's processes, making them smoother, more effective, and ultimately more satisfying for everyone!

How to create branded corporate sites with SharePoint Designer

An important function of SharePoint Designer is to help you implement your organization's branding strategy.

In fact, the program allows you to incorporate elements such as logos, palettes, corporate headers and footers into each page of your SharePoint sites.

To do this, it provides you with 3 main tools, which collectively bring together all the layout design commands. Let's look at them below:

  • Master Pages.

Originating as a feature of ASP.NET, Master Pages were included in SharePoint to create, edit, and save as reusable templates the pages of its sites.

Specifically, you can use a Master Page to define the layout and navigation within each.

  • Page layout.

Along with the Master Page, page layouts offer granular control over the structure of pages to be published on SharePoint sites.

Specifically, they allow you to modify the title, body and graphics that characterize your digital texts.

  • Cascading Style Sheets (CSS).

SharePoint makes use of CSS style sheets to enable web and app designers to apply corporate brand colors and graphics, as well as to position the elements that make up a site's pages.

To create a CSS style sheet, you can use Master Pages, page layouts, or the CSS file that you will then attach to each page of the site, again through SharePoint Designer.

Do you want a complete, ready-to-use intranet?

"Intranet-in-a-box" is the complete service for your company:

  • We offer you a branded intranet already integrated with Microsoft 365 and Viva.
  • We go beyond the limits of a standard corporate site with our 100% customizable features.
  • We update all components to the latest Microsoft standards.

Simplify internal communication and digitize your business with minimal investment.

Giuseppe Marchi


Microsoft MVP for SharePoint and Microsoft 365 since 2010, Giuseppe founded Dev4Side and intranet.ai with the aim of helping companies to have a simpler and more effective working environment.

He works as a consultant for everything related to digital collaboration, intranet portals and Microsoft cloud platforms.

Keep on reading

SharePoint layout: Here's how to customize your intranet

How do you customize the layout of a SharePoint intranet? With our short guide.

SharePoint VS OneDrive: What is the difference?

Two cloud storage systems with many similarities, but one big difference.

Microsoft Loop: What it is and why it is going to change digital work

Loop is the new Microsoft 365 app, still in the experimental phase. What will it lead to?