Default Shell for Online Registrations

We use Bootstrap as our styling framework for online registrations. See note at bottom of page for more about Bootstrap.

We have included the HTML code for a sample shell that can be used as a starting point for creating a Bootstrap shell for your church. Just follow the instructions below.

How to Create a Shell

Step 1

Go to Administration > Setup > Special Content > HTML Content click New HTML File button and name the file ShellDefaultBs

The name is important; since, by convention, that is what the system will look for unless you specifically point to a different file.

Step 2
Click the Source button on the editor. Then copy the code below (See Sample Shell below) and paste it into the editor. Click Source again and then click Save.

Tip

You can click the view raw link in the bar below the code to make it easy to copy all the code.

Important

The code below is just a sample. You will want to:

Image

The image in our sample is quite large (1920 x 397). However, it is sized on-the-fly with a width of 100%, so that it fits whatever container it is in (like an iPhone). You will want to do the same with your image. Take note of our image size and shape as an example.

Other Shells

If you want to use a custom shell for just one registration, you can create that shell as you did the default shell, giving it a different name. Then enter that name in the HTML Shell textbox on the Registration > Registration tab of the organization.

Caution

If you are experimenting with a shell, and already have existing registrations using that shell, you should copy it and refer to the copy in your test organization. Otherwise, you will be affecting live registrations every time you save.

Sample Shell for Bootstrap

A note about Bootstrap

Bootstrap is a very popular web page style framework. Not only does it have a nice clean look and can be customized, it is known for making your web page easy to use on a mobile device. We use this as our default for online registrations, not only because it looks great, but also because of the tremendous benefits for mobile users.

This is from the Bootstrap web site.

Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.

© 2018 TouchPoint Software, LLC.  All rights reserved.