How to Edit a Page Header

1. Sign in to a PlayerFirst website.

2. Navigate to the page header you want to edit.

3. Click Edit Page in the bottom right corner of your screen.

   • Click the header portion at the top of the page.

   • Page Header Settings will show up on the right side of your screen.

   • Page Header Settings provides all the tools needed to customize your page header how you would like.

4. To see a preview of your edits, click Preview, in the top right corner.

5. To save, click the blue Save button in the top right corner.

   • If you do not click Save, your changes will not be made.

How to Change Header Background Color

1. Sign in to a PlayerFirst website.

2. Navigate to the page header you want to edit.

3. Click Edit Page.

4. Click the header portion at the top of the page.

5. Page Header Settings will show up on the right side of your screen.

6. See Background Color in the Page Header Settings navigation.

7. Choose a given color you would like for your header background.

8. If you do not see a color you want, click the button to customize your color.

9. To save, click the blue Save button in the top right corner.

   1. If you do not click Save, your changes will not be made.

How to Add a Background Image to Your Page Header

1. Click Edit Page

2. Click the header portion at the top of the page.

3. Page Header Settings will show up on the right side of your screen.

4. See Background Image in the Page Header Settings navigation.

5. Click the Image button below and select the file you want as your Header Background.

   1. Edit the Image Fit right below.

      1. Choose between Cover, Contain, or Auto fit.

   2. Edit the Image Position.

      1. If you chose Contain or Auto, you an alter the Image Position, up or down to how you see fit.

   3. Edit the Image Opacity.

      1. Alter Image Opacity on a 0 - 100 scale.

6. To save, click the blue Save button in the top right corner.

   1. If you do not click Save, your changes will not be made.

Page Header Name, Introduction, and Subheader

1. If you are creating a new page or editing a page, the Page Header Name will show up as the Page Header Title.

2. To Change the Page Header Title, click on the title, and edit.

   1. Change the text font, color, bold, italic, and more at the top with the edit navigation.

3. Add an Introduction under the Page Header Title by clicking Insert Introduction.

   1. If you don’t want an Introduction, un-check Show Intro in the Page Header Settings on the right side of your screen.

4. Add a Subheader under your Page Header Name by clicking Show Subheader.

   1. Insert Subheader will show up and click into it to edit.

5. To save, click the blue Save button in the top right corner.

   1. If you do not click Save, your changes will not be made.

Adding Primary and Secondary Buttons to the Header

1. To add a Primary Button to your Page Header, select Primary Button in the Page Header Settings on the right side of your screen.

2. A Flex Tile will show up under Insert Introduction

   1. Edit the Flex Tile Text within the Primary Button and in Flex Button Settings.

   2. Choose a Solid or Outlined Type

   3. Choose a Size between Small, Medium, Large, and Max.

   4. Add a Link to your Flex Button

      1. Check Open in New Tab if you want to open the link in a new tab.

   5. Change the Color of your Flex Button

   6. Alter Spacing Top and Spacing Bottom with sliders from 0-100.

3. To add a Secondary Button to your Page Header, select Secondary Button in the Page Header Settings on the right side of your screen.

   1. Edit the Flex Tile as stated above for Primary Button.

4. To save, click the blue Save button in the top right corner.

   1. If you do not click Save, your changes will not be made.