Management Center: Migrating <a href="http://www.setgetweb.com/p/commerce7/com.ibm.commerce.management-center_customization.doc/concepts/ctfcmcui.htm">Management Center user interface</a> files to support new store functions and store style settings

Migrate > Take the first steps after WebSphere Commerce migration > Migrating store data

Migrate Management Center user interface files to support new store functions and store style settings

You must manually migrate Management Center user interface files to ensure that the site is configured to support the new store function and store style settings available with the Store Management tool in Management Center.

Before you begin

Ensure that you have run the store functions migration utility to migrate store functions and store style from WebSphere Commerce Accelerator to Management Center.

The Management Center user interface code is stored in the WCDE_installdir\workspace\LOBTools\WebContent\config\commerce\store\propertiesViews\storedir\StoreFlexFlowPropertiesView.def definition file. The actual user interface text that is shown in the Store Management tool is maintained in a separate properties file. The default user interface properties files are located in the WCDE_installdir\workspace\WC\properties\tools\stores\storedir\devtools\flow\ui directory.

The following sample code shows the contents of the StoreFlexFlowPropertiesView.def file used in the Madisons starter store:

<?xml version="1.0" encoding="UTF-8"?>
<!--
 =================================================================
  Licensed Materials - Property of IBM

  WebSphere Commerce 
  (C) Copyright IBM Corp. 2010 All Rights Reserved.

  US Government Users Restricted Rights - Use, duplication or
  disclosure restricted by GSA ADP Schedule Contract with
  IBM Corp.
 =================================================================
 

 
-->
<Definitions>
    
    <!--  Madisons -->
     1 
<ResourceBundle definitionName="stoFlexFlow_10001" baseName="tools.stores."Madisons".devtools.flow.ui.config" />
    
    <ObjectProperties definitionName="stoStoreProperties_10001" >
        <PropertyTabs name="tabs">
            <PropertyTabPane name="generalTab" text="${stoStoreResources.generalTabTitle}">
                <PropertyPane baseDefinitionName="stoStorePropertiesPane"/>
            </PropertyTabPane>
             2 
<PropertyTabPane name="Styles" text="${stoFlexFlow_10001}.StylesPanel.title}">
                 3 
<PropertyPane baseDefinitionName="stoStyles_10001"/>
            </PropertyTabPane>
             2 
<PropertyTabPane name="Interactions" text="${stoFlexFlow_10001.InteractionsPanel.title}">
                 3 
<PropertyPane baseDefinitionName="stoInteractionsFlexFlow_10001"/>
            </PropertyTabPane>
            <PropertyTabPane name="Registration" text="${stoFlexFlow_10001.RegistrationPanel.title}">
                <PropertyPane baseDefinitionName="stoRegistrationFlexFlow_10001"/>
            </PropertyTabPane>
            <PropertyTabPane name="Catalog" text="${stoFlexFlow_10001.CatalogPanel.title}">
                <PropertyPane baseDefinitionName="stoCatalogFlexFlow_10001"/>
            </PropertyTabPane>
            <PropertyTabPane name="Orders" text="${stoFlexFlow_10001.OrdersPanel.title}">
                <PropertyPane baseDefinitionName="stoOrdersFlexFlow_10001"/>
            </PropertyTabPane>
            <PropertyTabPane name="Checkout" text="${stoFlexFlow_10001.CheckoutPanel.title}">
                <PropertyPane baseDefinitionName="stoCheckoutFlexFlow_10001"/>
            </PropertyTabPane>
            <PropertyTabPane name="Analytics" text="${stoFlexFlow_10001.AnalyticsPanel.title}">
                <PropertyPane baseDefinitionName="stoAnalyticsFlexFlow_10001"/>
            </PropertyTabPane>
            <PropertyTabPane name="StoreLocator" text="${stoFlexFlow_10001.StoreLocatorPanel.title}">
                <PropertyPane baseDefinitionName="stoStoreLocatorFlexFlow_10001"/>
            </PropertyTabPane>
        </PropertyTabs>
    </ObjectProperties>
    
    <PropertyPane definitionName="stoAnalyticsFlexFlow_10001" >
        <PropertyGroup name="group" collapsable="false" >
            <PropertyStaticText text="${stoFlexFlow_10001.AnalyticsPanel.description}" />
            <PropertyCheckbox name="Analytics.checkbox" helpText="${stoFlexFlow_10001.Analytics.checkboxEnable.title}" promptText="${stoFlexFlow_10001.Analytics.checkboxEnable.label}" objectPath="StoreFlow[name=Analytics]" propertyName="enabled" />
        </PropertyGroup>
    </PropertyPane>
    
    <PropertyPane definitionName="stoCatalogFlexFlow_10001" >
        <PropertyGroup name="group" collapsable="false" >
            <PropertyStaticText text="${stoFlexFlow_10001.CatalogPanel.description}" />
            <PropertyCheckbox name="Search.checkbox" promptText="${stoFlexFlow_10001.Search.checkboxEnable.label}" objectPath="StoreFlow[name=search]" propertyName="enabled" />
            <PropertyCheckbox name="ProductCompare.checkbox" promptText="${stoFlexFlow_10001.ProductCompare.checkboxEnable.label}" objectPath="StoreFlow[name=ProductCompare]" propertyName="enabled" />
            <PropertyCheckbox name="InventoryAvailability.checkbox" promptText="${stoFlexFlow_10001.InventoryAvailability.checkboxEnable.label}" objectPath="StoreFlow[name=InventoryAvailability]" propertyName="enabled" />
            <PropertyCheckbox name="ProductRankings.checkbox" promptText="${stoFlexFlow_10001.ProductRankings.checkboxEnable.label}" objectPath="StoreFlow[name=ProductRankings]" propertyName="enabled" />
            <PropertyCheckbox name="BrowsingHistory.checkbox" promptText="${stoFlexFlow_10001.BrowsingHistory.checkboxEnable.label}" objectPath="StoreFlow[name=BrowsingHistory]" propertyName="enabled" />
            <PropertyCheckbox name="CategorySubscriptions.checkbox" promptText="${stoFlexFlow_10001.CategorySubscriptions.checkboxEnable.label}" objectPath="StoreFlow[name=CategorySubscriptions]" propertyName="enabled" />
        </PropertyGroup>
    </PropertyPane>
    
    <PropertyPane definitionName="stoCheckoutFlexFlow_10001" >
        <PropertyGroup name="group" collapsable="false" >
            <PropertyStaticText text="${stoFlexFlow_10001.CheckoutPanel.description}" />
            <PropertyCheckbox name="QuickCheckout.checkbox" helpText="${stoFlexFlow_10001.QuickCheckout.checkboxEnable.title}" promptText="${stoFlexFlow_10001.QuickCheckout.checkboxEnable.label}" objectPath="StoreFlow[name=quickCheckout]" propertyName="enabled" />
            <PropertyCheckbox name="Shipment.checkbox" helpText="${stoFlexFlow_10001.Shipment.checkboxEnable.title}" promptText="${stoFlexFlow_10001.Shipment.checkboxEnable.label}" objectPath="StoreFlow[name=MultipleShipments]" propertyName="enabled" />
            <PropertyCheckbox name="FutureOrders.checkbox" helpText="${stoFlexFlow_10001.FutureOrders.checkboxEnable.title}" promptText="${stoFlexFlow_10001.FutureOrders.checkboxEnable.label}" objectPath="StoreFlow[name=FutureOrders]" propertyName="enabled" />
            <PropertyCheckbox name="ShippingInstructions.checkbox" helpText="${stoFlexFlow_10001.ShippingInstructions.checkboxEnable.title}" promptText="${stoFlexFlow_10001.ShippingInstructions.checkboxEnable.label}" objectPath="StoreFlow[name=ShippingInstructions]" propertyName="enabled" />
            <PropertyCheckbox name="PromotionCode.checkbox" helpText="${stoFlexFlow_10001.PromotionCode.checkboxEnable.title}" promptText="${stoFlexFlow_10001.PromotionCode.checkboxEnable.label}" objectPath="StoreFlow[name=promotionCode]" propertyName="enabled" />
            <PropertyCheckbox name="PromotionChoiceOfFreeGift.checkbox" helpText="${stoFlexFlow_10001.PromotionChoiceOfFreeGift.checkboxEnable.title}" promptText="${stoFlexFlow_10001.PromotionChoiceOfFreeGift.checkboxEnable.label}" objectPath="StoreFlow[name=promotionChoiceOfFreeGift]" propertyName="enabled" />
            <PropertyCheckbox name="PunchoutPayment.checkbox" helpText="${stoFlexFlow_10001.PunchoutPayment.checkboxEnable.title}" promptText="${stoFlexFlow_10001.PunchoutPayment.checkboxEnable.label}" objectPath="StoreFlow[name=PunchoutPayment]" propertyName="enabled" />
        </PropertyGroup>
    </PropertyPane>
    
    <PropertyPane definitionName="stoOrdersFlexFlow_10001" >
        <PropertyGroup name="group" collapsable="false" >
            <PropertyStaticText text="${stoFlexFlow_10001.OrdersPanel.description}" />
            <PropertyCheckbox name="Orders.QuickOrder.checkbox" helpText="${stoFlexFlow_10001.Orders.QuickOrder.checkboxEnable.title}" promptText="${stoFlexFlow_10001.Orders.QuickOrder.checkboxEnable.label}" objectPath="StoreFlow[name=QuickOrder]" propertyName="enabled" />
            <PropertyCheckbox name="WishList.checkbox" helpText="${stoFlexFlow_10001.WishList.checkboxEnable.title}" promptText="${stoFlexFlow_10001.WishList.checkbox.label}" objectPath="StoreFlow[name=wishList]" propertyName="enabled" />
            <PropertyCheckbox name="MiniShopCart.checkbox" helpText="${stoFlexFlow_10001.MiniShopCart.checkboxEnable.title}" promptText="${stoFlexFlow_10001.MiniShopCart.checkbox.label}" objectPath="StoreFlow[name=miniShopCart]" propertyName="enabled" />
            <PropertyCheckbox name="OrderStatus.checkbox" helpText="${stoFlexFlow_10001.OrderStatus.checkboxEnable.title}" promptText="${stoFlexFlow_10001.OrderStatus.checkboxEnable.label}" objectPath="StoreFlow[name=TrackingStatus]" propertyName="enabled" />
        </PropertyGroup>
    </PropertyPane>
    
    <PropertyPane definitionName="stoRegistrationFlexFlow_10001" >
        <PropertyGroup name="group" collapsable="false" >
            <PropertyStaticText text="${stoFlexFlow_10001.RegistrationPanel.description}" />
            <PropertyCheckbox name="Preferences.Currency.checkbox" promptText="${stoFlexFlow_10001.Preferences.Currency.checkboxEnable.label}" objectPath="StoreFlow[name=preferredCurrency]" propertyName="enabled" />
            <PropertyCheckbox name="Preferences.Language.checkbox" promptText="${stoFlexFlow_10001.Preferences.Language.checkboxEnable.label}" objectPath="StoreFlow[name=preferredLanguage]" propertyName="enabled" />
            <PropertyCheckbox name="Demographics.Gender.checkbox" promptText="${stoFlexFlow_10001.Demographics.Gender.checkboxEnable.label}" objectPath="StoreFlow[name=Gender]" propertyName="enabled" />
            <PropertyCheckbox name="EmailOption.checkbox" promptText="${stoFlexFlow_10001.EmailOption.checkboxEnable.label}" objectPath="StoreFlow[name=EmailOption]" propertyName="enabled" />
            <PropertyCheckbox name="MobilePhoneOption.checkbox" promptText="${stoFlexFlow_10001.MobilePhoneOption.checkboxEnable.label}" objectPath="StoreFlow[name=MobilePhone]" propertyName="enabled" />
            <MultiValueCheckbox name="Demographics.AgeOptions.checkbox" promptText="${stoFlexFlow_10001.Demographics.AgeOptions.checkboxEnable.label}">
                <MultiValueSelection name="true">
                    <Xml name="values">
                        <enabled objectPath="StoreFlow[name=AgeOptions]">true</enabled>
                        <enabled objectPath="StoreFlow[name=DateOfBirth]" significant="false">true</enabled>
                        <enabled objectPath="StoreFlow[name=Age]" significant="false">false</enabled>
                    </Xml>
                </MultiValueSelection>
                <MultiValueSelection name="false">
                    <Xml name="values">
                        <enabled objectPath="StoreFlow[name=AgeOptions]">false</enabled>
                        <enabled objectPath="StoreFlow[name=DateOfBirth]" significant="false">false</enabled>
                        <enabled objectPath="StoreFlow[name=Age]" significant="false">false</enabled>
                    </Xml>
                </MultiValueSelection>
            </MultiValueCheckbox>
            <MultiValueSelector name="Demographics.AgeOptions.radios" promptText="${stoFlexFlow_10001.Demographics.AgeOptions.radio.label}" useRadioButtons="true">
                <EnablementCondition objectPath="StoreFlow[name=AgeOptions]" propertyName="enabled" enablementValue="true" /> 
                <MultiValueSelection displayName="${stoFlexFlow_10001.Demographics.DateOfBirth.radio.label}" name="dob">
                    <Xml name="values">
                        <enabled objectPath="StoreFlow[name=DateOfBirth]">true</enabled>
                        <enabled objectPath="StoreFlow[name=Age]">false</enabled>
                    </Xml>
                </MultiValueSelection>
                <MultiValueSelection displayName="${stoFlexFlow_10001.Demographics.Age.radio.label}" name="age">
                    <Xml name="values">
                        <enabled objectPath="StoreFlow[name=DateOfBirth]">false</enabled>
                        <enabled objectPath="StoreFlow[name=Age]">true</enabled>
                    </Xml>
                </MultiValueSelection>
            </MultiValueSelector>
        </PropertyGroup>
    </PropertyPane>
    
    <PropertyPane definitionName="stoInteractionsFlexFlow_10001" >
        <PropertyGroup name="group" collapsable="false" >
            <PropertyStaticText text="${stoFlexFlow_10001.InteractionsPanel.description}" />
            <PropertyCheckbox name="ProductQuickView.checkbox" helpText="${stoFlexFlow_10001.ProductQuickView.checkboxEnable.title}" promptText="${stoFlexFlow_10001.ProductQuickView.checkboxEnable.label}" objectPath="StoreFlow[name=ProductQuickView]" propertyName="enabled" />
            <PropertyCheckbox name="AjaxAddToCart.checkbox" helpText="${stoFlexFlow_10001.AjaxAddToCart.checkboxEnable.title}" promptText="${stoFlexFlow_10001.AjaxAddToCart.checkbox.label}" objectPath="StoreFlow[name=AjaxAddToCart]" propertyName="enabled" />
            <PropertyCheckbox name="CheckoutFlow.checkbox" helpText="${stoFlexFlow_10001.CheckoutFlow.checkboxEnable.title}" promptText="${stoFlexFlow_10001.AjaxCheckout.checkboxEnable.label}" objectPath="StoreFlow[name=AjaxCheckout]" propertyName="enabled" />
            <PropertyCheckbox name="MyAccount.checkbox" helpText="${stoFlexFlow_10001.MyAccount.checkboxEnable.title}" promptText="${stoFlexFlow_10001.AjaxMyAccountPage.checkboxEnable.label}" objectPath="StoreFlow[name=AjaxMyAccountPage]" propertyName="enabled" />
            <PropertyCheckbox name="ProductDnD.checkbox" helpText="${stoFlexFlow_10001.ProductDnD.checkboxEnable.title}" promptText="${stoFlexFlow_10001.ProductDnD.checkboxEnable.label}" objectPath="StoreFlow[name=ProductDnD]" propertyName="enabled" />
        </PropertyGroup>
    </PropertyPane>
    
    <PropertyPane definitionName="stoStoreLocatorFlexFlow_10001" >
        <PropertyGroup name="group" collapsable="false" >
            <PropertyStaticText text="${stoFlexFlow_10001.StoreLocatorPanel.description}" />
            <PropertyCheckbox name="StoreLocator.checkbox" promptText="${stoFlexFlow_10001.StoreLocator.checkbox.label}" objectPath="StoreFlow[name=StoreLocator]" propertyName="enabled" />
        </PropertyGroup>
    </PropertyPane>
    
    <PropertyPane definitionName="stoStyles_10001" >
        <PropertyGroup name="group" collapsable="false" >
            <PropertyStaticText text="${stoFlexFlow_10001.StylesPanel.description}" />
            <MultiValueSelector name="StylePanelOptions" promptText="${stoFlexFlow_10001.Styles.style.radio.label}" useRadioButtons="true">
                <MultiValueSelection imageSrc="/lobtools/images/stores/"Madisons"/style/styles/style1.png">
                    <Xml name="values">
                        <url objectPath="StoreFileRef[name=StyleDir]">include/styles/style1/</url>
                    </Xml>
                </MultiValueSelection>
            </MultiValueSelector>
            <MultiValueSelector name="ColorPanelOptions" promptText="${stoFlexFlow_10001.Styles.color.radio.label}" useRadioButtons="true">
                <EnablementCondition objectPath="StoreFileRef[name=StyleDir]" propertyName="url" enablementValue="include/styles/style1/" /> 
                <MultiValueSelection imageSrc="/lobtools/images/stores/"Madisons"/style/colors/color1_1.png" name="color1">
                    <Xml name="values">
                        <url objectPath="StoreFileRef[name=vfile.color]">images/colors/color1/</url>
                        <url objectPath="StoreFileRef[name=vfile.stylesheet]">css/common1_1$locale$.css</url>
                        <url objectPath="StoreFileRef[name=vfile.stylesheetie]">css/commonie1_1$locale$.css</url>
                    </Xml>
                </MultiValueSelection>
                <MultiValueSelection imageSrc="/lobtools/images/stores/"Madisons"/style/colors/color1_2.png" name="color2">
                    <Xml name="values">
                        <url objectPath="StoreFileRef[name=vfile.color]">images/colors/color2/</url>
                        <url objectPath="StoreFileRef[name=vfile.stylesheet]">css/common1_2$locale$.css</url>
                        <url objectPath="StoreFileRef[name=vfile.stylesheetie]">css/commonie1_2$locale$.css</url>
                    </Xml>
                </MultiValueSelection>
            </MultiValueSelector>
        </PropertyGroup>
    </PropertyPane>
    
</Definitions>

1 ResourceBundle: Specifies the location of the properties file that contains the user interface text. For more information on resource bundles, see Define properties files and bundle keys for user interface text.
2 PropertyTabPane: Defines a tab to show in the properties view within the Store Management tool to display store function or store style settings.
3 PropertyPane: Defines the information to show within each of the store function and store style tabs in the properties view within the Store Management tool.

The following screen capture shows how the tabs defined within the previous Madisons starter store code sample appear in the Store Management tool within Management Center: Tabbed properties view in the Store Management tool

To update the Management Center user interface files to support the new store function and style settings:

Procedure

In the StoreFlexFlowPropertiesView.def definition file, specify the location of the properties file that contains the user interface text. For example:
```
<ResourceBundle definitionName="stoFlexFlow_10001" baseName="tools.stores."Madisons".devtools.flow.ui.config" />
```

In the properties file that contains the user interface text, specify the following information:

Option Description
PropertyTabPane Define the tabs to show in the properties view within the Store Management tool to display the store function and store style settings. The following tabs are specified by default to store your store function and store style settings:

Style

Customer Interactions

Registration

Catalog

Orders

Checkout

Analytics

Store Locator

You can add a new tab to the properties view.
You can also change the order of the tabs within the properties view.
PropertyPane Define the information to show within each of the store function and store style tabs in the properties view within the Store Management tool.

Test the changes by viewing them in the Management Center, using the following URL: https://hostname:8000/lobtools.

Option	Description
PropertyTabPane	Define the tabs to show in the properties view within the Store Management tool to display the store function and store style settings. The following tabs are specified by default to store your store function and store style settings: Style Customer Interactions Registration Catalog Orders Checkout Analytics Store Locator You can add a new tab to the properties view. You can also change the order of the tabs within the properties view.
PropertyPane	Define the information to show within each of the store function and store style tabs in the properties view within the Store Management tool.

Results

The Store Management tool within Management Center can now use your migrated store function settings and store style settings.

Previous topic:

Migrate store functions and store style from WebSphere Commerce Accelerator to Management Center