Build Customized Landing Pages

Clinical Studio allows the Website Host or Study Designer to create their own customized landing pages. These pages can be created using the Build Web Page… link accessed from the Website Host or Study menus. Customized Landing pages are the standard pages that all users see in the system. They are pages that offer only static content; however, that content can be totally customized by the Website Host or Study Designer. There are four landing pages in the system.

  1. Index – This is the first page a user sees. It is usually presented prior to a user signing in to the system. When Clinical Studio sends the URL via notification to users, this is the page they land on first.
  2. Home – This is the home page. Users signing in to your site will land on this page when they have successfully entered their e-mail and password. They also land on this page when the Home button is clicked in the Page Header area.
  3. Sign Out – When a user clicks the Sign Out link in the Page Header area, they land on this page. They also land on this page when their session has expired.
  4. Contact Us – When a user clicks the Contact Us link in the Account Menu, they will be brought to this page. This page should supply all necessary contact information for the user in case they need to contact you, the Website Host or Study Designer.


Customized Themes Are Required

The four landing pages can be customized to include the content you desire. However, if you want to build customized landing pages then uploading a customized theme is required. Customized landing pages are all related to your customized theme and cannot be changed until that theme has been uploaded. Please see the Theme Manager help document for more information.


 


Accessing the Web Page Builder

To access the Web Page Builder, you must have the right granted to your role and you must have uploaded a customized theme. If both those conditions have been satisfied, then the Web Page Builder can be accessed by selecting theBuild Web Page… link from the Website Host or Study menu as shown in the following figures.

 



The figure below shows and explains the Web Page Builder application.

 

 


Creating Web Pages

When creating web pages, it is very important to remember this rule: add your web page content first and then format the content to achieve the look and feel you desire. The editor is available in any browser. However, because of that, we highly recommend that you follow this rule because it will save you time and make your experience more enjoyable.

The basic process for creating a new web page is as follows:

1.      Identify the type of landing page to create (Index, Home, Contact Us, Sign Out).

2.      Click the Create New Web Page link, located just above the Existing Web Pages table.

3.      Enter the Page Name, Page Type and Theme.

4.      Create the Web Page HTML code in the Web Page Designer.

5.      Save the Web Page by clicking the Save Page button located in the Create or Edit Web Page form.

The basic process for editing an existing web page is as follows:

1.      Identify the web page to edit.

2.      Click the corresponding Edit link in the Existing Web Pages table.

3.      Make all desired changes in the Web Page Designer.

4.      Save the Web Page by clicking the Save Page button located in the Create or Edit Web Page form.


Web Page Designer

The Web Page Designer is a graphical tool that allows users to create customized web pages by selecting tools from the toolbar and placing formatted text, graphics and links on the web page. The following figure shows the Web Page Designer and describes some of the tools located in the toolbar.

 

 





One very handy tool is the ability to create web pages graphically or type the HTML in directly. Typing the HTML in directly allows you to tap into your customized themes and use the text color. For example, the following Headertags use the main theme text color.

<h1>This is a big header that uses the theme color</h1>

<h2> This is a smaller header that uses the theme color</h2>

<h3> This is a smaller header that uses the theme color</h3>

These tags are only available in the HTML Editor.


The Four Landing Pages

The purpose for creating custom web pages is to display the pages when the user lands in a certain area. The following describes the four landing pages that will display your web page designs.


Index

The link that is sent to users when they are registered to use the system, prior to signing in is:

https://www.clinicalstudio.com/Pages/Index.aspx

When the user lands on this page, by clicking the link that the system sends, the page displayed will be the customized Index web page that you created.


Home

After a user signs in to the system, they will be directed to the Home Page. This page will display the customized Home page you designed. In addition, when the Home Link in the Page Header area is clicked, the user will land on the Home Page which will display the customized Home page you designed.


Contact Us

When the user clicks the Contact Us link in the Account menu, the Contact Us page that you created will be displayed. It should contain all the necessary information for your users to contact you.


Sign Out

When the user clicks the Sign Out link in the Page Header area, the Sign Out page is displayed. The HTML text displayed on this page will contain the customized information you designed as well.