How do I customize the banner images on my site?

Note: This article describes the methods for customizing banner images on SilkStart sites that use the Premium site theme. Only sites with the Premium website theme have full-width banner images on all pages.

Update the default banner image

All pages your SilkStart site start with the same default banner. You can choose different banners to use on every page, but all new pages you create will start with the default image.

 

Change the default banner image:

1. Log into your Silkstart admin panel.
2. Go to Site > Look and Feel.
3. Scroll down to the section labeled "Default Banner".
4. Click on "Delete Image" to remove the current default banner. Upload a new file.
5. When you are finished, click "Save".

Change the banner on a custom webpage

1. Open the page with the banner that you want to change.
2. Click on the orange "Edit this page" button on the far left side of the screen.
3. Click on the orange "Options" button on the left side of the screen.
4. Click on "Miscellaneous Page Options".
5. Upload a new banner image.
6. Save and publish your changes. 

For more information on editing or removing the banner of your custom webpage, see this article.

Change or remove the banner on an application page

You can also upload a new banner to application pages, including the event calendar, member directory, and news page. A good rule of thumb is that if the URL doesn't contain /cpages/, you are looking at an application page. Banners can also be suppressed for individual application pages.

 

Change the banners on an application page:

1. Go to Settings > Apps.
2. Click on the application page that you want to change the default banner for - eg. Events.
3. Click on "Delete Image" to remove the current image, if applicable.
4. Upload a new banner image.
5. When you are finished, click "Save".

Remove a banner on an application page:

1. Go to Settings > Apps.
2. Click on the application page that you want to remove the default banner for - eg. Events.
3. Scroll to the bottom of the page and check the "No Banner" box.
   
4. Click 'Save'.

Add banner subtext

Add subtext to a custom page banner: 

1. Open the custom page with the banner that you want to add text to.
2. Click on the orange "Edit this page" button on the far left side of the screen.
3. Click on the orange "Options" button on the left side of the screen.
4. Click on "Miscellaneous Page Options".
5. Enter your text in the "Banner Subtext" section. This text is limited to 200 characters and will display in the banner image, underneath the page title.
6. Save your changes, and Publish your page. 

Add subtext to an application page banner (Events, Jobs, etc):

1. Log in to your admin panel and navigate to Settings > Apps > Events (or Jobs, Groups, or any other application).
2. Scroll down to the section for "App Specific Page Banner"
3. Enter your text in the "Banner Subtext" section. This text is limited to 200 characters and will display in the banner image, underneath the application's title.

*Note for Events banners: We recommend that event banners not include text in the image, because when the image scales on mobile, the text in the banner may not be legible.

---

 

What size should my banner images be?

Ideally, banner images should be 1600px wide. We recommend any image between 1200px wide and 2000px wide - smaller images will look grainy on small screens, and large images will take a long time to load, and can be a drain on mobile data for users on smartphones or tablets.

 

The height of your images will be different for each SilkStart site. Most new SilkStart sites require images 1600px x 500px wide, or proportionate to that size - eg. 1500 x 469px. If your image is too large for the recommended dimensions, scaling your image to the correct width and then cropping to the correct height will allow your image to fit into the appropriate area. You may use most image editing software to make scaling and cropping changes.

 

If you're unsure how to measure the image, check in with our support team.