{"id":208,"date":"2021-03-26T21:26:41","date_gmt":"2021-03-26T15:56:41","guid":{"rendered":"https:\/\/basicwebguide.com\/?p=208"},"modified":"2022-05-10T00:02:04","modified_gmt":"2022-05-10T04:02:04","slug":"how-to-upload-html-file-to-website","status":"publish","type":"post","link":"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/","title":{"rendered":"How to Upload HTML File to Website? 4 Best Proven Methods"},"content":{"rendered":"<p>HTML is the most important and inevitable part of the Internet; even without HTML, there is <strong>no webpage on the internet<\/strong>. All websites have inbuilt <strong>HTML codes<\/strong> in the form of themes, content, images, etc.<\/p>\n<p>But in miscellaneous cases, you have to upload some important HTML files. Let me know you <strong>how to upload HTML file to website. Learn:\u00a0<\/strong><a href=\"https:\/\/basicwebguide.com\/how-to-copy-a-website-design-is-copying-a-website-design-legal\/\">How to copy a website design<\/a><\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_61 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title \" >Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/#What_is_HTML\" title=\"What is HTML?\">What is HTML?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/#Why_Upload_an_HTML_File\" title=\"Why Upload an HTML File?\">Why Upload an HTML File?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/#How_to_Upload_HTML_file_to_Website\" title=\"How to Upload HTML file to Website?\">How to Upload HTML file to Website?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/#Method_1-_Upload_through_the_post\" title=\"Method 1- Upload through the post\">Method 1- Upload through the post<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/#Method_2-_Using_cPanel\" title=\"Method 2- Using cPanel\">Method 2- Using cPanel<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/#Method_3-_Using_FTP_client\" title=\"Method 3- Using FTP client\">Method 3- Using FTP client<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/#Method_4-_Via_Admin_Dashboard\" title=\"Method 4- Via Admin Dashboard\">Method 4- Via Admin Dashboard<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/basicwebguide.com\/how-to-upload-html-file-to-website\/#Conclusion\" title=\"Conclusion\">Conclusion<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"What_is_HTML\"><\/span><strong>What is HTML?<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><img fetchpriority=\"high\" decoding=\"async\" class=\"size-medium wp-image-218 aligncenter\" src=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/170427-637363828865101045-16x9_2-300x169.jpg\" alt=\"How to upload html file to website \" width=\"300\" height=\"169\" srcset=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/170427-637363828865101045-16x9_2-300x169.jpg 300w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/170427-637363828865101045-16x9_2-768x432.jpg 768w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/170427-637363828865101045-16x9_2-800x450.jpg 800w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/170427-637363828865101045-16x9_2-20x11.jpg 20w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/170427-637363828865101045-16x9_2.jpg 820w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/p>\n<p>In simple words or by definition, <strong>HTML is a &#8220;hypertext markup language.&#8221;<\/strong>\u00a0It is the code used to create <strong>electronic documents<\/strong> on the internet, also known as <strong>Webpages<\/strong>. HTML codes on websites and web pages make sure that your content&#8217;s text and images are formatted in the right way.<\/p>\n<p><strong>HTML<\/strong> is comprised of <strong>series of elements<\/strong> that tell the web browser how to display the content. In other words, HTML is responsible for design and structure the webpages and define &#8220;<strong>what is heading<\/strong>,&#8221; &#8220;<strong>what is the subheading<\/strong>,&#8221; &#8220;<strong>what is a paragraph<\/strong>,&#8221; etc.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Why_Upload_an_HTML_File\"><\/span><strong>Why Upload an HTML File?<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>As we said, all web pages, images, and websites have <strong>inbuilt HTML codes,<\/strong> especially WordPress provide every basic to advance feature, then; why we need to upload <strong>HTML files<\/strong>? This question is really common and tricky as well.<\/p>\n<p>The web page incorporates all required <strong>HTML codes,<\/strong> but it cannot satisfy every need and ambition of humans! after all, it just a computer system. There could be individual needs to upload <strong>HTML files<\/strong>. Let&#8217;s understand some common reasons:<\/p>\n<ul>\n<li><strong>Your Favorite Template-<\/strong> This is the most common reason behind it. The web page hosting platform comes with thousands of templates, but if your needs are different, then you <strong>have to upload an HTML file<\/strong> of your favorite template.<\/li>\n<li><strong>Custom Layout-<\/strong> Custom layout cites the layout designed for the user according to his needs. Users can include items, text, design, widgets, etc., based on their requirements, and to do this, you have to upload an <strong>HTML file of your layout<\/strong>.<\/li>\n<li><strong>Google Search Console-<\/strong> <a href=\"https:\/\/search.google.com\/search-console\/\" target=\"_blank\" rel=\"noopener\">Google search console<\/a> useful to index your web pages on <a href=\"https:\/\/mailchimp.com\/marketing-glossary\/serp\/\" target=\"_blank\" rel=\"noopener\"><strong>search engine result pages (SERP)<\/strong><\/a> and rank your post. To get your SERP results, you have to verify your website first on GSC, and to verify; the Google search console asks you to upload an <strong>HTML file<\/strong> on your webpage.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"size-medium wp-image-219 aligncenter\" src=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Google-Search-Console-Tool-now-has-an-Android-App-Filter_1-300x193.jpg\" alt=\"How to upload html file to website \" width=\"300\" height=\"193\" srcset=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Google-Search-Console-Tool-now-has-an-Android-App-Filter_1-300x193.jpg 300w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Google-Search-Console-Tool-now-has-an-Android-App-Filter_1-20x13.jpg 20w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Google-Search-Console-Tool-now-has-an-Android-App-Filter_1.jpg 733w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/p>\n<p>We hope now you understand why you need to upload an HTML file. Now, Let&#8217;s understand <strong>how to upload HTML files to website.<\/strong><\/p>\n<h2><span class=\"ez-toc-section\" id=\"How_to_Upload_HTML_file_to_Website\"><\/span><strong>How to Upload HTML file to Website?<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>There are several methods of uploading <strong>HTML files,<\/strong> but we are going to some major and basic methods. <strong>Learn<\/strong>, <a href=\"https:\/\/basicwebguide.com\/how-to-copy-html-code-from-a-website\/\">How to copy HTML from a website<\/a>.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Method_1-_Upload_through_the_post\"><\/span><strong>Method 1- Upload through the post<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>This is the basic and simplest way to upload HTML and other files as well. Every blogger can easily upload HTML files with a dashboard of WordPress.<\/p>\n<ul>\n<li><strong>Step 1- <\/strong>Go to the dashboard of your WordPress. If you installed Gutenberg editor, then click on insert heads to the &#8220;file&#8221; block.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"size-medium wp-image-221 aligncenter\" src=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/quick-view-of-the-block-editor_1_1-300x156.jpg\" alt=\"How to upload html file to website \" width=\"300\" height=\"156\" srcset=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/quick-view-of-the-block-editor_1_1-300x156.jpg 300w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/quick-view-of-the-block-editor_1_1-768x399.jpg 768w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/quick-view-of-the-block-editor_1_1-20x10.jpg 20w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/quick-view-of-the-block-editor_1_1.jpg 917w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/p>\n<ul>\n<li><strong>Step 2-<\/strong> After clicking on file block, now you can find the option of <strong>upload HTML<\/strong>. Go ahead and <strong>upload your HTML<\/strong> to the required field.<\/li>\n<li><strong>Step 3<\/strong>&#8211; If you use <strong>Classic editor,<\/strong> then go to the dashboard and click on add media.<\/li>\n<li><strong>Step 4-<\/strong> In the media option, you can upload any type of file but as you are searching for an HTML file, so directly click on the <strong>HTML file<\/strong> and finally click on upload.<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"Method_2-_Using_cPanel\"><\/span><strong>Method 2- Using cPanel<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><strong>cPanel<\/strong> is the web hosting control software to simplify the process of<strong> hosting a website<\/strong> to the owner. It facilitates the <strong>Administrative control<\/strong> of the website to manage settings and catalog your important data.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-222 aligncenter\" src=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Root-Directory-300x226.png\" alt=\"How to upload html file to website \" width=\"300\" height=\"226\" srcset=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Root-Directory-300x226.png 300w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Root-Directory-768x580.png 768w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Root-Directory-20x15.png 20w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Root-Directory.png 938w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/p>\n<p>cPanel is also useful to upload crucial <strong>HTML files<\/strong> to design your website properly. This method could be a little complicated, but you can upload any intricate <strong>HTML file in this manner<\/strong>. Let see how to upload HTML file via cPanel:<\/p>\n<ul>\n<li><strong>Step 1-<\/strong> Login to your hosting account like; GoDaddy, Bluehost, HostGator wherever you hosted your website.<\/li>\n<li><strong>Step 2-<\/strong> Now, heads to the cPanel of your hosting account and access the file manager from cPanel.<\/li>\n<li><strong>Step 3-\u00a0<\/strong>Next step is to create a new folder to upload your HTML file; upload your HTML file in the newly created folder by the name of index.html.<\/li>\n<li><strong>Step 4-<\/strong> The uploaded <strong>HTML file<\/strong> is a zipped HTML file, and you have to unzip it by selecting the &#8220;<strong>Extract<\/strong>&#8221; option. You will get several HTML files, including font style, images, JavaScript. Now you can upload any required HTML files to your website as they are stored <strong>cPanel of your hosting<\/strong>.<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"Method_3-_Using_FTP_client\"><\/span><strong>Method 3- Using FTP client<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>FTP is the abbreviation of the <strong>file transfer protocol<\/strong>. FTP client is software designed to transfer files between the computers and the client&#8217;s server or hosting server. <strong>FTP file transfers<\/strong> only work in a live internet connection. We suggest using <a href=\"https:\/\/filezilla-project.org\/\" target=\"_blank\" rel=\"noopener\">FileZilla<\/a>, the best FTP software.<\/p>\n<ul>\n<li><strong>Step 1-<\/strong> First, generate a backup of your web page to avoid any <strong>undesirable activity<\/strong>.<\/li>\n<li><strong>Step 2-<\/strong> Get your <strong>FTP login credentials<\/strong> from your web hosting account and log in to your <strong>FTP client<\/strong> account and connect your web host account with it.<\/li>\n<li><strong>Step 3-<\/strong> Collect your host, username, password, and port number and enter into <strong>FileZilla<\/strong>.<\/li>\n<li><strong>Step 4-<\/strong> In the <strong>FileZilla URL address<\/strong>, enter your site name, preceded by &#8220;SFTP.&#8221; For example, &#8220;sftp:\/\/basicwebguide.com\/.&#8221;<\/li>\n<li><strong>Step 5- <\/strong>After filling in all details, click on &#8220;<strong>Quick connect.<\/strong>&#8221; Once all this is done, upload your HTML file from your computer to your webpage directly.<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"Method_4-_Via_Admin_Dashboard\"><\/span><strong>Method 4- Via Admin Dashboard<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>This technique is quite similar to the first method but a little comprehensive in terms of simplicity:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-224 aligncenter\" src=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Screenshot_20210326-181423_1-98x300.jpg\" alt=\"How to upload html file to website\" width=\"98\" height=\"300\" srcset=\"https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Screenshot_20210326-181423_1-98x300.jpg 98w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Screenshot_20210326-181423_1-336x1024.jpg 336w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Screenshot_20210326-181423_1-7x20.jpg 7w, https:\/\/basicwebguide.com\/wp-content\/uploads\/2021\/03\/Screenshot_20210326-181423_1.jpg 424w\" sizes=\"(max-width: 98px) 100vw, 98px\" \/><\/p>\n<ul>\n<li>Navigate to the Admin panel of your <strong>WordPress dashboard<\/strong> and click on the post on the left sidebar,<\/li>\n<li>Then create a new post or open an existing one,<\/li>\n<li>Now go to add a new block, then add a file block,<\/li>\n<li>Finally, choose your <strong>HTML file<\/strong> from your drive or file manager,<\/li>\n<li>Click on upload.<\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"Conclusion\"><\/span><strong>Conclusion<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Uploading an HTML file is not <strong>complicated in general practice<\/strong>; you can directly upload it from the WordPress dashboard whether you are using a classic editor or Gutenberg editor. But if you want to make any <strong>major modifications<\/strong> to your website or webpage or upload multiple files, <strong>this task becomes a bit hard<\/strong>.<\/p>\n<p>Directly uploading an <strong>HTML file<\/strong> can make your website unstructured, so you have to follow the right methods to do that. We know the <strong>difficulties of our readers<\/strong>, that&#8217;s why we come up with this article on <strong>how to upload HTML file to website.<\/strong> And we hope you also follow these guides in the future and <strong>easily develop your website<\/strong>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>HTML is the most important and inevitable part of the Internet; even without HTML, there is no webpage on the internet. All websites have inbuilt HTML codes in the form of themes, content, images, etc. But in miscellaneous cases, you have to upload some important HTML files. Let me know you how to upload HTML [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":217,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[7],"tags":[160,146,151,157,144,162,141,158,142,150,152,161,140,156,143,145,155,154,147,159,153,149,148],"_links":{"self":[{"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/posts\/208"}],"collection":[{"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/comments?post=208"}],"version-history":[{"count":2,"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/posts\/208\/revisions"}],"predecessor-version":[{"id":2085,"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/posts\/208\/revisions\/2085"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/media\/217"}],"wp:attachment":[{"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/media?parent=208"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/categories?post=208"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/basicwebguide.com\/wp-json\/wp\/v2\/tags?post=208"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}