# PS-024 Banner Fixed Image

<figure><img src="https://2076656448-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FKoiMYLJn5jwLpp57CMAp%2Fuploads%2FNRoxCSSMD7xrJzpSD3jH%2F164072custom_site_themesidPVpFpz.jpeg?alt=media&#x26;token=76bc3708-35af-488d-a8b4-47a7b1a9c5a9" alt=""><figcaption></figcaption></figure>

**Adding this Player Snip**

* [ ] On your [`My Player Snips Page`](https://docs-playersnips.superpowerups.com/how-to-guides#how-to-create-a-my-snips-page) add the **`PS-024`** section to your page
* [ ] **Open up the section's `Headings` settings group** and modify the text settings&#x20;
* [ ] Open the section's **`Image` settings group** and replace the placeholder image. The recommended image dimensions are shown in the image

{% hint style="warning" %}
The image here is used for an "interesting transition" to the next section of the lesson=. It will be cropped in various sizes based on the size of the browser and if the course player is in full screen mode or in standard mode. You should select an image that does not have any words and don't care where it gets cropped.
{% endhint %}

* [ ] Optionally open the section's **`Color`** settings group and change the *Color Mode Option* to `Custom` if you wish to control the color combinations
* [ ] Hover over the section and click the **`Copy Player Snip`** button
* [ ] In another tab **open your course curriculum** and find the lesson you wish to place this Player Snip into
* [ ] Put your cursor in the location that you wish to place this snippet&#x20;
* [ ] Open up the < > code viewer
* [ ] Paste the snippet
* [ ] Click the < > code button to return to the normal preview
* [ ] Click Save to save the lesson
* [ ] Preview the lesson inside the course player

{% hint style="info" %}
The button color is automatically using the same "brand color" you have set for this course. It will be the same color you see for the complete and continue button.
{% endhint %}

##