Sample: Loading Commerce Composer layouts

This sample demonstrates how to load Commerce Composer layouts for use in the Commerce Composer tool and on the storefront.

Before you begin

This sample requires a published store that is based on the Aurora starter store and the Commerce Composer tool. Ensure that the following tasks are complete:

About this sample

A Commerce Composer layout is an arrangement of layout widgets within a layout template that is used to render a store page. A layout contains one or more widgets that are placed in specific slots in the template. The properties (name-value pairs) of each widget are set to specific values. To create a layout, you can use the Data Load utility to load the layout information into the HCL Commerce database.

When you load the input files within this sample, you load information to create a layout, including the layout template, layout template container, slots, and assign widgets into the slots. Specifically, this sample loads five layouts
  • SampleHomePageLayout
  • SampleStaticContentLayout
  • SampleDepartmentPageLayout
  • SampleContentPageLayout
  • SampleDefaultContentPageLayout
The SampleDefaultContentPageLayout is loaded as a default layout for pages that are viewed on desktop, notebook, and tablet computers. This layout does not display within Management Center and cannot be edited. When a user creates a content page, the page is automatically assigned the SampleDefaultContentPageLayout layout until the user assigns a different layout to the page. The other four layouts in this sample are not default layouts and can be used for any page.

For more information about Commerce Composer layouts and the components that make up a layout, see Commerce Composer layout architecture.

You can load the information for this sample in both CSV or XML formatted input files. The following procedure, however, loads only the CSV input files. If you prefer to work with the data within the XML formatted files, you can edit the sample configuration files to use the XML files. The sample input files are located within the following directory:
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/layout
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\layout
This sample also loads input files that are included as part of the sample for loading Commerce Composer layout templates. The input files for that sample are located within the following directory:
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/template
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\template
For more information about the sample for loading Commerce Composer layout templates, see Sample: Loading Commerce Composer layout templates.

If you are using this sample to help you load Commerce Composer layout information that exists in another instance, you can use the Data Extract utility to generate the input files for loading your layout data. You can use the Data Extract utility to extract the existing layout data. Then, you can edit configuration files for this sample to load the files that are generated by the Data Extract utility. For a sample that demonstrates how to use the Data Extract utility to extract layout data, see Sample: Extracting Commerce Composer layouts.

Input source files for loading Commerce Composer layouts. This table also lists the business object mediators that are used by the Data Load utility to load the layout data.
Sample input file Description
CSV
  • layout.csv
XML
  • layout.xml

For more information about the data that is included in this file, see layout input file

The Data Load utility uses this sample input file to load layout templates and layouts into a store so that Management Center users can use the layouts in the Commerce Composer tool

The Data Load utility loads the information within the input file into the PAGELAYOUT, and PLTEMPLATEREL database tables. The Data Load utility uses the following business object mediator and business object configuration file to load the data within this input file:

Business object mediator

com.ibm.commerce.pagelayout.dataload.mediator.LayoutMediator

Business object configuration file
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/wc-loader-pagelayout.xml
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\wc-loader-pagelayout.xml
CSV
  • layoutWidgetRelationship.csv
XML
  • layoutWidgetRelationship.xml

For more information about the data that is included in this file, see layoutWidgetRelationship input file

This sample input file loads a layout template container and adds widgets into the layout template slots to create a layout.

The Data Load utility loads the information within the input file into the PLWIDGET, and PLWIDGETREL database tables. The Data Load utility uses the following business object mediator and business object configuration file to load the data within this input file:

Business object mediator

com.ibm.commerce.pagelayout.dataload.mediator.WidgetMediator

Business object configuration file
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/wc-loader-widget.xml
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\wc-loader-widget.xml
CSV
  • subscribeWidgetdef.csv
XML
  • subscribeWidgetdef.xml

For more information about the data that is included in this file, see subscribeWidgetdef input file

This sample input file loads information to subscribe widgets and template containers to a store. To subscribe a store to a widget, the widget must be registered within the HCL Commerce database and Commerce Composer framework. A store must subscribe to specific widgets and containers so that these objects can be used in the Commerce Composer tool for that store. The widgets that are used in this sample are registered by default when you enable the Commerce Composer tool.
This sample loads two subscribeWidgetdef.csv files:
  • The subscribeWidgetdef.csv file within the layout directory loads the information to subscribe widgets to a store.
  • The subscribeWidgetdef.csv file within the template directory loads the information to subscribe a layout template to a store. This subscribeWidgetdef.csv file is also loaded as part of the sample for loading a Commerce Composer layout template.
The order that the Data Load utility loads the information within these input files is defined within the wc-dataload-layout.xml load order configuration file. The subscribeWidgetdef.csv file within the template loads before the file within the layout directory.

The Data Load utility loads the information within the input file into the PLSTOREWIDGET database table. The Data Load utility uses the following business object mediator and business object configuration file to load the data within this input file:

Business object mediator

com.ibm.commerce.pagelayout.dataload.mediator.SubscribeWidgetDefinitionMediator

Business object configuration file
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/wc-loader-subscribeWidgetdef.xml
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\wc-loader-subscribeWidgetdef.xml
CSV
  • widgetnvp.csv
XML
  • widgetnvp.xml

For more information about the data that is included in this file, see widgetnvp input file

This sample input file loads information to set the properties of the widgets that included in the slots for the layout that you are loading with this sample.

The Data Load utility loads the information within the input file into the PLWIDGETNVP database table. The Data Load utility uses the following business object mediator and business object configuration file to load the data within this input file:

Business object mediator

com.ibm.commerce.pagelayout.dataload.mediator.WidgetNVPMediator

Business object configuration file
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/wc-loader-widgetnvp.xml
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\wc-loader-widgetnvp.xml
CSV
  • registerWidgetdef.csv
XML
  • registerWidgetdef.xml

For more information about the data that is included in this file, see registerWidgetdef input file

This sample input file loads information to register a new widget or template container for use in the Commerce Composer tool. In this sample, the input file loads information to register the template containers for the layout.

This input file is also loaded as part of the sample for loading a Commerce Composer layout template.

The Data Load utility loads the information within the input file into the PLWIDGETDEF, and PLWIDGETDEFDESC database tables. The Data Load utility uses the following business object mediator and business object configuration file to load the data within this input file:

Business object mediator

com.ibm.commerce.pagelayout.dataload.mediator.registerWidgetdefMediator

Sample business object configuration file for loading this information:
  • Linuxutilities_root/samples/DataLoad/PageComposer/wc-loader-registerWidgetdef.xml
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\PageComposer\wc-loader-registerWidgetdef.xml
CSV
  • template.csv
XML
  • template.xml

For more information about the data that is included in this file, see template input file

This sample input file loads information that defines a template that can be used to create a layout.

This input file is also loaded as part of the sample for loading a Commerce Composer layout template.

The Data Load utility loads the information within the input file into the PAGELAYOUT database table. The Data Load utility uses the following business object mediator and business object configuration file to load the data within this input file:

Business object mediator

com.ibm.commerce.pagelayout.dataload.mediator.WidgetMediator

Business object configuration file
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/wc-loader-template.xml
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\wc-loader-template.xml
CSV
  • slotDefinition.csv
XML
  • slotDefinition.xml

For more information about the data that is included in this file, see slotDefinition input file

This sample input file loads information to define the slots within a container for a specific template. Each slot is defined with x and y coordinates.

This input file is also loaded as part of the sample for loading a Commerce Composer layout template.

The Data Load utility loads the information within the input file into the PLWIDGETSLOT database table. The Data Load utility uses the following business object mediator and business object configuration file to load the data within this input file:

Business object mediator

com.ibm.commerce.pagelayout.dataload.mediator.WidgetSlotsMediator

Business object configuration file
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/wc-loader-widgetslot.xml
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\wc-loader-widgetslot.xml

Procedure

  1. HCL Commerce DeveloperOn a command line, go to the WCDE_installdir\bin directory.
  2. LinuxOpen a command line in the . Change the directory to utilities_root/bin directory. For information about entering and leaving containers, see Running utilities from the Utility server Docker container.
  3. Enter the following command to run the sample data load order file for a Commerce Composer layout and load the information for this sample:
    • Linux./dataload.sh ../samples/DataLoad/CommerceComposer/layout/wc-dataload-layout.xml
    • HCL Commerce Developerdataload ..\samples\DataLoad\CommerceComposer\layout\wc-dataload-layout.xml
    The load order configuration file identifies the order that the Data Load utility loads the sample CSV files. The load order file also identifies the appropriate business object configuration file to use to load each input file. For more information about load order configuration files, Configuring the data load order.

    For more information about configuring and running the Data Load utility, see Configuring and running the Data Load utility.

Verifying results

Verify that the Commerce Composer tool layout information is loaded by reviewing the data load summary report. For more information about the location and contents of this summary report, see Verifying the results of the data load.

You can also verify that the sample data is loaded by running the following SQL statements against your WebSphere Commerce database:
select * from PLWIDGETDEF where IDENTIFIER like 'Sample%';
select * from PLWIDGETDEFDESC where PLWIDGETDEF_ID in (select PLWIDGETDEF_ID from PLWIDGETDEF where IDENTIFIER 
like 'Sample%');
select * from PLSTOREWIDGET where PLWIDGETDEF_ID in (select PLWIDGETDEF_ID from PLWIDGETDEF where IDENTIFIER 
like 'Sample%');
select * from PAGELAYOUT where name like 'Sample%';
select * from PLTEMPLATEREL where PAGELAYOUT_ID in (select PAGELAYOUT_ID from PAGELAYOUT where NAME 
like 'Sample%');
select * from PLWIDGET where PAGELAYOUT_ID in (select PAGELAYOUT_ID from PAGELAYOUT where name 
like 'Sample%');
select * from PLWIDGETREL where PLWIDGET_ID_CHILD in (select PLWIDGET_ID 
from PLWIDGET where PAGELAYOUT_ID in (select PAGELAYOUT_ID 
from PAGELAYOUT where name like 'Sample%'));
select * from PLWIDGETSLOT where PAGELAYOUT_ID in (select PAGELAYOUT_ID from PAGELAYOUT where name
like 'Sample%');
select * from PLWIDGETNVP where PLWIDGET_ID in (select PLWIDGET_ID
from PLWIDGET where PAGELAYOUT_ID in (select PAGELAYOUT_ID from PAGELAYOUT where NAME like 'Sample%')); 
Ensure that the data within the sample input files exists within the appropriate database tables.
In Management Center, verify that users can use the layouts in the Commerce Composer tool by viewing the list of available layouts. Ensure that the layouts you loaded are in the Layouts - Layout List grid. The following image shows the new layouts.
Layout List that contains sample layouts
Open a layout for editing and in the Layout Assignments section, add an entry into the Pages table to assign the layout to a page.

Removing the sample data from the HCL Commerce database

To remove the sample data from your database, run the sample again but with the value for the delete column for all entries within the files set to 1. By setting the value for this column to 1, the Data Load utility deletes the data that is identified in the CSV file from your database.

Alternatively, you can run the Cleanup.sql file for this data load sample. The Cleanup.sql file is located within the following directory:
  • Linuxutilities_root/samples/DataLoad/CommerceComposer/layout
  • HCL Commerce DeveloperWCDE_installdir\samples\DataLoad\CommerceComposer\layout
From a command prompt, connect to the database with your user ID and password. Run the following command:
DB2
  • Linuxdb2 -tvf ../samples/DataLoad/CommerceComposer/layout/Cleanup.sql
Oracle
  • Linuxsqlplus user_name/password@ database_name@ ../samples/DataLoad/CommerceComposer/layout/Cleanup.sql