In ES, there are pages that are specific to a specific asset type and also there are global pages that affect all the asset types. The following sections explain how you can locate the partials that correspond to the page that you wish to override:
See Details of Default Partials to get information on all the default partials in the Store and Publisher.
Locating an asset type specific partial
Follow the instructions below to locate an asset type specific partial:
- Navigate to the page that possesses the partial that you want to edit.
- Identify the name of the corresponding renderer.
For example, if you wish to edit a partial in the My Bookmarks page and if the URL is as follows, then the name of the corresponding renderer ismy-items
.
https://localhost:9443/store/pages/my-items
Navigate to the directory that ES uses to maintain the page renderer. This varies based on whether the page is in the Store or the Publisher. The renderers for the Store and Publisher are available in the following directory paths:
ES Component Directory Publisher <ES_HOME>/repository/deployment/server/jaggeryapps/publisher/themes/default/renderers/pages
Store <ES_HOME>/repository/deployment/server/jaggeryapps/store/themes/store/renderers/pages
Identify the renderer that corresponds to the page. The name of the renderer is always identical to the name of the page (e.g., The renderer that corresponds to the
my-items
page ismy-items.js
).Identify the partials that you wish to override. You can find all the partials that ES uses to render the a specific page defined in the renderer.
Example:
The following code snippet is from themy-items.js
file.var render = function(theme, data, meta, require) { var navigation = 'navigation'; var navigationContext = data; switch (data.assetTypeCount) { case 1: navigation = 'navigation-single'; break; default: break; } theme('2-column-right', { title: data.meta.title, header: [{ partial: 'header', context: data }], navigation: [{ partial: navigation, context: navigationContext }], body: [{ partial: 'my_items', context: data }], right: [{ partial: 'recent-assets', context: data } // { // partial: 'tags', // context: data.tags // } ] }); };
Based on the above code snippet, you can see that ES uses the following partials within
my-items.js
renderer to render themy-items
page.Page Location Rendered Partial header
header navigation navigation body my_items right recent-assets Locate the
.hbs
file with the partial definition related to the page that you wish to override. The location of the partial varies based on whether the page is in the Store or the Publisher. The partials for the Store and Publisher are available in the following directory paths:ES Component Directory Publisher <ES_HOME>/repository/deployment/server/jaggeryapps/publisher/themes/default/partials
Store <ES_HOME>/repository/deployment/server/jaggeryapps/store/themes/store/partials
Optionally, if the selected partial is made up of a set of child partials, locate the child partial in the latter mentioned
partials
directory. For more information on how to locate a nested partial see, Locating a Partial.
Locating an app specific partial
Follow the instructions below to locate an app specific partial, which is not dependent on an asset type:
- Navigate to the page that possesses the partial that you want to edit.
- Identify the name of the corresponding renderer.
For example, if you wish to edit a partial in the Advanced Search page and if the URL is as follows, then the name of the corresponding renderer isadvanced-search
.https://localhost:9443/store/pages/advanced-search
Navigate to the directory that ES uses to maintain the page renderer. This varies based on whether the page is in the Store or the Publisher. The renderers for the Store and Publisher are available in the following directory paths:
ES Component Directory Publisher <ES_HOME>/repository/deployment/server/jaggeryapps/publisher/extensions/app/<APP_EXTENSION>/themes/default/renderers/pages
Store <ES_HOME>/repository/deployment/server/jaggeryapps/store/extensions/app/<APP_EXTENSION>/themes/store/renderers/pages
Identify the renderer that corresponds to the page. The name of the renderer is always identical to the name of the page (e.g., The renderer that corresponds to the
advanced-search
page isadvanced-search.js
).Identify the partials that you wish to override. You can find all the partials that ES uses to render the a specific page defined in the renderer.
Example:
The following code snippet is from theadvanced-search.js
file.var render = function(theme, data, meta, require) { theme('2-column-right', { title: 'Store | Advanced Search', header: [{ partial: 'header', context: data }], navigation: [{ partial: 'advance-search-navigation', context: data }], body: [{ partial: 'advanced-search-body', context: data }] }); };
Based on the above code snippet, you can see that ES uses the following partials within
advanced-search.js
renderer to render theadvanced-search
page.Page Location Rendered Partial header
header navigation advance-search-navigation body advanced-search-body Locate the
.hbs
file with the partial definition related to the page that you wish to override. The location of the partial varies based on whether the page is in the Store or the Publisher. The partials for the Store and Publisher are available in one of the following directory paths:ES Component Directory Publisher <ES_HOME>/repository/deployment/server
/jaggeryapps/publisher/themes/default/partials
<ES_HOME>/repository/deployment/server/jaggeryapps/publisher/extensions/app/<APP_EXTENSION>/themes/default/partialsStore <ES_HOME>/repository/deployment/server
/jaggeryapps/store/themes/store/partials
<ES_HOME>/repository/deployment/server/jaggeryapps/store/extensions/app/<APP_EXTENSION>/themes/store/partials
Optionally, if the selected partial is made up of a set of child partials, locate the child partial in the latter mentioned
partials
directory. For more information on how to locate a nested partial see, Locating a Partial.
Identifying a nested partial
The file that contains a partial definition has a .hbs
file extension, such files are referred to as handlebar files, as they are written using Handlebars JS. Nested partials, also known as child partials, refer to partials that are called from within another partial definition. Partials are called within another partial definition by using the following partial call syntax:
{{> [CHILD_PARTIAL] }}
Example:
{{> myPartial }}
The above command renders the partial named myPartial
. When the partial executes, ES runs the child partial under the current execution context.
Therefore, you can easily identify nested partials or child partials within a partial by checking the partial definition for partial call syntaxes.