This post is about changing your WordPress DNS configuration, combined with a brief video for those of you who hate to read. Yep, it’s kind of a boring subject, but our WordPress sloth is going to have to do it either before or after he installs WordPress, otherwise he won’t be able to access his shiny new website.
This tutorial might not apply to you if you registered a domain name at the same time you created a hosting account with one provider. Some web hosting providers offer “package deals” with a free domain name for a year. And that domain name may already point at your WordPress install. But I never do that. I tend to not domain where I host.
If you want simple answers and instant gratification right now, here’s the answer in a nutshell. But for the long version and more detail, read on.
Get your domain name servers from your hosting provider (there will be two, usually starting with “ns1 and ns2”). Go to your domain registrar and to your domain panel. Find the area where you can enter custom nameservers and enter those two nameservers you received from your hosting provider. Save. There, it’s done!
Zip, our WordPress sloth, has temporarily roused from his long nap and is feeling ready to install WordPress and get on with this blogging adventure finally.
So he before he installs his WordPress site, he goes to check out his shiny new domain name. And what he finds at Slothverse.com is…get ready for it…
Facts about animals? Facts about sloth? Bible sermons?
While he’s satisfied with his choice of Namecheap for domain name registration, he’s not sure that he wants to be potentially providing them with advertising revenue. That’s how he rolls. Selfish sloth!
So how to get his domain name to point to the spot where his WordPress blog will be?
What I describe below is a very simple configuration. That’s where Zip will start, for now. You might ask, “What about Cloudflare?”
I use Cloudflare, and so will Zip, eventually. However, we’re starting at simple. Our goal is for Point A (his domain name) to point at Point B (his web hosting account) Setting up Cloudflare isn’t too hard, but does require a bit more advanced configuration. We’ll come back to a more advanced WordPress DNS configuration later.
Setting up a Simple WordPress DNS Configuration
1. Find Your DNS Settings at Your Hosting Provider
When you sign up for web hosting, your hosting provider will provide you with a couple of domain nameservers to use to direct your domain name toward your web hosting account. These will usually start with something like ns1 and ns2, or they may try to get cutesy and start them with something like daryll and chloe. Whatever.
Where you find these will differ between hosting providers and accounts. In my Siteground panel, if you go to Websites, and then click the three little dots on the right, it will open up a tooltip where you can choose “server details,” and then that will open a popup that gives you information, including your nameservers.
2. Enter the Nameservers in at Your Domain Name Registrar
Your domain name registrar will have an area where you can update your nameservers. They’ll have a place where you can set up a more advanced configuration and a form for a more simple configuration. As Zip is a sloth and just starting on his WordPress adventure, we’ll go with “simple.” We’ll come back to the more advanced configuration in a later post.
At Namecheap, Slothverse.com’s panel looks like this:
And it’s set on NameCheap Basic DNS. This points toward a “parking page.” There is, in fact, a place where we could undo that if we went to the “Advanced DNS” tab. But, for now, let’s just click the custom DNS tab, which will give us a place to enter the two nameservers we found in our web hosting panel.
Save ’em (at Namecheap, there will be a little green arrow to the right) and you’re done.
Now let’s see what it looks like if we go to Slothverse.com.
OK, so apparently that worked because now it looks like this. But Zip doesn’t want people visiting his new domain and just seeing a file system.
If Zip weren’t so lazy (and if I had more time this very moment), I’d install WordPress right away. But, as I’m going to write an in-depth post about these things later, I’m not going to go into too much detail here.
Making a simple HTML image page
All you need to create a simple html page is a text editor. You have Notepad or some other simple text editor installed on your computer.
Zip opens up Notepad and writes this in plain text:
A Universe of Sloth.
Welcome to the Slothverse!
And then, at my advice, he saves it as index.html.
Uploading a File via File Manager
Plenty of ways exist to get that index.html file Zip has just created onto his server where the world can sit it. Going into all the many ways you might work with your file system is not the point of this post; we’ll come back to that in a later one.
Right now, he doesn’t find many files in his file manager, but he does find another mess of icons at the top. After he installs WordPress, there will be a BUNCH of files and stuff in there.
He chooses the icon labeled “upload.” and uses it to upload the index.html file he just created. Right there, right to the root directory of his web hosting account.
Now if he goes to his website, he just sees a line of plain text across the top.
If he wants to spruce it up, just a bit, he can add some HTML. And he’ll upload an image to the same place he uploaded his index.html file. I’ll do that for him here as we’ll come back to HTML later as well.
Here’s what we added:
<center> <img src="slothverse.png"> <h1>Coming Soon!</h2><br><br> <h2>A Universe of Sloth.</h2><br><br> <h3>Welcome to the Slothverse!</h3><br> If you want to know more about this website, <a href="https://www.caffeinejournal.com/category/beginning-wordpress-tutorials-sloth-makes-a-blog/"> click here.</a>
Which got us this:
We did the following:
- To call the image, we used <img src=”yourimageurlhere”>. The image URL can be relative (here it was in the same place as our index.html document so we just needed the filename.
- We used <h1> <h2> tags and such to call different heading levels for larger text and then closed them with </h1> and such at the end of the line.
- We added a link in a shameless plug to this blog with <a href=”your URL here”> and then closed it with </a>
So, for now, we have a simple, but satisfactory coming soon page. If I had WordPress installed, I would use a plugin to display a coming soon or maintenance mode page if I had to. But this will suffice for now. I’ll be editing this post in the future as we add more posts about HTML (yes, though WordPress does a lot, you really should know some HTML if you’re going to use it.) Until I add those tutorials, if you need to know more about HTML or CSS, W3Schools.com has some clear guides to follow.
Next Up? Installing WordPress
In the next post (in this series, not on this blog) Zip will finally get up to installing WordPress. But not now. There’s naps to be had!
We are sorry that you found this post to be like a weak cup of decaf.
Let us improve this post!
Tell us how we can improve this post?