Creating Page Fragment head.htm (SAP Library

Creating Page Fragment head.htm

Prerequisites

Tutorial 3 explains how you can use page fragments. The following sections contain information on creating page fragments as well as include directives.

Creating Page Fragments

Layout for the First Page

Procedure

Create page fragment head.htm as described in Tutorial 3 Our First Online Bookshop. So that the HTMLB design matches the other views, change the coding in the page fragment layout as follows:

<%@extension name="htmlb" prefix="htmlb" %>

<htmlb:group title = "Welcome!"

bodyColor = "Whitesmoke"

width = "100%" >

<htmlb:groupBody>

<htmlb:image src = "book2.jpg"

height = "80" /> </td>

<htmlb:textView text = "mySAP Bookshop"

encode = "TRUE"

design = "HEADER1"

textColor = "darkblue" /> </td></tr></table>

</htmlb:groupBody>

</htmlb:group>

Use HTMLB element group to give the header a uniform background color.

This group then contains the book picture as well as the title text. To set both elements centered vertically, they are also put in a normal HTML table.

How you can use the Web Application Builder with BSP extensions and the Tag browser to use the elements in your page is described in Using BSP Elements.

Result

You have now created a page header for the bookshop that looks like this:

This graphic is explained in the accompanying text

Now create the controller for the book search: Creating Controller search.do for the Search