Modify the static template of your theme

Dynamic content spots start the combiner data source which injects markup necessary to load all of the modules that are identified in the module profile. To start modularizing your theme, create two dynamic content spot references in the static template for your theme to create references to load modules.

About this task

Important: Enable development mode before you copy the static resources. Set the resourceaggregation.development.mode property to true within the WP ConfigService resource environment provider. If you do not enable development mode, be sure to restart your portal server at the end before you use your copied theme on a page.

The following steps presume you first migrated your Page Builder-based theme to a Portal 8.0 server.

Procedure

Connect your WebDAV client, such as WebDrive or AnyClient, to http://host:port/wps/mycontenthandler/dav/fs-type1/. For more information about connecting to a WebDAV client, see Connecting to the Portal WebDAV.

From the themes\<yourTheme>\nls folder, copy the theme template file, theme_en.html or whichever file is your default locale, to the local drive and edit it. Repeat for any of the other locale files for the languages that you plan to support.

Note: You do not need to modify the theme.html file in the themes\<yourTheme> folder. It is only used to redirect to the appropriate locale file in the nls folder. Modify it only when you add or remove locales.

Add the following line to the <head> section of the template for your theme.
```
<link rel="dynamic-content" href="co:head">
```
Add the following line to the <body> section before the config.jsp link:
```
<a rel="dynamic-content" href="co:config"></a>
```

Add the following lines as the first thing inside the <body> tag before the lotusFrame <div>:

 <!-- iWidgets will fill in the two empty divs below -->
 <div id="customizeShelfContainer"></div><!-- used by the mm_customize_shelf module -->
 <div id="pageToolbarButtons"></div><!-- used by the mm_page_toolbar module -->

This section activates some of the new modules.

Remove the following code blocks that are no longer needed by modules:

<!-- pb-pageMode-edit indicates that an iwidget should be lazy-loaded upon entering edit mode for the page -->
<div class="iw-iWidget iw-Standalone pb-pageMode-edit" id="customizeShelfContainer">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/customizeShelf.xml?pragma=cache&amp;max-age=1209600&amp;
  cache-scope=public&amp;vary=none&amp;user-context=false">
 </a>
</div>

<div class="iw-iWidget iw-Standalone" id="templateLayout">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/templateLayout.xml?pragma=cache&amp;max-age=1209600&amp;cache-scope=public&amp;
  vary=none&amp;user-context=false">
 </a>
</div>

<div class="iw-iWidget iw-Standalone" id="templateLayout">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/templateLayout.xml?pragma=cache&amp;max-age=1209600&amp;cache-scope=public&amp;
  vary=none&amp;user-context=false">
 </a>
</div><div class="iw-iWidget mumHiddenWidget iw-Standalone pb-pageMode-edit" id="newPage">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/NewPageDialog.xml?pragma=cache&amp;max-age=1209600&amp;cache-scope=public&amp;
  vary=none&amp;user-context=false">
 </a>
 <span class="iw-ItemSet" style="display:none" title="attributes">
  <a class="iw-Item" href="#controller">ibmCfg.controllers.navigation</a>
  <a class="iw-Item" href="#allowFriendlyURL">true</a>
  <a class="iw-Item" href="#allowPrivate">true</a>
  <a class="iw-Item" href="#showPageTemplate">ibmPortalConfig.isContentTemplatingEnabled</a>
 </span>
</div>
<!-- The lazyLoad attribute is used for widgets that are explicitly loaded by another source at a later point in time 
     (in this case the displayHelper). -->
<div class="iw-iWidget mumHiddenWidget iw-Standalone" lazyLoad="true" id="sharePage">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/accessControl.xml?pragma=cache&amp;max-age=1209600&amp;cache-scope=public&amp;
  vary=none&amp;user-context=false">
 </a>
</div>
<div class="iw-iWidget mumHiddenWidget iw-Standalone" lazyLoad="true" id="reorderPage">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/reorderPageWidget.xml?pragma=cache&amp;max-age=1209600&amp;cache-scope=public&amp;
  vary=none&amp;user-context=false">
 </a>
</div>
<div class="iw-iWidget mumHiddenWidget iw-Standalone" lazyLoad="true" id="viewMorePage">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/viewMorePage.xml?pragma=cache&amp;max-age=1209600&amp;cache-scope=public&amp;
  vary=none&amp;user-context=false">
 </a>
</div>
<div class="iw-iWidget mumHiddenWidget iw-Standalone" lazyLoad="true" id="wireInterface">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/wireInterfaceWithSettings.xml?pragma=cache&amp;max-age=1209600&amp;
  cache-scope=public&amp;vary=none&amp;user-context=false">
 </a>
 <span class="iw-ItemSet" title="attributes" style="visibility: hidden; display: none">
  <a class="iw-Item" style="visibility:hidden;display:none;" href="#displaySettings">true</a>
  <a class="iw-Item" style="visibility:hidden;display:none;" href="#displayPortletsAndWidgetsWarningMessage">true</a>
 </span>
</div>
<div class="iw-iWidget mumHiddenWidget iw-Standalone pb-pageMode-edit" id="autoWiringManager">
 <a class="iw-Definition" 
  href="/mccbuilder/widget-catalog/autoWiringManager.xml?pragma=cache&amp;max-age=1209600&amp;cache-scope=public&amp;
  vary=none&amp;user-context=false">
 </a>
</div>
<div class="iw-iWidget iw-Standalone" id="dialogDisplayer">
 <a class="iw-Definition" style="visibility:hidden;display:none;" 
  href="/mccbuilder/widget-catalog/displayHelper.xml?pragma=cache&amp;max-age=1209600&amp;cache-scope=public&amp;
  vary=none&amp;user-context=false">
 </a>
 <span class="iw-ItemSet" title="attributes" style="visibility: hidden; display: none;">
  <a class="iw-Item" style="visibility:hidden;display:none;" href="#sharePage">sharePage</a>
  <a class="iw-Item" style="visibility:hidden;display:none;" href="#reorderPage">reorderPage</a>
  <a class="iw-Item" style="visibility:hidden;display:none;" href="#viewMorePage">viewMorePage</a>
  <a class="iw-Item" style="visibility:hidden;display:none;" href="#wireInterface">wireInterface</a>
  <a class="iw-Item" style="visibility:hidden;display:none;" href="#autoWiringManager">autoWiringManager</a>
 </span>
</div>

Change all instances of /mccbuilder/widget-catalog to /wps/mccbuilder.v3001/widget-catalog to get the latest Builder widgets.

Save the local copy of the file and copy it into the corresponding location in WebDAV.

From the themes\<yourTheme>\js folder, copy the init.js file to local drive and edit it.

Remove the following code blocks that are no longer needed by modules:

lgr.trace(mname, "Adding live text config entries for decorations and semantic tagging");
/* Add live text service configuration entries for layout control decorations and semantic tagging */
var livetextEntryAdded = "/com/ibm/mashups/livetext/configentryadded";
var decorationsEntry = new com.ibm.mashups.livetext.ConfigEntry("*.component-control", true, "com.ibm.pb.decorations", 
  ibmConfig["com.ibm.mashups.contextroot.builder"]+"/js/com/ibm/pb/decorations","com.ibm.pb.decorations.DecorationManager", true);
var configEntryAction = new com.ibm.mashups.livetext.ConfigEntry(".com\\.ibm\\.portal\\.action", false, "portallof",        
  "/wps_semanticTag/javascript",  "portallof.vcard",  false, "com.ibm.portal.action");
var configEntryVCard = new com.ibm.mashups.livetext.ConfigEntry(".vcard", false, "portallof","/wps_semanticTag/javascript",  
  "portallof.vcard",  false, "hcard");
var configEntryC2aSourceTarget = new com.ibm.mashups.livetext.ConfigEntry(".c2a\\:source,.c2a\\:target", false, "portallof", 
  "/wps_semanticTag/javascript", "portallof.vcard", false, "c2a");
dojo.publish(livetextEntryAdded,[decorationsEntry]);
dojo.publish(livetextEntryAdded,[configEntryAction]);
dojo.publish(livetextEntryAdded,[configEntryVCard]);
dojo.publish(livetextEntryAdded,[configEntryC2aSourceTarget]);

livetextService = com.ibm.mashups.services.ServiceManager.getService(com.ibm.mashups.livetext.ServiceModel.SERVICE_NAME);
TagService = SemTagSvc = livetextService;
(function(){
var onTagContentChanged = livetextService.onTagContentChanged,
onTagChanged = livetextService.onTagChanged;
livetextService.onTagChanged = function() {
var mp = com.ibm.mashups.enabler.io.XHRMultipartFactory.create();
mp.startTransaction();
onTagChanged.apply(this, arguments);
mp.endTransactionDeferred(true).start();
};
livetextService.onTagContentChanged = function() {
var mp = com.ibm.mashups.enabler.io.XHRMultipartFactory.create();
mp.startTransaction();
onTagContentChanged.apply(this, arguments);
mp.endTransactionDeferred(true).start();
};
})();

Add the following line of code as the last line inside the closing brace (}) of the dojo.addOnLoad(function(){...}); block:
```
ibmCfg.controllers.navigation.onRefreshNavigation();
```

Save the local copy of the file and copy it into the corresponding location in WebDAV.