Step 5
Open the command line interface.
You can do this by navigating to any folder on your machine and typing cmd into the browser bar followed by the enter key.
Step 6
You should now build your project using the following command:
dotnet build
Step 7
You should now install uSkinned Site Builder. You can install the latest version via NuGet using the following command:
dotnet add package uSkinnedSiteBuilder
Step 8
On your local machine, open the file:
/src/appsettings.Production.json
Update the following Hosting setting to true:
"Hosting": {
"Debug": true
}
The above setting will ensure that the smidge minification cache will be refreshed. This is required so that all of the custom property editors that ship with uSkinned Site Builder are displayed correctly.
Please note, after your first check-in, you can turn that setting back to false.
Step 9
Once complete, you can now run your site using the following command:
dotnet run
Step 10
Once the installation has been completed, navigate to the local URL provided by the command line.
The console will output a message similar to:
[10:57:39 INF] Now listening on: https://localhost:44388
Step 11
Open your preferred browser and navigate to the local URL.
uSkinned Site Builder for Umbraco will now be running on your local copy of your Umbraco Cloud website.
Now we want to push all of this hard work back up to Umbraco Cloud.
Step 12
When a website using uSkinned Site Builder is run for the first time, a migration process will be activated which makes changes to items within the Umbraco backoffice and installs demonstration content. Umbraco Cloud uses UDA files to control the metadata for your project. Items that we change during the migration process which have corresponding UDA files must be altered slightly to force an update on these files. Otherwise you will get a Schema Mismatch error when deploying content to Umbraco Cloud.
In the Umbraco backoffice make changes to the following to force a UDA file update to be created.
- Template USN Page with alias 'USNPage'
- Template USN Blog Landing Page with alias 'USNBlogLandingPage'
- Template USN Blog Page with alias 'USNBlogPage'
- Template USN Search Results Page with alias 'USNSearchResultsPage'
- Member type, Member
- Media type File with alias 'File'
- Media type Image with alias 'Image'
- Media type Vector Graphics (SVG) with alias 'umbracoMediaVectorGraphics'
Step 13
On your computer, open your git client or terminal from earlier. Now push your updates back to Umbraco Cloud.
It is very important to make sure that you push all changes back to Umbraco Cloud.
Please note, your website content will not be deployed to Umbraco Cloud yet.
Step 14
Once the check-in has been completed, return to your local Umbraco CMS back office. Now we want to deploy your local Content and Media to Umbraco Cloud.
Go to the Media section of Umbraco. Right-click the Media heading and select 'Queue for transfer'. Click the 'Queue' button.
Go to the Content section of Umbraco. Right-click the Content heading and select 'Queue for transfer'. Click the 'Queue' button.
Step 15
In the Content section, go to the Dashboard and from the tabs click on Workspaces. You will see your Media and Content ready to transfer in the transfer queue.
Click Transfer to Live.
Please note, depending on how many environments your project has on Umbraco Cloud the message might right Transfer to Development or Transfer to Staging and so on.
Wait for the Transfer to complete.
Step 16
uSkinned Site Builder along with Content and Media will now be completely deployed to your Umbraco Cloud environment.
Login to the Umbraco Cloud back office or browse to your Umbraco Cloud URL to see the website.
