Many of the sites we create in our cpanel are installed via a cpanel tool because they have complex file structures and often require database set ups. But there are quite a few web site themes that are all self contained HTML/CSS/Javsscript files that we can upload directly to our domain with the File Manager.

This activity walks you through the steps to put a self-contained web site within a directory of your site.

From cpanel, look under Files, and open the File Manager tool. Use the left side navigation to open your public_html directory, this is the directory that corresponds to the web site that is the same address as your domain name.

While public_html is open, from the top menu click +Folder, which lets us create a new directory.

In this case, we want choose it to be a directory named me (or any other directory/url name you desire). While I may have one site running from http://extendlabs.ca/ the one I make a folder for at http://extendlabs.ca/me is a completely separate site.

For this activity, you will use a self-contained version of a web site that has been packaged as a zip file- download it now (link for eventually-extend.zip) and save the ZIP file. FYI this is one of several high quality creative commons licensed themes from HTML5up

In the File Manager, click Upload and select the eventually-extend.zip file you have on your computer. Once uploaded to your me directory, select the zip file, and click Extract from the File manager menu to place all the web files in the right location.

If all went well, you should have a web site like http://extendlabs.ca/me running under your own domain, from the directory you created.

This theme animates a series of 4 images in the background, maybe you would like to change the images to ones of your own choosing. Open the images directory to reveal four files- bg1.jpg, bg2.jpg, bg3.jpg, and bg4.jpg.

To replace one of these with your own image, first select one, say bg1.jpg, then click Delete from the top menu. Now click Upload to choose an image from your computer to replace it, say froggy-five.jpg. Once this new file has been uploaded to the images directory, select it, and click Rename to change the file to be bg1.jpg.

If you swap all files, you will have your own images appearing in the background. But what about the text on screen? Go up one level back to the me directory, and select the main content file index.html. You can then click Edit if you don’t mind seeing HTML code or HTML Edit for a visual editor. From here you can change the header and body text, and even the social media links in the footer.

The point here is knowing how and where to upload files within your domain to make a stand alone site. What can you upload? Plenty.

Example for "Adding a Self Contained Site with File Manager":
http://extendlabs.ca/me

Complete This Activity

After you do this activity, please share it so it can appear with other responses below. If your response exists at a public viewable URL, you can add the information directly to this site.

Add A Response

3 Responses Completed for this Activity

  • Down the Rabbit Hole (Lynn Cartan, @LynnCartan)

    For this activity, I ended up going out to HTML5UP and picking up the Spectral template.  Originally I had just intended to just unpack the site and perhaps change an image or two.  Instead, I found myself looking at how I could change the title by going in and editing code.   From there, I added… Read more »

  • Self Contained Site – Spooky! (Irene Stewart, @IrenequStewart)

    I put the site in a subdomain so I could see it, please let me know if I was supposed to put it somehow off the main site instead. I decided to make some changes in the html view.

  • That was fun!! (Lisa Koster, @lkoster)

    This was a pretty easy task and lots of fun. Instead of downloading the image files, I just renamed them.  When I chose my files to upload, I renamed them first, then uploaded them.   It worked like a charm!!  So exciting!! I modified the index file to add in my own information. I even changed… Read more »

Creative Commons License
This work by Alan Levine is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.

Leave a Reply

Your email address will not be published. Required fields are marked *