SAP Hybris Tutorial – CMS Create Content Slot for Page | Unit 6
In the Unit 3, we known how to create content for page by adding content of custom components into the template. But this added content seem applied to all pages which use the same template.
The question is how to separate content for each page which are using the same template.?
In this post we will cover this concern. Please following these steps below:
- Create new data of YoutubeVideoComponent.
- Create content slot for new data.
- Add content slot into our page
- Verify the result.
Let’s start.
Step 1: Create new data of YoutubeVideoComponent.
Get the id of youtube video on this link: https://www.youtube.com/watch?v=zWTXyC-86fk to create impex data.
Execute the following impex to create VideoCMSComponent2 uid:
$contentCatalog=apparel-ukContentCatalog
$contentCV=catalogVersion(CatalogVersion.catalog(Catalog.id[default=$contentCatalog]),CatalogVersion.version[default=Staged])[default=$contentCatalog:Staged]
### Create new instance data of youtubeVideo component ###
# init data for Youtube video component.
INSERT_UPDATE YoutubeVideoComponent ; $contentCV[unique=true] ; uid[unique=true] ; name ; width ; height ; videoId ; autoPlay ; showControls ; &componentRef
; ; VideoCMSComponent2 ; Our Second Youtube data ; 700 ; 300 ; zWTXyC-86fk ; false ; true ; VideoCMSComponent2
Step 2: Create content slot for new data.
Execute the following impex:
$contentCatalog=apparel-ukContentCatalog
$contentCV=catalogVersion(CatalogVersion.catalog(Catalog.id[default=$contentCatalog]),CatalogVersion.version[default=Staged])[default=$contentCatalog:Staged]
INSERT_UPDATE ContentSlot ; $contentCV[unique=true] ; uid[unique=true] ; name ; active ; cmsComponents(&componentRef)
; ; youtubeVideoComponentSlot2 ; Youtube Video Component ; true ; VideoCMSComponent2
Step 3: Add content slot into our page.
Find the id of page which we want to add content. In the following impex, we add data for page id: cmsitem_00006001:
$contentCatalog=apparel-ukContentCatalog
$contentCV=catalogVersion(CatalogVersion.catalog(Catalog.id[default=$contentCatalog]),CatalogVersion.version[default=Staged])[default=$contentCatalog:Staged]
# ContentSlotForPage
INSERT_UPDATE ContentSlotForPage ;$contentCV[unique=true] ; uid[unique=true] ; position[unique=true] ; page(uid,$contentCV)[unique=true][default='cmsitem_00006001'] ; contentSlot(uid,$contentCV)[unique=true] ;
; ; youtubeVideo-cms1 ; youtubeVideo ; ; youtubeVideoComponentSlot2 ;
Step 4: Verify the result.
Open smart edit: https://localhost:9091/smartedit Go to the Apparel-Uk site.
- Go to your custom page and view the result whether apply your change. If yes, you are correct.
- Go to the other page which are using the same template, verify the content whether change. If not, you are correct.
In the next post, we will learn about how to “Allow Drag, Drop, Move and Clone Component”. Hope to see you in the next article.
Happy Coding.!!! <3