SoftSlate Commerce
Home » Documentation » HTML Documentation

Customizing Your First Screen

One of the first changes you're likely to make is to customize the Welcome Screen to display your own message to your visitors, featured products, or other information. Follow these steps to create a custom template for the Welcome Screen in place of the default template.

Example 12.1. Customizing the Welcome Screen

  1. Refer to the Outline of the Default Welcome Screen. As you can see from the outline, the body of the Welcome Screen where the default heading and message appears, is produced by the core/welcome.jsp file. Find this file under the /WEB-INF/layouts/default-html5/core directory.
  2. You could make changes directly in this file, but you should not. The files inside the /WEB-INF/layouts/default-html5 directory may be overwritten when you install a future upgrade of SoftSlate Commerce. Instead, copy the welcome.jsp file into the /WEB-INF/layouts/custom/core directory.
  3. Now you can safely make whatever changes you need to the copied welcome.jsp file under the custom directory. Open up the welcome.jsp you copied to the custom directory. It should look something like this:

    
    <%@ include file="/WEB-INF/layouts/default-html5/core/tagDefinitions.jsp" %>
    <!-- Start welcome.jsp -->
    <table width="100%" border="0" cellspacing="0" cellpadding="4">
    	<tr>
    		<td class="welcomeHeading">
    			<bean:message key="welcome.heading"/>
    		</td>
    	</tr>
    	<tr>
    		<td class="welcomeMessage">
    			<bean:message key="welcome.message"/>
    		</td>
    	</tr>
    </table>
    <!-- End welcome.jsp -->
    						

  4. Now replace the default welcome message with your own unique message:

    
    <%@ include file="/WEB-INF/layouts/default-html5/core/tagDefinitions.jsp" %>
    <!-- Start welcome.jsp -->
    <table width="100%" border="0" cellspacing="0" cellpadding="4">
    	<tr>
    		<td class="welcomeHeading">
    			<bean:message key="welcome.heading"/>
    		</td>
    	</tr>
    	<tr>
    		<td class="welcomeMessage">
    			Hello customers! So glad you decided to stop by!
    		</td>
    	</tr>
    </table>
    <!-- End welcome.jsp -->
    						

  5. Save the file. If necessary, upload the new file to the server you have running SoftSlate Commerce. Then navigate in your browser to the Welcome Screen (refresh the page if your browser is already there). You should see your changes on the screen.

Congratulations! You've just made your first customization to your store's screens.

[Note]Note

The <bean:message key="welcome.message"/> tag that was replaced in the above example is a tag that pulls in text from the application.properties files under the /WEB-INF/classes/resources directory, which are used to assist with internationalization and translations.

Copyright © 2009-2017 SoftSlate, LLC. All Rights Reserved.

Powered by SoftSlate Commerce

Foraker Design