Upload an HTML File to WordPress

Without ever having to upload any custom HTML files, you may develop pages and produce content within WordPress by default. Because the WordPress core includes built-in content types, this is the case. Furthermore, the WordPress theme you choose will almost certainly come with a set of pre-designed page templates that you can use to construct a unique website that suits your requirements.

Aside from that, you may use WordPress landing page plugins to generate personalized page templates for site visitors who arrive via search results, email campaigns, or even social media.

So, uploading HTML files to WordPress is frequently unnecessary because everything you need to structure your website is already there. However, there are a variety of reasons why you might wish to learn how to upload an HTML file to WordPress, some of which aren’t related to design.

As a result, I’ll show you how to submit HTML files to WordPress in this post. I’ll also go through why you’ll want to have this talent so that you’re ready for anything.

Contents Table of Contents

What is an HTML File?

What is the Purpose of Uploading an HTML File to WordPress?
Method: Using the WordPress Dashboard to Upload an HTML File to WordPress
How to Upload an HTML File to WordPress Using an FTP Client Client
How to Use cPanel to Upload an HTML File to WordPress
What is the difference between an HTML file and a text file?
Tim Berners-Lee created HTML, which stands for Hypertext Markup Language, in 1990. In a nutshell, HTML is the code that is used to construct electronic documents, often known as webpages, on the internet. In reality, HTML code was used to create every webpage you see on the internet.

The HTML code on your site’s web pages is in charge of ensuring that the text and graphics in your content are formatted correctly.

Web browsers would be unable to visually display the structure of your website if it were not for HTML. Your website, on the other hand, will seem wonderful for site visitors if you use the appropriate HTML code to build the basis for your website and a little CSS code to add in some design elements.

What is the difference between an HTML template and a CSS template?

So, you’re aware that HTML is the code that creates the structure of individual webpages on the internet.

But, first and foremost, what is an HTML template?

An HTML template is a pre-designed set of HTML files that includes text, pictures, and font style and Javascript support files. In other words, an HTML template is a ready-made HTML code package that you can easily upload and utilize on your website.

When you utilize an HTML template on your WordPress website, you simply upload the file and fill in the text and pictures that you want to appear in the template on the front end.

It’s crucial to understand the difference between HTML templates and WordPress themes:

WordPress Themes: Despite the fact that you insert text and images into WordPress themes, they are in charge of the overall appearance and feel of your website. Many of the changes you make to your site’s theme are global, meaning they affect the entire site.
HTML Templates: HTML Templates are distinct zip files that you upload to your website. They only have an impact on the appearance and feel of a particular webpage on your site. To put it another way, any modifications you make to an HTML template you’ve submitted will only effect that webpage.
Unfortunately, many individuals are unaware of the distinctions between themes and HTML templates, and thus use the phrases “theme” and “template” interchangeably.

Why You Would Need to Upload an HTML File to WordPress?

You might want to submit an HTML file to WordPress for a variety of reasons:

You Have Your Favorites: If you had a nice HTML template on a previous website and wanted to use it on your new site, rather than re-doing everything, you could upload the template to your new site. This will save you time and ensure that it appears identical.
If your current WordPress theme doesn’t support a specific page layout, you can upload an HTML file with the design you desire and tweak it as needed.
Finally, you may need to authenticate your WordPress website with Google Search Console, and you should do so by uploading a Google HTML verification file, which is the recommended option.

The way your website appears in search engines, particularly large ones like Google, has an impact on your website’s success.

It’s for this reason why tools like Google Search Console exist. With Google Search Console, you can rest assured that your site will be indexed and ranked in relevant search results, with the goal of reaching the first page.

Google Search Console also gives data on your current SERPs (search engine result pages), allowing you to optimize your SEO efforts and increase site clickthroughs.

The problem is that in order to use Google Search Console, you must first verify your WordPress site. And it just so happens that uploading a Google HTML verification file is one of the finest ways to do this.

Now let’s look at the various methods for uploading an HTML file to WordPress.

1. Method: How to Upload HTML File to WordPress in the WordPress Dashboard

The WordPress dashboard is the first technique we’ll look at for submitting an HTML file to WordPress.

Because you’ll be uploading the HTML file directly through a post, page, or the Media Library, you’ll only need your website’s backend and an HTML template to complete this process.

Insert a ‘File’ block in the Gutenberg Editor to upload an HTML file through a post or page. Then, to upload the HTML file, click Upload.

Gutenberg allows you to upload an HTML file.
If you’ve disabled Gutenberg and are using the Classic Editor, this is how it looks. To add your HTML file, simply select Add Media and then Upload.

After selecting the HTML file to upload, click Insert into post. This instantly saves the file to your Media Library and puts the file’s link into the post or page.

In the Classic Editor, drag and drop an HTML file.
You can submit the HTML file straight to your Media Library rather than to a post or page in WordPress. In the WordPress dashboard, go to Media Library, click Add New, and select the HTML file from the location where you saved it (e.g., your computer, hard drive, or external storage).

Keep in mind that if you use Gutenberg to upload an HTML file, you can get an error. This is how it will appear:

This file type is not allowed.
For more information on how to fix the “Sorry, This File Type Is Not Permitted for Security Reasons” error in WordPress, click here.

2. Method: How to Upload HTML File to WordPress Using a File Transfer Protocol (FTP) Client

The most basic technique is to upload HTML files using the WordPress dashboard. However, if you have a huge template with several files, you should utilize an FTP software like FileZilla.

When you want to work locally on a test site before pushing any changes to your live site, an FTP client comes in handy. If something goes wrong, this will prevent any unnecessary downtime.

To begin, make a backup of your website because you never know what the HTML file will do after it is uploaded to your site.

Then, launch your FTP client.

For all plans, Info Kinsta provides automated daily and system-generated backups. Hourly backups are also provided as an option.

Now you’ll need to input your FTP credentials to connect to your web host account. Typically, this information can be located in your site hosting account. If you’re having difficulties finding it, contact your host for assistance.

Do you want to discover how we grew our traffic by over 1000%?
Join the 20,000+ people who receive our weekly email with WordPress insider secrets!

Now is the time to subscribe.
If you’re using Kinsta hosting, go to MyKinsta and click Sites in the dashboard, then Info to acquire the credentials you’ll need.

sftp information
MYKinsta will provide you with your SFPT information.
When you do this, your credentials should appear under SFTP/SSH. Your username, password, and port will be required.

username password port sftp details
SFTP information
The following is the information you’ll need to enter into FileZilla:

Your site’s domain name prefixed by “sftp:/” is the host. You’ll need to type in sftp:/www.mysite.com, for example.
From your MyKinsta dashboard, enter your username.
From your MyKinsta dashboard, enter your password.
From your MyKinsta dashboard, choose a port.
At the top of the FileZilla interface, it will look like this:

Using FileZilla to log in
Click Quickconnect after you’ve input your credentials.

It’s now time to upload your HTML file to WordPress from your computer. Begin by going to the right side of your screen and browsing to your website’s root folder (which contains the wp-content folder, the wp-config.php file, and so on).

Then go to the left side of the screen and look for the HTML file you saved. To add it to your website, right-click it and choose Upload from the menu. Follow this brief guide to see all hidden files in Filezilla.

The HTML file has been uploaded.
The file has been successfully posted to WordPress, as you can see. Type your website’s URL into your browser and add the name of the HTML file to the end to see if it’s displayed on your site. For example, it may be www.mywebsite.com/html-file.

You’ll be sent to the new webpage you made using the HTML file when you do this.

3. Method: How to Upload HTML File to WordPress Using cPanel
The final approach we’ll show you includes uploading an HTML file to WordPress using cPanel and the File Manager.

Are you fed up with WordPress difficulties and a sluggish host? We offer world-class support from WordPress specialists who are available 24 hours a day, seven days a week, as well as lightning-fast servers. Take a look at our plans.

Begin by going to the File Manager in the cPanel of your hosting account.

cPanel’s FileManager
You have two choices once you’re in the File Manager:

Create a New Folder: To upload your HTML file, create a new folder in your site’s root folder.
Publish to the Root Folder Rather of creating a new folder, upload the HTML to WordPress directly. If you choose to do it this way, unzip the HTML file where you saved it, rename the index.html folder, and then rezip the file to continue uploading to WordPress. If you don’t, your site’s homepage will be overridden by the HTML template.
We’ll make a new folder for this example because there are a few extra steps involved.

Kinsta isn’t reliant on cPanel. Kinsta, on the other hand, offers its own proprietary hosting dashboard called MyKinsta.

Create a new folder in WordPress and upload an HTML file to it.
To begin, go to your website’s root folder (which contains the wp-content folder, the wp-config.php file,etc.). Then select New Folder from the drop-down menu.

Choosing a New Folder in the File Manager

Create a new folder by giving it a name and clicking Create New Folder.

In cPanel, make a new folder.
Double-click the newly formed folder, then pick your HTML file by clicking Upload.

a button to upload
After that, look in the folder for your compressed HTML file.

HTML file (zipped)
By right-clicking and selecting Extract, you may now unzip the HTML file.

Obtain the HTML file
To complete the unzipping procedure, click Extract Files in the modal window that appears. When you unzip the HTML file, you’ll see all of the other files that come with the template. Remember that you’ll see CSS, font style files, pictures, and JavaScript as a result of this.

HTML files that have been extracted
All you have to do now is type your site’s URL into the browser and add the new folder’s name to the end to ensure the HTML template and files were uploaded.

Don’t worry if you get a 404 error. This is a typical WordPress problem that is simple to fix.

You’ll get a 404 error after uploading your HTML files if your server doesn’t support redirection and the index.php file isn’t redirected when you load the URL in your browser.

Stay in the File Manager and double-click your.htaccess file to repair this. Then, after saving your changes, add the following code:

(.*)index.(php|html?) RewriteRule

[R=301,NC,L] $ /$1
This code will load your index.php file in the browser after redirecting it.

Do you want to add an HTML file to your WordPress site? This comprehensive guide will show you how to accomplish it quickly and easily. CLICK HERE TO TWEET

Summary

Because it allows website owners the flexibility they need to develop unique websites that stand out from the competition, WordPress is the most widely used Content Management System. The ability to upload an HTML file to WordPress using any of the techniques listed above is simply one more example of how WordPress caters to site owners’ needs and allows them to customize their sites as needed.

Furthermore, understanding how to upload an HTML file to WordPress is a useful skill to have in case you need it. After all, you never know when you’ll stumble upon a great HTML template or require a page layout that your theme doesn’t provide.