How to Design & Brand a Site Using SharePoint Designer 2013

SharePoint Designer 2013 is the tool of choice for the development of SharePoint Applications.​Using SharePoint Designer, you can rapidly create SharePoint solutions in response to business needs. Moreover, with SharePoint Designer 2013, you will see many changes that encompass a variety of new features, as well as a new user interface. In this article, I will show you how to create, design, and brand a site with SharePoint Designer 2013.

Challenge:

With sites created in SharePoint 2013, you can only use default master pages. Modifying the master page with SharePoint Designer 2013, you can make a variety of changes, including, but not limited to: text color; font-size; font style; and attach style sheet. Below, I will demonstrate how to create/modify master pages using SharePoint Designer 2013.

Solution:

Open SharePoint Designer 2013 program, and select the Open Site menu:

Type the site name into the Open Site dialog box, and click the Open button.

Go to the Master Pages tab and select v4.master:

Under the Customization section, select Edit file:

Go to the right pane, CSS style section:

Right-click on body, and select the Modify Style menu:

The Modify Style dialog will show up.

In the Category box, select any attribute that you need to change/modify:

For example: selecting the Font attribute, I am able to change the font family, size, color, etc.

Click Apply then OK:

Moreover, you can attach a Style Sheet by clicking the Browse button:

In the LAYOUT tab, select Insert Layer icon:

You can then insert the layer you just created above:

Click the Save button.

Go to your SharePoint site and select the new custom master page to see the result.