Using branches in PageBuilder is a helpful tool that allows you to make changes to your website, or a particular webpage, in a “sandboxed” environment, so that there is no impact on your production website. This capability allows you to create new pages or layouts and preview them before they go live on your production website. In addition, when your updated site is ready to go live, you can simply point and click to push the changes live, and have the peace of mind to be able to easily undo those changes if there is a problem.
To create a new branch, click the branch status box in the upper left corner of the content management page. If you have never created other branches, or you are working on your production website, the status will show Production/Primary.
In the slide out that appears, click on Create New Branch.
In the Create Template Branch box that opens, you can choose a color to associate with the new branch. You will also give the branch a name. Last, you will select where you wish to copy the branch from. In the example below, we entered Holiday Layout in the Branch Name field, and selected the color red to correspond to the name. Because we have not created a branch before, we are copying this branch from the Production(Primary) branch. When finished, click Create.
When the page refreshes, you will see the new branch is shown as the branch you are working on. Clicking the branch status box again opens the slide out and shows you the two branches to choose from.
Creating a template branch creates a new "copy" of your website, with all of the page templates. It does not include things like products, or payment or shipping settings. You can create an unlimited number of template branches.
For a deeper dive into template branches, please review the Template Branches Overview document by clicking here.
To preview the branch you are working on, you can use the Template Branch Widget.
There are two ways to preview your site. You can click the eye icon in the upper right corner of the admin, which opens your site in a new browser tab.
You cannot access the eye icon to preview your site if you are working in PageBuilder.
Alternatively, you can choose a webpage from the Content Management screen batch list, and then click the Preview button.
However you choose, once on the preview screen, there is a widget located in the lower left of the screen.
Clicking the widget opens a pop out that displays the branch you are working on. It also shows your Production (Primary) branch and any other branches you may have. You can easily switch back and forth between branches by selecting the desired branch from the list.
If you click the Edit link next to "Previewing Now" you can choose a future date to preview in the box that opens.
This can be helpful if you are, for example, working on an updated Storefront page for the holiday season, and especially if you have scheduled components to go live on certain dates and times.
You can also preview sites at future dates through PageBuilder. To do so, in the upper left corner where your active branch displays, click the clock icon next to it.
In the drop down that opens, click the Edit link. In the box that opens, select the date and time you wish to preview, then click Done.
After that, PageBuilder lets you know that you are previewing the page at a future date with an announcement box at the bottom of the page.
To reset the page, click the Reset to Now link in the announcement box, or the reload icon in the Preview Date/Time dropdown through the clock icon.