Introduction
The Creating a Basic Site tutorial provides step by step instructions to build an Umbraco website using a set of flat HTML, CSS, and JavaScript files. The tutorial allows you to use a website template, customize it, and wire up the sections that need content managing in the Umbraco CMS.
What You Need
To install a basic website in the Umbraco CMS, you need the following:
- A clean and empty installation of the Umbraco CMS without the starter site installed. See the Verifying your Umbraco Installation.
- This tutorial uses a copy of the Custom Umbraco Template – a HTML5, responsive website template. Download the Custom Umbraco Template or, if you prefer, you can use your own flat HTML files.
Getting Started
Installing Umbraco
To download the latest version of Umbraco, refer to the Installation article. On the installation wizard, follow the steps:
- Enter your Name, Email, and Password.
- Click Customize.
- In the Configure an ASP.Net Machine Key window, click Continue.
- In the Configure your database window, leave the default selection and click Continue.
- In the Install a starter website, click No thanks, I do not want to install a starter website.
- The installation will take a couple of minutes to complete.
- Once the installation is complete, you will see the Login screen. You can enter the Name and Password used during the installation process.
Verifying your Umbraco Installation
When you run your localhost address (http://localhost:xxxx), you will see the Welcome to your Umbraco installation screen.
If you see the starter kit, you need to re-install Umbraco. To re-install Umbraco, follow these steps:
- Delete the folder from where you run the localhost.
- Unzip the downloaded Umbraco installation folder and open the extracted folder in VS Code.
- Run localhost in your browser and complete the installation steps.
Preparing the Custom Umbraco Template Site
- Unzip the Custom Umbraco Template to a folder on your system.
- Open the index.html from the folder in your preferred browser to see the template. The template contains some text with dummy links. We’re going to turn this into a fully fledged, Umbraco-powered site!
Logging in to Umbraco
You can login to Umbraco in two ways:
- Once the installation is complete, you will see the Login screen. You can enter the Name and Password used during the installation process.
- Run localhost in your browser, you will see the Welcome to your Umbraco installation screen:
- Click Open Umbraco.
- Enter the Name and Password used during the installation process. You should see a similar Umbraco Backoffice as the image below: