Welcome! This is my personal blog about Web technologies, software development, open source and other related topics
The ideas and opinions expressed here are solely mine and don't represent those of others, either individuals or companies.The code snippets or references to software products or analogous are to be used without any warranty of any kind. If you enjoy the content, feel free to share it and re-use it as long as you provide a link to the original post.
Admin User who created the Marketplace can delete and Transfer the Ownership of the Account. Where the ownership is transfered to the users cannot delete the Marketplace.
To delete the Marketplace you should have first created a Marketplace and login to the portal as Admin User having Full Access.
Follow below steps to configure Sitecore Ordercloud Headstart middlewarewithout having to provision Azure online resources. i.e. setup offline Azure resources
Install Azurite- Pre-requisite is to install node js
npm install -g azurite
Run Azurite- Navigate to the folder where the supporting files should be deployed e.g.: c:\Azurite
azurite start
OR - if you want specfic folder and in debug mode
azurite --silent --location c:\azurite --debug c:\azurite\debug.log
Blob service should listen to http://127.0.0.1:10000
Step 2 – Install Microsoft Azure Storage Explorer
Install Azure storage explorer. Download from here
Step 3 – Configure Blob Containers
Connect to Local Azure Storage
Click on the connect to open the connection dialog box
Select the Local storage emulator
Fill in the required details
Display name
Account name – this wil be used to connect to the blob storage
Blobs port- port used to connect to the vlob storage
Queues and Tables port- port used to connect queues and tables respectively
These are the connection information (you might have to note this)-
Local account is created-
Storage Explorer is now able to conect to Local Storage Emulator i.e. Azurite
Create a Blob Container – ngx-translate and create new Virtual Directory i18n
Blob Container and folder name can be any other name. You need to configure this correctly in UI config.See this in later steps
Upload the translation file
Ideally Container, Virtual Directory and trnslation file should be created by Headstart Api. I couldn’t make it work. Hence alternative this I have attached en.json file here.
Once uploaded you should be able to see the uploaded file-
Set Public Access Level to Blob Container
Select the Public read access for containers and blobs
Configure CORS settings
CORS settings are required for accessing the en.json file to access from the local blob storage
Navigate to – /sitecore/system/Settings/Services/API Keys
Create a new API Key e.g.:- nextjsservice
API key here is Item ID
Create a custom binding-
For this create a self signed certificate with a custom domain name in this case – next-jss-prj.dev.local
New-SelfSignedCertificate -CertStoreLocation C:\certificates -DnsName "next-jss-prj.dev.local" -FriendlyName "My First Next JSS App" -NotAfter (Get-Date).AddYears(10)
Create a new https binding and assign the newly create SSL certificate
Add domain to the host file – next-jss-prj.dev.local
Inititate JSS
Run the command
npm init sitecore-jss nextjs
Where would you like your new app created? C:\projects\nextjs Initializing ‘nextjs’… What is the name of your app? next-jss-prj.dev.local What is your Sitecore hostname (used if deployed to Sitecore)? next-jss-prj.dev.local How would you like to fetch Layout and Dictionary data? REST How would you like to prerender your application? SSG Would you like to include any add-on initializers? nextjs-styleguide – Includes example components and setup for working disconnected Initializing ‘nextjs-styleguide’… Which additional language do you want to support (en is already included and required)? da-DK
Setup JSS
jss setup
Is your Sitecore instance on this machine or accessible via network share? [y/n]: y Path to the Sitecore folder (e.g. c:\inetpub\wwwroot\my.siteco.re): Invalid input. Path to the Sitecore folder (e.g. c:\inetpub\wwwroot\my.siteco.re): C:\inetpub\wwwroot\xp102sc.dev.local Sitecore hostname (e.g. http://myapp.local.siteco.re; see /sitecore/config; ensure added to hosts): next-jss-prj.dev.local Invalid input. Must start with http(s) Sitecore hostname (e.g. http://myapp.local.siteco.re; see /sitecore/config; ensure added to hosts): https://next-jss-prj.dev.local Sitecore import service URL [https://next-jss-prj.dev.local/sitecore/api/jss/import]: https://next-jss-prj.dev.local/sitecore/api/jss/import Sitecore API Key (ID of API key item): {2318A20A-6DF1-4AB8-B49E-F933A3B79160} Please enter your deployment secret (32+ random chars; or press enter to generate one):
Deployment secret– Leave this blank as this will generate new secret key
Deployment secret key is generate and stored in <<jss development folder>>\sitecore\config\next-jss-prj.deploysecret.config
JSS connection settings saved to scjssconfig.json
Connection and the deployment secret is created, now this needs to be deployed to Sitecore instance so the JSS app is able to establish a connection with Sitecoore
To deploy the config setting deploy the config to Sitecore instance-
jss deploy config
Configs are copied to Sitecore instance App_Config\Include\zzz…
Deploy the artifacts to Sitecore instance-
Since we don’t know hte thumbprint use the below command with –acceptCertificate as test
jss deploy app –includeContent –includeDictionary –acceptCertificate test
This will provide the thumbprint. highllighted in red
if you see this error while importing – Message: An item name must satisfy the pattern: ^[\w*\$][\w\s-\$]*((\d{1,})){0,1}$ (controlled by the setting ItemNameValidation)
Change the ItemnameValidation to .* while importing and revert back to original in Sitecore.config file. Refer this –
Execute following command to get this working on port 3000
$env:NODE_TLS_REJECT_UNAUTHORIZED=0
Execute JSS start again-
jss start:connected
ERROR-
Connection to your rendering host failed with a Not Found error. Ensure the POST endpoint at URL http://localhost:3000/api/editing/render has been enabled.
Copy the deploy secret and update the – value of setting of JavaScriptServices.ViewEngine.Http.JssEditingSecret in Sitecore.JavaScriptServices.ViewEngine.Http with the deploy secret.
This now work in connected mode. Any content changes in Sitecore should reflect localhost:3000 and Sitecore instance (https://next-jss-prj.dev.local/)
Sitecore next js working in connected mode with SSL
Error-
Exception thrown while importing JSS app Exception: System.UnauthorizedAccessException Message: The current user does not have write access to this item. User: sitecore\JssImport, Item: ContentBlock ({23CE8001-F405-5E50-AE61-AD3057660BBD}) Source: Sitecore.Kernel
Resolution-
Error-
Resolution-
Check if the API key is correct at the location – /sitecore/system/Settings/Services/API Keys
Also check if the CORS and Allowed Controllers are set correctly
For developement environment put * for both the highlighted fields
Sitecore Commerce installation package comes with Sitecore Business Tools SDK.
If you are planning to custommise Business Tools you might have to setup the development environment for Business Tools. You can find more information on how to setup the development environment here
For each version of Sitecore Commerce you need to install the specific version of Business Tools in you development environment.
See below the compatibility table for Business Tools with Sitecore commerce-
Sitecore uses placeholders to render components which allows to dynamically assemble the page layout. This allows the content editors to design specific pages.
When using MVC layout and BootStrap grid, SXA adds additional DIV when a placeholder is used.
For e.g. if you see the views/sxalayout/Bootstrap4Body.cshtml file. If has a placeholders header, main and footer.
Page is rendered with the header, main and footer tags having placeholders within.
These placeholders is wrapped with a div tag when rendered with class row.
Problem– Extra div tag with class row might not be required or if you don’t to have this as part of your markup. How to remove div tag?
Solution –
The configuration to exclude the placeholder wrappers is in Sitecore.XA.Foundation.Grid.config
Any custom or OOTB placeholders can be added to placeholderWrapper/exlcudedPlaceholders list
Best Practice – Never modify the OOTB config’s as this can be changed in the future releases and upgrades. Patch the config instead.
Patch file should look something like this-
Resulting to the entry added in excludePlaceholders list and the div been not rendered-
Asset optimizer helps improve the performance in production site by compressing/minifying the CSS and JS.
Minification of assets helps to cut the unnecessary portions of code and reduce the size of file to boost the performance by reducing amount of data over the internet.
Sitecore administrators can enable/disable optimizer globally of to a specific site.
Enable/Disable the Asset Optimizer globally
Enabling or disabling optimizer globally affects all the sites configured in the Sitecore instance.
To change the optimiser settings navigate to following location. This is accessible to Administrators-
If you can’t find this you may have to re-index master.
Select Scripts or Styles to change the settings
Modes of Optimizations
Concatenate And Minify Mode
When this option is selected. Sitecore will concatenate and minify the OOTB and Custom Scripts and Styles.
Example:- If you have a custom theme you can add the css files in your extension theme
This is in master database
Highlighted CSS is a extension to the base theme.
Web database when the page is first requested Sitecore will concat and minify all css in extension theme folder and create a optimised-min.css file
Styles loaded from the extension theme is concatenated and minified version with timestamp in query parameter (optimised-min.css)
Notice that the file name is optimised-min.css
Size of the optimized version is 367 KBConcatenate and minified. Loads without comments
ConcatenateMode
Change the mode of optimization to “Concatenate”.
Web database now has optimized file created in extension theme
Styles loaded from the extension theme is concatenated version with timestamp in query parameter (optimised.css)
Notice that the reference to file is changed to optimised.css
Size of the optimized version is 381 KBConcatenate but not minified. CSS loads with comments
DisabledMode
Change the mode to “Disabled” and should see all the files loaded separately. Disabled mode is good for debugging but should not be used for production as it will give a performance hit.
CSS files are loaded separately and not concatenated nor minified
Best Practice – Enable Asset Optimizer in production environments
The same can be applied to the Scripts.
You have set the optimizer to concatenate and minify globally to your Sitecore instance but still don’t see the site been optimized.
