Power Style Editor Overview

Overview of using the Power Style Editor

Here is a high level overview of how to use the Power Style Editor section that is included with plaYEAH! PowerUp.

• A custom page will be used to allow you to preview and save your design before making it live. On this page we are simulating what you would see inside the course player

• You will use the Power Style Editor section inside of Site Builder to setup either a default style or course specific styles

• The Power Style Editor will automatically generate a snippet of code that you will copy and paste into Site Footer Code

Getting to Know the Power Style Editor UI

• Settings Area: The settings area to the left are essentially Site Builder setting groups that you should already be familiar with. Except these are specific settings for the Power Style Editor. Each settings group controls specific settings for areas that are on the course player preview section

• Preview Section: The player preview section is just a preview. It is not a working course player. The "hamburger" menu does not function nor does the expand and collapse sections for the chapters and lessons. This is intended to simulate what the course player will look like if you paste the settings into the Site Footer section as described below.

Depending on your browser size, you may not see the "side" bar that you would normally see (and what is typically styled). To see the sidebar in preview, be sure to click the full screen icon at the top of the page:

• Power Style Navbar: This contains a links back to the training videos and documentation for more detail. It also has the Copy Code button that you will use later.