Walkthrough: Using the Getting Started template with SXA
This walkthrough explains how to use the Getting Started template with SXA. You can use the JSS Tenant to enable SXA features such as multisite, designs, and its other platform extensions.
To use the Getting Started template with SXA:
Prepare your environment
Before creating the JSS Tenant, you must set up your environment.
To prepare your environment:
-
Install and run the Getting Started template up until invoking the
init.ps1
script but do not run theup.ps1
script. If you do, you must run thedocker-compose down
command and the.\docker\clean.ps1
script before proceeding. -
Add Sitecore PowerShell Extensions and SXA to your container environment following the guidance in the Sitecore module reference.
-
In Visual Studio, delete the
Platform\App_Config\Include\Sites.config
file. If you delete the file from outside Visual Studio, you must also remove it fromPlatform.csproj
. -
To launch the containers, run
docker-compose up -d
. -
Delete the content of the
src\items\content
folder. -
Remove the
content
include from the fileItems.module.json
:RequestResponse{ "name": "content", "path": "/sitecore/content/MyProject" },
-
Log in using the Sitecore Command Line Interface (CLI):
RequestResponsedotnet sitecore login --cm https://cm.myproject.localhost/ --auth https://id.myproject.localhost/ --allow-write true
-
Run
dotnet sitecore ser push
to push the example items to the Sitecore instance.
Create the MyProject solution
In this procedure, you create a JSS Tenant called MyProject and enable SXA features.
Follow the SXA instructions on how to create a JSS Tenant called MyProject
with a JSS Site called MyProject
under the cm.myproject.localhost
hostname. You can leave the remaining SXA options at their default values.
To create the MyProject solution:
-
In the Content Editor, click
/sitecore/Content/MyProject/MyProject/Settings
, and do the following:-
Set Import user to
sitecore\JssImport
. -
Set Server side rendering engine to
http
. -
Set Server side rendering engine endpoint URL to
http://rendering/jss-render
.
-
-
In the content tree, click
/sitecore/Content/MyProject
, and, on the Security tab, in the Presets group, click JSS Import - No overwrite. Click OK. -
In the content tree, click
/sitecore/Layout/Layouts/Project/MyProject/Main
and, on the Configure tab, in the Template group, click Change and set the template to/sitecore/Templates/Foundation/JSS Experience Accelerator/Presentation/SXA JSS Layout
. -
Click
/sitecore/Templates/Project/MyProject/App Route
and, on the Content tab, in the Base templates field add/sitecore/Templates/Project/MyProject/Page
. -
Click
/sitecore/Templates/Project/MyProject/App Route/__Standard Values
and, on the Presentation tab, in the Layout group, click Details. -
In the Layout Details dialog box, to edit the Default device layout, click Edit, and on the Layout tab, select
Layouts/Project/MyProject/Main
and then click OK to close the Device Editor dialog box and click OK to close the Layout Details dialog box. -
Click
/sitecore/Layout/Renderings/Project/MyProject/ContentBlock
and under Experience Editor, edit the following Other properties:-
Add
IsAutoDatasourceRendering
with a value oftrue
. -
Set the Datasource location to empty.
-
-
Drag
/sitecore/Layout/Placeholder Settings/Project/MyProject/MyProject-main
to/sitecore/content/MyProject/MyProject/Presentation/Placeholder Settings
. -
In the
MyProject-main
placeholder setting, addRenderings\Project\MyProject\ContentBlock
to the allowed controls. -
Select
/sitecore/Content/MyProject/MyProject/Home
and enter a title and a banner of your own choice. -
Right-click
/sitecore/content/MyProject/MyProject/Home
and click Experience Editor to open theHome
page in the Experience Editor. -
Add a ContentBlock to the placeholder in the middle of the page. SXA automatically creates a datasource item.
Publish everything and view your work on the rendering host.
Restore and serialize items
To restore and serialize items:
-
Restore the
content
include in theItems.module.config
file:RequestResponse{ "name": "content", "path": "/sitecore/content/MyProject" },
NoteThis step is the reverse of the related step in the Prepare your environment section.
-
To serialize the items to disk, run
dotnet sitecore ser pull
. -
To update the Content Management role, publish the
Platform
project.