How do I add static pages to WordPress?

1 Views

How do I add my own static HTML pages to WordPress?

For example, let’s say I have a page, products.html, how would I add it to WordPress (any menu, etc.) and once added, how do I visit them, because WordPress had a typical URL structure?

Post Views: 1

Related posts

Leave a Reply

13 comments

  1. If you (as the OP asked) want it to appear without having to add .html, simply create a folder at the same location where your WP site’s index.php appears, and then name the file that you put inside that folder index.html.

    Example, if you have a WordPress installation at doesnotexist.com and you want to add a static page, separate from your WP installation, that people can get to at doesnotexist.com/wedding – create the folder named wedding, and put the HTML in an index.html file inside the wedding folder. You also can then of course put other files in that folder or in folders within it so that the static page can reference images, styles, code, etc.

    As someone said above, if the file for the URL exists, then WP won’t get invoked to route the request. If you later remove the “wedding” folder or the “index.html” file from within it, anyone who tries to get to doesnotexist.com/wedding then would be routed to WP and, if no matching permalink was found, they’d see the 404 page not found error or whatever your theme or a plug-in is set up to show for broken links.

  2. You do not need to install any additional plug-in. Just follow the following procedure and you are good to go.

    1. Create a page under Administration>Pages>Add new.
    2. Enter the name you want for your page, the custom URL and press publish.
    3. This would generate a record in your database under the wp_posts table. (wp_ is the default prefix for your wordpress tables. If you changed it during the installation procedure, replace it with your custom prefix). Find the ID that has the name of your page in the table.
    4. Go to wp-contentthemesYOUR_ACTIVE_THEME in your wordpress installation directory or in the sub-folders(it depends how the theme has been structured). There would be page.php file. Create a page-{ID}.php file in the same directory.
    5. It’s ready. Add any static html file to page-{ID}.php file.

    Now, if you go the custom URL, you can find the static content you put in page-{ID}.php file.

  3. Do you mean Page Templates?: Page Templates « WordPress Codex. You can make a new page template and modify the php and xhtml of it (and add static html), and then use that template when you generate a new Page in the wordpress editor.

    If you simply add a static html file to your wordpress directory, it may or may not work, depending on mod rewrite.

  6. Add a page with format page-{slug}.php for example page-products.php to your theme. You also need to add an empty page on wordpress under pages with that name i.e. if your for example your file is page-products.php, the id for the page you create on wordpress should be products . This should work.
    For more information, you can check this link https://developer.wordpress.org/themes/template-files-section/page-template-files/#creating-a-custom-page-template-for-one-specific-page.

  7. To do what you describe, put the products.html page in your public_html directory. Edit your wordpress theme’s header.php file to add to the menu section a link to the products.html page. You may have to use an absolute path in the URL depending on how you have things setup.

    If you want to retain the wordpress navigation on the products.html so you can browse back to the wordpress parts of your site, you’ll need to replicate the header html within that page.

    Based on this drawback and depending on your requirements I’d recommend considering using either pages or page templates as suggested in the other answers so that the products page is part of the wordpress layout and you can take advantage of a shared navigation / look and feel etc.

  8. As others have noted uploading a folder the main directory is the best way to do this.

    http://www.yoursite.com/products/index.html

    The important thing you need to realize is that WordPress will not know about this page, and it will not be included automatically in your sitemap.xml and submitted to Google.

    So you will need to fix that using Google Webmaster Tools if you want the page to be indexed correctly.

  9. You can use my plugin. Download from WP repository . After installation you will have HTML Pages option under Pages. It will output your custom HTML under custom URI of your choosing so you don’t have to mess around with folders.

    Update – exact steps to accomplish what you want:

    1) Install and activate a WordPress plugin called WP Custom HTML Pages

    2) Use the new submenu item (Pages->HTML Pages) to create a new HTML page

    3) In “Page Permalink” field enter the custom URI you wish to assign to your page, for example /my-html-page (at the time of writing this answer, it is required that the value you enter starts with “/” character) and in “HTML Page Code” field enter all the HTML and CSS of the page document that you wish to display

    4) Click “Publish” then go to yourwebsite.com/my-html-page and you should see your static HTML page, providing its status is set to “published”

  12. It may not be the best of solutions, but the way I got round this was adding multiple page templates. For example, I call one ‘contact-page’, then I create a contact page in the pages tab and apply that template. I then use the page template to display the static html.

    Not a perfect but gets the job done. 🙂

  13. If you have access to the theme folder you can use get_template_directory_uri() which will return the directory where your theme resides.
    So, for example, if you have welcome.html inside your theme directory, you can reference it inside your theme like this:

    For example:
    <a src="<?php echo get_template_directory_uri()?>/welcome.html"> Welcome</a>

    will open welcome.html, assuming it resides inside your theme directory.