Support Home Sales Website Technology Contact Us
RDP Support  


RDPWin KB Booking Engine - IRM.Net RDPWin4 & PCI Compliance Search

Added:  12/2/07
Updated: 11/14/12

IRM.Net Customization

 

The IRM.Net is configurable and customizable to a great degree. The documentation contained below is designed to be used by web programmers to configure the IRM.Net. The documentation will be self explanatory to a web programmer. Programmer support is not provided for integrating the IRM.Net. If you are not a web programmer, or you have not hired a web programmer and you would like to customize the IRM.Net, please contact Blizzard Internet Marketing, our preferred provider for IRM.Net configuration.

The IRM.Net uses themes (a combination of a skin and a style sheet) to change the colors, font face, font size on all pages.  Themes can be complicated to the average web user and should be maintained by a qualified web designer familiar with themes in order to match the IRM.Net pages with unique marketing sites. 

Themes: Group of files (CSS, Skins, Images) that define the look-and-feel of Web Pages.  Themes can get very complex and a working knowledge of HTML and web design is essential. It is best to have the web designer of your marketing site help with themes. RDP Support cannot help with the mechanics of theme changes.

Before customizing your IRM.Net using any themes or skins, Step 1 should be to update your version of IRM.Net.

Create a Custom Theme

  1. Create a new folder under c:/Inetpub/wwwroot/IRMNet/App_Themes for the new theme such as c:/inetpub/wwwroot/IRMNet/App_Themes/MyThemes.
  2. Copy all files from IRMNet/App_Themes/DefaultBlue to the new theme folder created in Step 1.  Give "write access" to the stylesheet (*.css) and skin (skin.skin) files in the new folder.
  3. Make the desired changes to the stylesheets and skin in the new theme folder.

    Note:  Any new folders created are not replaced by IRM.Net updates. Do not change the default theme files shipped by RDP. You can create additional style sheets in your custom theme folder.  All style sheets in the folder are included.

In order for the IRM.Net to use the new theme, follow the steps provided under Color Schemes.

Customizable Style Sheets

The following is a list of the customizable style sheets and a description of which areas of IRM.Net they affect.

File Name Description
1CommonStyles.css Text and label styles shared by all pages.
Calendar.css Contains styles for the availability calendars and "arrival and departure date" calendars.  Applies to calendars on both Owner and Reservation pages.
Grids.css Contains styles for the rate information grid on the Reservations page and Work Orders, Bills and Reservation list grids on the Owners pages.
MonitorStyles.css Contains styles for the IRM.Net Monitor page.
OwnerStyles.css Contains styles for text and labels specific to the Owners pages.
ResStyles.css Contains styles for text and labels specific to the Reservations pages and for indicating colors to be used on the available rooms list.
RoundedBoxes.css Contains styles for coloring the rounded boxes that frame various sections on all pages.
Skin.skin Identifies button images to be used on the Reservations pages.

Also see:

Custom Theme Per Property Code

The IRM.Net can have custom theme per property code when the property code is pass through from the marketing website.  The marketing website must pass in the property code parameter: /irmnet/res/resmain.aspx?propertycode=01.

This feature requires that the property code drop down NOT display.  This is due to the theme being passed from the marketing website. The IRM.Net does not allow changing the theme on the fly because the stylesheet has already loaded.

To configure different themes per property code:

  1. Create the custom for each applicable property code.  See Create Custom Theme for more information.
  2. In RDPWin, go to the System main menu --> Table Maintenance --> select Table W0-IRM Settings
  3. Click Add Subrecord.
  4. In the Subrecord field, enter THEM<xx>, where <xx> is the property code. For example, if a custom theme was created for property 02, the subrecord would be THEM02.
  5. In the data field, enter the theme name.
  6. Save & Close.

Change Button Images

The images used to display the buttons on the IRM.Net Reservations pages can be changed.  The button images referenced in the RDP themes reside in the IRMNet/App_Themes/<theme_name>/Images/Buttons folder.  RDP recommends creating a new folder for any custom button images; since future IRMNet updates may overwrite the contents of the RDP Buttons folders.  For example, create a folder IRMNet/App_Themes/MyTheme/Images//zButtons for the new custom button images.

Each button on the Reservations pages is identified by a SkinID.  Modify the skin.skin file in the new theme folder and change the ImageURL property for the buttons to reference the new button images.

Button IDs and Locations
Button SkinID Location Button Image for DefaultBlue Theme
ibtnCheckAvail Search for Availability button at the bottom of  the search criteria panel on Res/ResMain.aspx /IRMNet/App_Themes/DefaultBlue/Images/Buttons/SearchAvailability.png
ibtnReserve Reserve button in the available rooms list on Res/ResMain.aspx /IRMNet/App_Themes/DefaultBlue/Images/Buttons/Reserve.png
ibtnLogin Log In button on the reservation entry page, Res/ResEntry.aspx /IRMNet/App_Themes/DefaultBlue/Images/Buttons/Login.png
ibtnRecoverPassword Recover Password button, shows after clicking Forgot Your Password link on reservation entry page, Res/ResEntry.aspx /IRMNet/App_Themes/DefaultBlue/Images/Buttons/RecoverPassword.png
ibtnNewSearch New Search button on the reservation entry page, Res/ResEntry.aspx /IRMNet/App_Themes/DefaultBlue/Images/Buttons/NewSearch.png
ibtnMakeRes Make Reservation button at the bottom of the reservation entry page, Res/ResEntry.aspx /IRMNet/App_Themes/DefaultBlue/Images/Buttons/Reserve.png
ibtnMakeRes2 Make Reservation button within the Reservation Summary section on the reservation entry page, Res/ResEntry.aspx /IRMNet/App_Themes/DefautlBlue/Images/Buttons/Reserve.png
ibtnMakeAnotherRes Make Another Reservation button on the confirmation page (after making a res), Res/Confirm.aspx /IRMNet/App_Themes/DefaultBlue/Images/Buttons/MakeAnotherRes.png
ibtnReturn Home button on the confirmation page (after making a res), Res/Confirm.aspx /IRMNet/App_Themes/DefaultBlue/Images/Buttons/Home.png
hlReserve Reserve button on RoomDetailsPages.aspx - page only used if navigating directly to a specific room page from the marketing web site. /IRMNet/App_Themes/DefaultBlue/Images/Buttons/Reserve.png

Change Rounded Boxes for Modern Browsers (IE 9 or Higher) Using CSS3

The colored, rounded boxes framing various sections on the IRM.Net pages are accomplished with the use of CCS3. Modern browsers such as Firefox, Chrome, Safari, and IE 9 support CCS3.  When viewing these boxes from IE 8 or earlier, the boxes appear to be square.

Reservation Pages
Rounded Box
Class Name
Page Location
RoundedBox1 Res/ResMain.aspx Search criteria panel
RoundedBox2 Res/ResMain.aspx Available rooms list
RoundedBox3 Res/ResEntry.aspx Login & Reservation summary panels
RoundedBox4 Res/ResEntry.aspx Guest information entry sections (name/address, email/credit card)
RoundedBoxGuestComments Res/ResEntry.aspx Guest information entry of comment drop-downs, if configured to use them
RoundedBox5 Res/Confirm.aspx Reservation confirmation information (after reservation is made)
RoundedBox6 Res/RoomDetailsPages.aspx Page only used if navigate directly to room detail for a specific room

Owner Pages
Rounded Box
Class Name
Page Location
LoginBox1 Owner/OwnerLogon.aspx Owner number/password box and Forgot password box
NewsletterBox1 Owner/OwnerNewsletter.aspx Box around newsletter choices
OwnerDetailBox1 Owner/OwnerDetail.aspx Name/address, etc information on owner detail
OwnerDetailBox2 Owner/OwnerDetail.aspx Recurring charges information on owner detail
MakeResBox1 Owner/OwnerRes.aspx Dates/people selections on make reservation
MakeResBox2 Owner/OwnerRes.aspx Name/address information on make reservation
AddWorkOrderBox1 Owner/OwnerAddWorkOrder.aspx Box around work order information
StatementsBox1 owner/OwnerStatement.aspx Box around statement choices
PaymentBox1 Owner/OwnerPayment.aspx Permanent information
ConfirmationBox1 Owner/OwnerConfirm.aspx confirmation information

Below is an example of CSS rounded corners for solid color boxes. Note: It's the last line that rounds the corners where the border-radius is specified. This sample is a taken from the RDP DefaultBlue theme.

.RoundedBox1 {
background: #94b2d4;
margin: 0 0px 0 10px;
padding: 10px 5px 5px 5px;
border-radius: 10px; -moz-border-radius: 10px; -webkit-boder-radius: 10px;

Below is an example of CSS rounded corners with a light colored box and darker border around it. Note: There are additional attributes for this option. This example is taken from the RDP IslandBlue theme.

.RoundedBox1 {
background: #cfe6f8;
border: 3px solid #1a4093;
margin: 0 0px 0 10px;
padding: 10px 5px 5px 5px;
border-radius: 10px; -moz-border-radius: 10px; -webkit-boder-radius: 10px;

Change Rounded Boxes for Older Browsers (IE 8 and Earlier)

The information listed in this section is to change rounded boxes for older browsers such as IE 8 and earlier. Modern browsers that support CSS3 (Chrome, Firefox, Safari, and IE 9) can utilize CSS to change the boxes. See the section above - Change Rounded Boxes for Modern Browsers for details.

The colored boxes framing various sections on the IRM.Net pages are accomplished with HTML <DIV> tags and the colors can be customized.  Optionally, image files can be used to create the rounded corners on the boxes. The website http://www.roundedcornr.com generates corner images to accomplish this effect.  A small fee is required for the use of the generated images.

Reservation Pages
Rounded Box
Class Name
Page Location
RoundedBox1 Res/ResMain.aspx Search criteria panel
RoundedBox2 Res/ResMain.aspx Available rooms list
RoundedBox3 Res/ResEntry.aspx Login & Reservation summary panels
RoundedBox4 Res/ResEntry.aspx Guest information entry sections (name/address, email/credit card)
RoundedBoxGuestComments Res/ResEntry.aspx Guest information entry of comment drop-downs, if configured to use them
RoundedBox5 Res/Confirm.aspx Reservation confirmation information (after reservation is made)
RoundedBox6 Res/RoomDetailsPages.aspx Page only used if navigate directly to room detail for a specific room

Owner Pages
Rounded Box
Class Name
Page Location
LoginBox1 Owner/OwnerLogon.aspx Owner number/password box and Forgot password box
NewsletterBox1 Owner/OwnerNewsletter.aspx Box around newsletter choices
OwnerDetailBox1 Owner/OwnerDetail.aspx Name/address, etc information on owner detail
OwnerDetailBox2 Owner/OwnerDetail.aspx Recurring charges information on owner detail
MakeResBox1 Owner/OwnerRes.aspx Dates/people selections on make reservation
MakeResBox2 Owner/OwnerRes.aspx Name/address information on make reservation
AddWorkOrderBox1 Owner/OwnerAddWorkOrder.aspx Box around work order information
StatementsBox1 owner/OwnerStatement.aspx Box around statement choices
PaymentBox1 Owner/OwnerPayment.aspx Permanent information
ConfirmationBox1 Owner/OwnerConfirm.aspx confirmation information

To change a solid colored box (i.e., RoundedBox4 which is used on the reservation entry page ResEntry.aspx):

  1. To change the background color of the box, change RoundedBoxes.css in the desired theme folder (IRMNet/App_Themes/themename).  Find the section with the style name .RoundedBox4 and set the background color to the desired color.  The style should look like this, with the desired color specified:
  2. .RoundedBox4 {
    background
    : #CCCCCC;
    margin
    : 0 0px 0 10px;
    }

  3. To add rounded corners, create the image files for the four corners of the box and save them in the Images folder in your theme (for example IRMNet/App_Themes/MyTheme/Images).  The images supplied by RDP were generated at http://www.roundedcornr.com.

    Specify the corner radius (smaller number is a sharper curve) and colors. For example:
    Corner Radius: 15
    background color: FFFFFF (should match the background color of your page)
    Box color: CCCCCC
    Then click 'Generate RoundedCornr'
    At the bottom of the page, download the four corner image created (one for each corner of the box) into your theme's Images folder. The HTML and CSS code listed can be ignored as it is already in the stylesheet and pages.  RoundedCornr.com does request a small fee for the use of the generated images.

    Finally, in your RoundedBoxes.css stylesheet, modify the URL for each of the four corner images to reference the new image files just created. For example, the styles for RoundedBox4 should now look like (with the new Theme folder specified where this sample indicates 'MyTheme' and the new image names specified as they were saved):
    .RoundedBox4 {
    background: #94b2d4;
    margin: 0 0px 0 10px;
    }

    .RoundedBox4
    td {
    padding: 0px 3px 0px 3px;
    }

    .RoundedBox4Top
    div {
    background: url(/IRMNet/App_Themes/MyTheme/Images/new_tl.htm) no-repeat top left;
    }

    .RoundedBox4Top
    {
    background: transparent url(/IRMNet/App_Themes/MyTheme/Images/new_tr.htm) no-repeat top right;
    }

    .RoundedBox4Bottom
    div {
    background: url(/IRMNet/App_Themes/MyTheme/Images/new_bl.htm) no-repeat bottom left;
    }
    .
    RoundedBox4Bottom
    {
    background: transparent url(/IRMNet/App_Themes/MyTheme/Images/new_br.htm) no-repeat bottom right;
    }
    .
    RoundedBox4Top
    div, .RoundedBox4Top,.RoundedBox4Bottom div, .RoundedBox4Bottom {
    width: 100%;height: 15px;
    }

Style Details

Click the links below for detailed information on styles effecting items on each IRM.Net page, as shown in this example.  Once a style name is known, see the name/stylesheet cross-reference to determine in which stylesheet to find the style.  All stylesheets reside in the /IRMNet/App_Themes/<theme_name>/ folder.

IRM.Net Res Page Style Details
ResMain.aspx ResMain
Buttons
ResEntry.aspx ResEntry
Buttons
Confirm.aspx Confirm
Buttons
RoomDetailsPage.aspx RoomDetails
RoomDetailsCalendar
RoomDetailsRates
Buttons
Monitor.aspx Monitor
IRM.Net Owners Page Style Details
OwnerLogon.aspx OwnerLogon
OwnerNewsletter.aspx OwnerNewsletter
OwnerCalendar.aspx OwnerCalendar
CalendarStyles
OwnerDetail.aspx OwnerDetail
OwnerResList.aspx OwnerResList
OwnerRes.aspx OwnerRes
OwnerWorkOrders.aspx OwnerWorkOrders
OwnerAddWorkOrder.aspx OwnerAddWorkOrder
OwnerBills.aspx OwnerBills
OwnerStatement.aspx OwnerStatement
OwnerPayment.aspx OwnerPayment

Style Names and Associated Style Sheets

The colors, font type and sizes of many feature of the IRM.Net pages can be customized by changing their associated styles.

Below is an alphabetical list of style names and style sheet in which they are found.  Style sheets are found in the theme folder: c:/inetpub/wwwroot/IRMNet/App_Themes/<ThemeName>.

Style Name Style Sheet
AddWorkOrderBox1 RoundedBoxes.css
a:hover 1CommonStyles.css
a:link 1CommonStyles.css
a:visited 1CommonStyles.css
CalendarBackgroundGuestOfOwner Calendar.css
CalendarBackgroundMaint Calendar.css
CalendarBackgroundOccupied Calendar.css
CalendarBackgroundOwner Calendar.css
CalendarBackgroundVacant Calendar.css
CalendarMonth Calendar.css
CalendarOffDay Calendar.css
CalendarWeekDay Calendar.css
ConfirmationBox1 RoundedBoxes.css
ConfirmationHeading ResStyles.css
ConfirmationLabel ResStyles.css
ConfirmationText ResStyles.css
Copyright 1CommonStyles.css
ErrMsg 1CommonStyles.css
ErrMsgSmall 1CommonStyles.css
GridAlternateRow Grids.css
GridHeader Grids.css
GridRow Grids.css
HyperlinkLabel 1CommonStyles.css
Label 1CommonStyles.css
LabelBold 1CommonStyles.css
LabelSmall 1CommonStyles.css
LoginBox1 RoundedBoxes.css
LongDescHRule ResStyles.css
MakeResBox1 RoundedBoxes.css
MakeResBox2 RoundedBoxes.css
MonitorBox1 MonitorStyles.css
MonitorBox1 a:hover MonitorStyles.css
MonitorBox1 a:link MonitorStyles.css
MonitorBox1 a:visited MonitorStyles.css
MonitorLabel MonitorStyles.css
MonitorTitle MonitorStyles.css
MonitorVersionLabel MonitorStyles.css
NewslettersBox1 RoundedBoxes.css
OwnerAddWOLabel OwnerStyles.css
OwnerDatesPeopleLabel OwnerStyles.css
OwnerDetailBox1 RoundedBoxes.css
OwnerDetailBox2 RoundedBoxes.css
OwnerDetailLabel OwnerStyles.css
OwnerDetailSubTitle OwnerStyles.css
OwnerHeaderLabel OwnerStyles.css
OwnerHeaderText OwnerStyles.css
OwnerLogonLabel OwnerStyles.css
OwnerLogonTitle OwnerStyles.css
OwnerPaymentLabel OwnerStyles.css
OwnerResLabel OwnerStyles.css
OwnerResSubTitle OwnerStyles.css
OwnerResTitle OwnerStyles.css
OwnerStatementsLabel OwnerStyles.css
PaymentBox1 RoundedBoxes.css
PaymentBox2 RoundedBoxes.css
RatesListTitle ResStyles.css
ResLoginLabel ResStyles.css
ResSummaryHeading ResStyles.css
ResSummaryText ResStyles.css
RoomDetailsHeader ResStyles.css
RoomDetailsHeader a:hover ResStyles.css
RoomDetailsHeader a:link ResStyles.css
RoomDetailsHeader a:visited ResStyles.css
RoomDetailsTitle ResStyles.css
RoomListAlternateRow ResStyles.css
RoomListFooter ResStyles.css
RoomListFooter a:hover ResStyles.css
RoomListFooter a:link ResStyles.css
RoomListHeader ResStyles.css
RoomListHeader2 ResStyles.css
RoomListLabel ResStyles.css
RoomListRow ResStyles.css
RoundedBox1 RoundedBoxes.css
RoundedBox2 RoundedBoxes.css
RoundedBox3 RoundedBoxes.css
RoundedBox4 RoundedBoxes.css
RoundedBox5 RoundedBoxes.css
RoundedBox6 RoundedBoxes.css
RoundedBoxGuestComments RoundedBoxes.css
StatementsBox1 RoundedBoxes.css

Calendar Styles
(Calendar.CSS)


Arrival/Departure Date Drop-downs
CalendarMonth The title area containing the month name
CalendarWeekDay The day of the week headings

Availability Calendar on Availability Rooms List
CalendarMonth The title area containing the month name
CalendarWeekDay The day of the week headings
CalendarOffDay A day in the previous or next month
CalendarBackgroundVacant A day where the room is available
CalendarBackgroundOccupied A day where the room is unavailable
CalendarBackgroundVacantThisRes Currently requested dates where room is available
CalendarBackgroundOccupiedThisRes Currently requested dates where room is unavailable

Note: If changes are made to the calendar background colors, a legend can be created to help guests identify which color indicates available vs. unavailable. The HTML legend file resides on the IRM.Net server in C:\INETPUB\WWWROOT\IRMNet\Custom\<RDP Server>\RDP<xx>\UserText\ResCalendarLegend.htm. Include the custom legend in place of the standard one.

Available Room List Styles
(ResStyles.CSS)


Room List Styles
RoomListHeader The title at the top of the available rooms list. If using the rounded box around the rooms list, the RoomListHeader background color should match that of the RoundedBox2 style in RoundedBoxes.css.
RoomlistHeader2 The subtitle at the top of the available rooms list
RoomListHeaderNotAvail The text that appears at the top of the available rooms list when no rooms are available matching the search criteria requested
RoomListLabel The heading in each room row with the room type and/or room number
RoomListFooter The footer at the bottom of the available rooms list. If using the rounded box around the rooms list, the RoomListFooter background color should match that of the RoundedBox2 style in RoundedBoxes.css.
RoomListRow Every other row in the room list
RoomListAlternateRow The alternate rows in the room list

Grid Styles
(Grids.CSS)
GridHeader The column header line in grid
GridRow Applied to every other row
GridAlternateRow applied to alternate rows


Support Home  RDPWin4 & PCI Compliance Enhancement Requests Open A Web Support Ticket
Training New Sales Website Old Sales Website Contact Us

 Facebook     Twitter      LinkedIn   TODF