In this video, I’m going to demonstrate Sandboxes in the KIBO Dev Center. So, what is a “Sandbox” and why do we use it? A sandbox is a testing environment for eCommerce websites. It is a safe and consequence-free way to test out changes by keeping them separate from production sites. KIBO creates a Dev account for each client, which gives them the ability to create up to 10 sandboxes.Each sandbox grants administrators access to the Admin Console, providing a centralized interface for managing and configuring the e-commerce environment. Furthermore, these sandboxes enable the development of Applications and modifying Themes, allowing for customization and integration with other systems. Once a client’s storefront goes live, they retain this development account, ensuring they can continue staging updates and testing new features in a safe, isolated environment.Important Note - In KIBO, the terms “Sandbox” and “Tenant” can refer to the same thing, and can be used interchangeably. In this video, I’m going to demonstrate sandboxes in the kibo dev Center. So what is a Sandbox and why do we use it? A Sandbox is a testing environment for e-commerce websites. It is a safe and consequence-free way to test out changes by keeping them separate from production sites. Kibo creates a Dev account for each client, which gives them the ability to create up to 10 sandboxes. Each sandbox grants administrators access to the admin console. Providing a centralized interface for managing and configuring the e-commerce environment. Furthermore, the sandboxes enable the development of applications and modifying themes allowing for customization and integration with other systems. Once a client store Front goes live, they retain the account in, they can continue staging updates and testing new features in a safe isolated environment. Important note in kibo. The term sandbox antenna can refer to the same thing and can be used interchangeably. This is the KIBO Dev Center. We did a full walkthrough of the Dev Center in another video, which is linked here. This is the KIBO Dev Center. We did a full walkthrough of the Dev Center in another video, which is linked here. Clicking the “Sandboxes” menu option at the top of the page brings us to the “Sandboxes” menu. This is a list of all of the tenants in the Dev Center, and lists the “Sandbox Name”, “Sandbox ID”, primary “Site Name” associated with the tenant, the tenants “Status”, number of “Themes” and “Applications” installed on a tenant, and the “Number of Catalogs” that have been created in the tenant. Clicking the “Sandboxes” menu option at the top of the page brings us to the “Sandboxes” menu. This is a list of all of the tenants in the Dev Center, and lists the “Sandbox Name”, “Sandbox ID”, primary “Site Name” associated with the tenant, the tenants “Status”, number of “Themes” and “Applications” installed on a tenant, and the “Number of Catalogs” that have been created in the tenant. Clicking into the “Search” bar above the Sandbox list will allow us to search for sandboxes based on a keyword search term. In this example, we’ll search for all sandboxes with the term “demo” in the name. Clicking into the “Search” bar above the Sandbox list will allow us to search for sandboxes based on a keyword search term. In this example, we’ll search for all sandboxes with the term “demo” in the name. To create a new Sandbox, we’ll click the “Create Sandbox” button on the top right. To create a new Sandbox, we’ll click the “Create Sandbox” button on the top right. This will open the “Create Sandbox” modal window. The fields marked with a green star, like “Name” and “Sandbox type” are required entries. This will open the “Create Sandbox” modal window. The fields marked with a green star, like “Name” and “Sandbox type” are required entries. The first thing we’ll do is give the new Sandbox a “Name”. The first thing we’ll do is give the new Sandbox a “Name”. Next, we’ll select an optional “Sandbox Template” from the drop-down menu. The type of template we select depends on the type of testing we need to do:To quickly set up a new environment with a pre-configured parent catalog, catalog, and site defaults, select a KIBO-supplied template, which is displayed in blue in the template drop-down list.To clone one of our existing sandboxes, we’ll select it from the template list, which is displayed in black in the template drop-down list.To build our own parent catalog, catalogs, and sites, we can start with a blank environment by selecting “None” from the template drop-down list. Next, we’ll select an optional sandbox template from the drop-down menu. The type of template, we select depends on the type of testing, we need to do. To quickly set up a new environment with a pre-configured parent catalog catalog and site defaults, select a kibo supplied template which is displayed in blue in the template drop-down list. To clone one of our existing sandboxes will select it from the template list, which is displayed in Black in the template drop-down list. To build our own parent, catalog catalogs and sights. We can start with a blank environment by selecting none from the template drop-down list. The default “Locale code” is English - United States, but we can change it to another by selecting it from the dropdown list. The default “Locale code” is English - United States, but we can change it to another by selecting it from the dropdown list. The default “Currency code” is the US Dollar, but we can change it to another by selecting it from the dropdown list. The default “Currency code” is the US Dollar, but we can change it to another by selecting it from the dropdown list. The “Default site country code” is the United States, but we can change it to another by selecting it from the dropdown list. The “Default site country code” is the United States, but we can change it to another by selecting it from the dropdown list. Lastly, we’ll select the type of Sandbox we want to create. The options are eComm Only, OMS Only, or Full-Stack eComm and OMS. Lastly, we’ll select the type of Sandbox we want to create. The options are eComm Only, OMS Only, or Full-Stack eComm and OMS. When we’ve supplied all of the required and optional selections we need, we’ll click the “Save” button to create the new Sandbox. The new site will enter a status of “Provisioning”, and may take a few minutes before it’s status is changed to “Active”. When we’ve supplied all of the required and optional selections we need, we’ll click the “Save” button to create the new Sandbox. The new site will enter a status of “Provisioning”, and may take a few minutes before it’s status is changed to “Active”. Hovering over the “Actions” column will display a “Gear” icon. Clicking that icon provides options to “Edit”, “View”, or “Delete” each sandbox. Hovering over the “Actions” column will display a “Gear” icon. Clicking that icon provides options to “Edit”, “View”, or “Delete” each sandbox. Clicking “Edit” will open the “Details” screen for a particular sandbox. Alternatively, double-clicking anywhere on the sandbox row will also open the “Details” screen. Clicking edit will open the detail screen for a particular sandbox. Alternatively. Double clicking anywhere on the sandbox. Row will also open the detail screen. This is the Sandbox “Details” screen. We’ll explore all sections of this screen. This is the Sandbox “Details” screen. We’ll explore all sections of this screen. First up is a “Quicklook” bar of information about this Sandbox, such as the “Sandbox ID”, “Number of Catalogs” created within the Sandbox, Number of “Installed Apps” and “Installed Themes”. This bar will persist at the top as we navigate through the tabbed interface. First up is a quick look bar of information about this sandbox, such as the sandbox, ID number of catalogs created within the sandbox number of installed apps and installed themes. This bar will persist at the top as we navigate through the table interface. Next are the tabs on the left of the Sandbox “Details” page. The tabs determine what part of the interface we are interacting with. The first tab we’ll start with is “General”. Next are the tabs on the left of the Sandbox “Details” page. The tabs determine what part of the interface we are interacting with. The first tab we’ll start with is “General”. the “General” tab allows us to edit the “Name” of the Sandbox, as well as add an optional “Description” of the Sandbox. the “General” tab allows us to edit the “Name” of the Sandbox, as well as add an optional “Description” of the Sandbox. The next tab is the “Details” tab. This is where we can view and interact with the catalogs and sites for this tenant, as well as add and remove users. The next tab is the “Details” tab. This is where we can view and interact with the catalogs and sites for this tenant, as well as add and remove users. First, let’s look at the “Catalog Structure”. The “Details” tab will show all of the parent catalogs that are available in this Sandbox. Clicking the “plus” sign next to the folder icons will expand to show any available child catalogs and sites based on those child catalogs.In this example, we have 2 parent catalogs, “KIBO Retail” and “Agentic”. Expanding the “KIBO Retail” parent catalog, there are 2 child catalogs, “KIBO Retail” and “KIBO Retail - France”, while “Agentic” has one child catalog, “Agentic”. We can also see the sites associated with the child catalogs. First, let’s look at the “Catalog Structure”. The “Details” tab will show all of the parent catalogs that are available in this Sandbox. Clicking the “plus” sign next to the folder icons will expand to show any available child catalogs and sites based on those child catalogs. In this example, we have 2 parent catalogs, “KIBO Retail” and “Agentic”. Expanding the “KIBO Retail” parent catalog, there are 2 child catalogs, “KIBO Retail” and “KIBO Retail - France”, while “Agentic” has one child catalog, “Agentic”. We can also see the sites associated with the child catalogs. These selections also have their own “Actions” menu items. For Parent Catalogs, we can “View” the catalog in the Admin UI, “Add” another child catalog, or “Refresh” the Catalog.For Child Catalogs, as seen here, we can view the catalog in the Admin UI, “Add” sites, “Delete” or “Refresh” the catalog.For Sites, we can “View” in Admin, “Delete” or “Refresh”.Important Note - all of these actions can also be performed within the Admin UI. These selections also have their own actions menu items for parent catalogs. We can view the catalog in the admin UI, add another child catalog, or refresh the catalog. For child catalogs. As seen. Here, we can view the catalog in the admin UI. Add sites, delete, or refresh the catalog. For sites, we can view in admin, delete or refresh. Important note, all of these actions can also be performed within the admin UI We can create a new Parent Catalog here by clicking the “Create Master Catalog” button. We can create a new Parent Catalog here by clicking the “Create Master Catalog” button. This will open a modal window where we’ll give the new Parent Catalog a “Name”, select the “Locale code” and “Currency code” and then click “Save”.Important note - all fields marked with a green star are required. Parent Catalogs can also be created within the Admin UI. This will open a modal window where we’ll give the new parent catalog, a name, select the Locale code and currency code and then click save. Important note all Fields marked with a green star are required parent. Catalogs can also be created within the admin UI Below the “Catalog Structure” section, we have the list of Users that can access this Sandbox. Below the “Catalog Structure” section, we have the list of Users that can access this Sandbox. The lone available “Action” in the “Sandbox Users” section allows us to “Remove” users from this Sandbox. The lone available “Action” in the “Sandbox Users” section allows us to “Remove” users from this Sandbox. If a user is NOT included in the “Sandbox Users” list for a Sandbox and they try to access the Admin UI by clicking the “View Sandbox” button… If a user is NOT included in the “Sandbox Users” list for a Sandbox and they try to access the Admin UI by clicking the “View Sandbox” button… …that user will be immediately logged out of the KIBO Dev Center. …that user will be immediately logged out of the KIBO Dev Center. To add a user to a Sandbox environment, click the “Add Sandbox User” button. To add a user to a Sandbox environment, click the “Add Sandbox User” button. This will open a modal window where we can choose from existing Users that have been added to the Dev Center. Click on the User, and then click the “OK” button.There are a couple of important things to note concerning users at the Dev Center level: First, any existing Dev Center users will automatically be opted in to any newly created Sandboxes. Secondly, any User Role in the Dev Center outside of “Marketer” can add themselves to any sandbox environment. If we need to add Users that don’t need Dev Center access and we need to control the Sandboxes they have access to, we’ll add them at the tenant-level only. We’ll discuss how to assign User Roles and Permissions at the tenant-level in a separate video. This will open a modal window where we can choose from existing Users that have been added to the Dev Center. Click on the User, and then click the “OK” button. There are a couple of important things to note concerning users at the Dev Center level: First, any existing Dev Center users will automatically be opted in to any newly created Sandboxes. Secondly, any User Role in the Dev Center outside of “Marketer” can add themselves to any sandbox environment. If we need to add Users that don’t need Dev Center access and we need to control the Sandboxes they have access to, we’ll add them at the tenant-level only. We’ll discuss how to assign User Roles and Permissions at the tenant-level in a separate video. The last tab we’ll review is the “Installed Assets” tab. This is where we’ll review any installed Applications and Themes, and install others, if applicable. The last tab we’ll review is the “Installed Assets” tab. This is where we’ll review any installed Applications and Themes, and install others, if applicable. The “Installed Apps” section shows all applications that have been installed on this Sandbox. If we want to install a new App, we can click the “Install App” button.Important Note - we can also install apps from the “Applications” submenu under the “Develop” dropdown. We’ll discuss “Applications” in a separate video. The installed apps section shows all applications that have been installed on this sandbox. If we want to install a new app, we can click the install app button. Important note, we can also install apps from the application, submenu under the developed dropdown. We’ll discuss applications in a separate video. Clicking the “Install App” button will open this modal window where we can scroll and find the application we want to install. We’ll click the app, then click “OK”. Clicking the “Install App” button will open this modal window where we can scroll and find the application we want to install. We’ll click the app, then click “OK”. Similarly to “Installed Apps”, the “Installed Themes” section shows all Themes that have been installed on this Sandbox. If we want to install a new Theme, we can click the “Install Theme” button.Important Note - we can also install Themes from the “Themes” submenu under the “Develop” dropdown. We’ll discuss “Themes” in a separate video. Similarly, to installed apps, the installed theme section shows, all themes that have been installed on this sandbox. If we want to install a new theme, we can click the install theme button. Important note, we can also install themes from the theme submenu under the developed drop-down. We’ll discuss themes in a separate video. Clicking the “Install Theme” button will open this modal window where we can scroll and find the application we want to install. We’ll click the app, then click “OK”. Clicking the “Install Theme” button will open this modal window where we can scroll and find the application we want to install. We’ll click the app, then click “OK”. When we’ve made all of the updates required, we can click the “Cancel” button to discard all changes, or click “Save” to save. When we’ve made all of the updates required, we can click the “Cancel” button to discard all changes, or click “Save” to save. Back on the “Sandboxes” menu page, under the “Actions” column, clicking “View” will open the Admin UI for the Sandbox in a separate browser tab, provided we are listed as a “User” on this Sandbox. Back on the sandbox is menu page under the actions column. Clicking view will open the admin UI for the sandbox in a separate browser. Tab provided we are listed as a user on this sandbox. This is the Admin UI, and is what will be opened on a separate browser tab when “View” is clicked. We’ll provide a complete walkthrough of the Admin UI in a separate video. This is the Admin UI, and is what will be opened on a separate browser tab when “View” is clicked. We’ll provide a complete walkthrough of the Admin UI in a separate video. Lastly, clicking “Delete” will open a modal window where we will click either “Yes” to confirm or “No” to cancel the deletion of a particular Sandbox. Lastly, clicking “Delete” will open a modal window where we will click either “Yes” to confirm or “No” to cancel the deletion of a particular Sandbox. This is the modal window that appears when we click “Delete”. Again, click “Yes” to confirm or “No” to cancel. This is the modal window that appears when we click “Delete”. Again, click “Yes” to confirm or “No” to cancel.
Want to learn more?
Request a Production Tenant
Learn more about this topic