You’ve already purchased your own domain and are wondering, “What now?” Well, congratulations! You’re one step closer to making this your brand and getting it to start producing. Here, we’ll see step by step how to configure it to point to our website.
The first time I made a website, the first thing I did was buy the domain, and from there, I didn’t know where to start.
The tutorials and guides I saw on Google seemed a bit complicated and very technical for a novice like me.
That’s why I decided to create this guide, so that if you’re in a similar situation, you can create your website with that domain you bought as easily as possible.
The domain name (example: yourcompany.com) is nothing more than an address that has to point to a place where all the information of your website is stored, such as your photos, videos, text, etc. This place is called a “server.”
Once you’ve acquired the domain name, these are the steps to follow to finish creating your website:
- Get a hosting service.
- Point the domain to the hosting server.
- Activate SSL to be able to edit.
- Customize the page and create the content.
It may all sound very technical, but it’s nothing out of this world. Here, I explain everything step by step and with pictures.
Step 1. Get a hosting service.
(If you already purchased hosting, you can skip this step)
Think of hosting as the owner of commercial spaces (servers, which are nothing more than computers) where your website will be “hosted” (files, videos, images, content, etc.).
When someone types your domain name into their browser (e.g., Chrome, Safari, or another), it’s like telling the browser they want to “enter” the store at “yourwebsite.com.”
The owners of these servers rent you that space (or space) for a monthly or annual fee.
What should I know about these hosting companies? Just like with the metaphor of the store owners, each shopping center is different.
Some have more space, individual or shared bathrooms, some have elevators, etc., and therefore, each has its pros and cons.
Hosting providers have similar hosting services, which I’ll explain below:
- Shared hosting: One server is used by several accounts that share resources (like several tenants in one store). This is ideal for a new website that does not need to use too many resources and has no more than 20,000 visits per month, so it is always the cheapest.
- VPS hosting: Each user has private disk space (a store) within a server, but there are many things on the server that they still need to share with other users. It is suitable for a website with more than 30,000 visits per month and that wants to offer services that require more resources.
- Dedicated hosting: A server is exclusively available to the user and you will need it when your website has more than 100,000 visits per month and you want to offer services that require a good amount of resources.
In summary, some of the most popular web hosting pages are as follows:
Cloudways
This is the one I use, this very website is hosted there, Cloudways is a high-speed web hosting service with cutting-edge performance, although it is a bit more expensive, as its prices start at $10 USD.
If your budget is limited, it’s best to use a low-priced hosting to start and when your website has around 20,000 visits per month, switch to a hosting service like this one.
If your website will be heavy from the start (like an online store with many products) then I recommend using Cloudways from the beginning, as it allows you to increase or decrease the RAM memory month by month, so that in dates when you expect more traffic, you can increase it and decrease it in quieter times.
Dreamhost
You’ve probably heard of this hosting service, as it is one of the most used due to its affordable price and one-click WordPress installation (which is the most used web creation program).
Its discounted cost starts at $2.59 per month for your first term, and it is suitable for new websites and for beginners in web design.
Its interface is very easy to use even if you don’t know anything about web page creation, hosting services, domains, and those things.
It’s not as fast as other hosting services like Cloudways, but it has slightly better performance than Hostgator, so in my opinion, it’s an option to consider for hosting your first web pages.
Hostinger
Hostinger is one of the most well-known and used web hosting services, you’ve probably heard of it.
It is quite reliable for new websites and a safe bet if you want to use it.
Its prices start at $2.99 USD per month, with triennial billing, being slightly more expensive than Dreamhost.
The downside of Hostinger is its performance, I think it’s a bit slow when you have a lot of traffic, although if you are just starting out, it’s not a bad option as you will have many visitors at first.
Getting the Hosting Service
To signup to the hosting service, you only need to go to their official website. For this guide, you can use any hosting, but as an example, I will use Cloudways.
You can use whichever hosting you want and click on the “Sign Up Now” button or the equivalent in your hosting service.
Start with Cloudways here>>>>>
For Cloudways you can click on “Start for free”
After that, the following screen will appear. You will enter our information, create a password, and click again where it says “START FREE”:
The following screen will appear, where we will click on the button that says “verify your account”:
It will ask for your cell phone number to make a security confirmation via SMS, in which it will send a code, see below:
Once confirmed, your account will be activated through an email.
After your account is activated, you will choose the type of server you will have. In this case, I recommend one from Digital Ocean, as they are quite economical and with excellent speed.
As shown in the following image, after a few minutes, our server has been added:
Once we have our server ready, we can click on the + sign and then on “ADD APPLICATION.”
An application is simply a new website, we can add as many as we want, but we must consider the limitations of the server we have chosen.
Once “add application” is selected, the following screen will appear:
We will choose the most current WordPress version, give a name to the website or app, and give a name to the project (where you can add more websites).
Once added, your new website will appear as you can see in the following image:
STEP 2.- Pointing the Domain
We will click on our application, and the following screen with various data will appear:
We will go to where it says Domain Management, and where it says PRIMARY DOMAIN, we will change the domain name to the one we previously purchased:
We will go to where it says Domain Management, and where it says PRIMARY DOMAIN, we will change the domain name to the one we previously purchased:
We will go to our domain name provider (like namecheap or godaddy or whichever you used) and THEN the option that says “modify DNS.”
We will make sure that the “A Record” box is selected. In the Host section, we will write the @ sign, and in Value, we will write the IP that appears in our application (where it says “APPLICATION CREDENTIALS”).
As an example, I show you how I modified it with namecheap:
You can see that where it says A Record, the host is an @ sign, and the IP is the one of the server I contracted with Cloudways.
STEP 3.- Activate SSL certificate
Immediately, we will modify the free SSL certificate in Cloudways by going to the tab that says SSL Certificate. We will leave where it says “Let’s Encrypt,” write an email that we want, and the domain we are pointing to.
We will also make sure that the “AUTO RENEWAL” box is set to “Enable,” as shown below:
With this, you can now enter to modify your website from the application screen, in the ACCESS DETAILS tab, just click on the domain name, and you will have WordPress installed and your website ready to be created.
Once WordPress is Installed
Once the website is created and WordPress is installed, a small screen will appear confirming this and assigning us a username and password for WordPress. So, once logged in, this is the first screen that will appear to us:
This is the WordPress interface, it is actually simpler than it looks. In summary, we can say that on the left side are the options for our website, such as adding posts, adding pages, customizing the site’s image, changing the language, and many other things that can be added.
If we click on the menu that says Appearance/Customize, we will see how our website looks and several options that allow us to add or remove elements, change colors, or add a logo.
Congratulations!!!
Your website is ready and just waiting for you to change its theme, add content and begin exploring.
I will give you some guidance so that you familiarize with the platform:
STEP 4: Customize our service website
To customize our service website, we will start by creating a page and a test post, so that we know what we want to include on the home page.
We will do this by clicking on the top where it says “add,” once the submenu is displayed, click on post (for posts) or page (for other pages, such as contact, mission, and vision, etc.), appearing the following screen:
We are going to add the title, text, and featured image as they appear in the toolbox on the right side and click on publish.
This was our first page, now you can go to your website and check your new page.
Then I went to where it says appearance and then to Theme Options (if the theme you chose was not Ascend), otherwise, you will use Appearance and Customize or the option that the theme you chose offers.
In my case, this is the screen of the theme option:
What we will do is, at the same time we have that screen open, in another tab or window, we will have our main page open. This way, every time we make a change, we just have to click on update in the page window.
These are the options I used within the theme options:
- In Layout settings/Site layout style: I left it normal.
- Logo settings: I put the logo of this page, here you will put the logo of your company.
- Transparent header options: It is to see how transparent the header (where the logo and menus come) will be. I set the transparency to 0.9 and the menu text color to black.
- Home page header: Here you choose how the transparent header (the one that looks like a banner) will be. I put basic slider (added images, text, and links) and in basic slider type, I decided on forced full width (forcing each image to occupy all the space).
- Homepage layout: This is used to indicate to the theme what will appear on the home screen. I set it to show: page content and latest posts, in that order.
Once adding that, so far this is how it looks on the Appearance/Customize screen:
As you can see, the slider (which is like a banner to which you can add links to any of your pages) has already been added, and below are the latest posts since we haven’t added anything to the page yet (remember that the content of the page was supposed to be shown first).
Next, I went to Pages, All Pages, Home (home page), and in Add, I decided on an Infobox as follows:
This is how the page looks:
Remember, this is just an example, since you know how to add pages, posts, and elements to the theme, as well as the colors that are suitable for your brand. It’s just a matter of doing it to your liking.
