Versions Compared

Version Old Version 2 New Version 3
Changes made by

Matthew Wagner

Matthew Wagner

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

This section explains in a few steps how any design/website can be placed in XperienCentral and how it can be made dynamic. This is primarily intended to ensure that XperienCentral’s page content is shown in the new design. This chapter will show in a few simple steps the power of the XperienCentral SDK. You may not completely understand all the details immediately after taking these steps. The details are explained in detail in /wiki/spaces/PD/pages/24721235 XperienCentral JSPs.

 

Step 1: Collect and Check the HTML, CSS and Javascript

...

  1. Open both the page.jsp and content.jsp with an IDE such as Eclipse.

    Additional instructions about XperienCentral WCBs and Eclipse can be found in Quick Start Eclipse ***.

  2. From the page.jsp file, copy the first lines that include the taglibs:


    Code Block
    themeEclipse
    <%@ page language="java" session="false" buffer="none" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://www.gx.nl/taglib/wm" prefix="wm" %>
<%@ taglib uri="http://www.gx.nl/taglib/functions" prefix="wmfn" %>



  3. Paste the copied JSP code in the content.jsp file above the first line in the original HTML code

  4. Create a new mydesign.xml file and place it in the same folder as mydesign.jsp. This XML-descriptor (explained in detail in /wiki/spaces/PD/pages/24721237 Example Design Layout) should contain the following:


    Code Block
    themeEclipse
    <design template>
	<name>helloworldDesign template mydesign</name>
	<display-name>HWP MyDesign</display-name>
	<scope>Page</scope>
</design template>



  5. Adjust the name and display name in the XML descriptor file. The name-value will be used by XperienCentral to identify the design template, and should be unique. The value of the name attribute in the descriptor of a JSP should also be prefixed by the plugin ID as required by the development guideline /wiki/spaces/PD/pages/24721296 G139. The display name will be visible for editors when selecting the page design template for a page.

  6. Now it is time for the deployment of the design template plugin to XperienCentral. In a Command prompt, run the following command in the helloworldDesign template folder:

    mvn clean package -s C:\GX\XperienCentral\settings.xml

  7. This command will create a target folder that contains the plugin: helloworldDesign template-1.0.0.jar.
  8. You can either upload this plugin using the Plugin Management Console in XperienCentral or copy the file to the C:\GX\XperienCentral\work\deploy folder manually.
  9. It takes a few seconds for XperienCentral to extract the plugin, read the contents and the XML descriptor files and then make the design template available. It is possible to check whether the new design template is available by logging in to the edit environment and opening the Configuration > Design templates panel. Set the scope to "page" and you should see your new design template.

...