Tutorials > Customize the Consumer Direct sample store > Add style options

< Previous | Next >


Add style features to the feature repository

In this step of the tutorial, we will add the style features to the feature repository.

  1. Navigate to the following directory:

  2. Open the Features.xml file for editing.

  3. Locate the style section of the file by searching for the following string:

    <!-- Features for style -->
    

  4. Observe that feature with the ID Style.f.3 has been provided for you and therefore no modifications to this section are necessary.

  5. Locate the color section of the file by searching for the following string:

    <!-- Features for stylesheets and image directories-->
    

  6. Add the following elements to the end of the section:

    <feature  enables="vfile.style13.css vfile.color1.dir"/>
    <feature  enables="vfile.style14.css vfile.color2.dir"/>
    <feature  enables="vfile.style15.css vfile.color3.dir"/>
    <feature  enables="vfile.style16.css vfile.color4.dir"/>
    

    Observe that the elements reference existing virtual file implementations for the color image directories.

  7. Save and close the file.

  8. Open the IncludePages/StyleDir.xml file for editing.

  9. Add the following element within the page-components element (if it is not already present):

    <simple-implementation 
    url="include/styles/style3/" 
    virtual-page-interface- />
    

  10. Save and close the file.

  11. Open the VirtualPages.xml file for editing.

  12. Locate the section specifying virtual style sheet implementations by searching for the following string:

    <virtual-file />
    

  13. Add the following virtual-file-implementation elements to the end of the section:

    <virtual-file-implementation virtual-file-
    url="css/Master3_1.css" />
    <virtual-file-implementation virtual-file-
    url="css/Master3_2.css" />
    <virtual-file-implementation virtual-file-
    url="css/Master3_3.css" />
    <virtual-file-implementation virtual-file-
    url="css/Master3_4.css" />
    

  14. Save and close the file.

< Previous | Next >


+

Search Tips   |   Advanced Search