Installing a custom banner image on the "SAS - Motian" theme

The "SAS-Motian" theme features a banner image on the front page:

The two "flavors" of SAS-Motian each offer a different image of Penn's campus. But a user can also place a custom banner image on their front page if they wish.

It will take a little bit of advance preparation: you need to have an image that is already sized to 900 pixels wide by 268 pixels high. Once you have that, follow the directions below:

1. Create a custom widget to hold your image. To do this, on the layout page, choose "add new widget" (the green tab at the top right of the widgets box).

2. From the drop-down menu, under "media," choose "single image."

3. A dialog box will open. Name your widget in the first box; add a title only if you want it to display on the webpage. Browse to your image and select it in the next box. Change "image size" to "900 px." The rest is optional. Click save.

4. Click save again when you are returned to the layout page. Make sure that "site selection" is set to "front page." Find your widget in the widget selector box, and drag it to the long narrow horizontal section of the page layout where you might otherwise put a horizontal menu. Save your changes.

Your new banner image will now overlay the default banner in the theme.

Two further notes about the SAS-Motian theme:

  • Because of the way OpenScholar works, it's not possible to put a horizontal menu beneath the banner image on the front page; OpenScholar will only accommodate a horizontal menu above the banner image. (You can see how this works by putting both the primary menu and your custom widget into the same section of the layout. It's okay to play around with the layout a little; that's the only way to figure out how OpenScholar works.)  It is also possible to use a horizontal menu just on the front page.
  • The theme is designed to display the banner image only on the front page, not on the inside pages, where it would take up a lot of space that is normally devoted to content.