Introduction: Free Server Hosted Website (Dropbox, GitHub, DNSPOD, and Freenom)
This tutorial will show how to host your website on two independent servers (a main and a backup) this way your website will almost always be online. Through third party DNS forwarding you will be able to have your site indexed by Google and take advantage of Google Webmaster Tools.
Both of these sites:
Are hosted using this method. Completely free, with no adds!
As an example I am going to host one of the free site templates available from Creative Market (https://creativemarket.com/). If you are still designing your site or even if you think you are finished I highly recommend taking a look at their high resolution symbols and fonts that will really make your site pop!
I will be using Creative Market's "Zero Orange" site template. Available here: https://creativemarket.com/Gthemes/4443-Zero-%E2%8...
Because this site is dual hosted it will almost never go down and is less vulnerable to DDOS and similar "traffic jams" because it is able to divert excess traffic to a secondary webpage.
Check Out Our Other Accounts! Like, Subscribe, and Follow to keep up to date with our latest projects. :-)
Step 1: Reserve Your Domain Name
Every good website needs a nice memorable domain name.
Freenom provides both free (.tk .ml .ga .cf .gq) and at cost (.ca .com .co etc...)
Since the free domain names are FREE, if you cannot settle on a single name reserve your top few choices.
You can register each name for up to 12 months and will always have first dibs on renewal.
Step 2: Setup Your Primary Server
You will now need to sign up for Dropbox and download their app. https://www.dropbox.com/
Once the app is downloaded allow it to create a Dropbox sync folder on your computer. Place your website source files in the "Public" area of your sync folder. Next right click on your websites index file and copy its "Public Link".
If you do not want your site to be indexed by Google (Simpler) please continue below. Otherwise continue on to the next step.
Sign back into your Freenom account and under the "Domains" tab select "My Domains". Next click the "Manage Domain" button on the right side of your favorite domain name. Under "Management Tools" select "URL Forwarding". Next paste your Dropbox public link into the "URL Forwarding Box" and select "Frame (cloaking) (default)" from the drop down list below.
Within 1-10 minutes your website will be publicly available at your domain name. But it is unlikely to be high ranking in Google as you have no keywords or description other than your domain.
If you search your domain in Google in the following weeks you will be greeted by a very plain result.
Step 3: Setup Your Secondary Server
You will now need to register for a Git Hub account.
After registering and confirming your email, login. Once you are logged in to you new Git Hub account select the "Create New" button beside your user name. Under repository name type in "YOUR-USERNAME.github.io" NOTE: replace YOUR-USERNAME with your actual username.
You will now need to create three files and a folder in your repository.
In this file type nothing but your domain name in my case "www.Zero-Orange.TK"
If your CNAME file contains example.com, then www.example.com will redirect to example.com.If your CNAME file contains www.example.com, then example.com will redirect to www.example.com.
In this file you will setup your own personal cloaking iframe with optional keywords, description, and site symbol.
Place the public link to you Dropbox "index.htm" file in the iframe code. (To get the public link right click on the index.html file in your dropbox folder and select "public link")
Open the index.html file above and fill in the blanks as specified. Then copy this code into your repository.
In this folder copy all of the source files of your website. This will be your backup site if anything ever happens to your Dropbox.
This file allows for a custom 404 page. Or in this case an alternate iframe.
Open the index.html file above and fill in the blanks as specified, but instead of your Dropbox public link, place the public link to the index in your /(Website Name) file.
Step 4: Link the Domain and Site Using DNS
Next you will need to go to https://www.dnspod.com/ and create and account. DNS pod will allow you to assign a DNS web address to your current http://Username.github.io web address.Click on the green "Add a Domain Button" then enter your chosen domain name. Next click on your domain name (In red). Press the green "Add Records" button and add two records to your domain. A "www" "CNAME" file to point to your Username.github.io and a "@" "CNAME" file to point to your domain name. NOTE the three name servers listed in your domain files ( A.DNSPOD.COM, B.DNSPOD.COM, and C.DNSPOD.COM)
Now you must log back in to your Freemon account.
Under the "Domains" tab select "My Domains". Next click the "Manage Domain" button on the right side of your favorite domain name. Under "Management Tools" select "Nameservers". Select "Use Custom Nameservers" and type the three nameservers from your DNSPod account in the spaces provided. When you are done select "Change Nameservers". Your website is now online at your chosen domain.
Step 5: Get Your Site on Google
This is the last and final step in the process. Go to Google Webmaster Tools (https://www.google.com/webmasters/tools/) and sign in with your Google account. Press the "Add A Property" button on the top right and enter your chosen domain. When prompted to verify ownership, select the "Alternate" tab and choose the "HTML tag" paste this tag into the head of your GitHub "index.html" file and press "Verify". You website will be on Google within a couple of hours.
Step 6: Test It Out and Enjoy!
Both of which are hosted in this fashion. Have a great day and enjoy your new website! :-)
Participated in the
Graphic Design Contest