Adding HTML Pages into WordPress Theme

  • tfx2010

    (@tfx2010)


    13 years, 8 months ago

    Hi,

    This is my first post as I am newbie and really hope someone can assist me.

    Within my HTML/CSS website that I am converting over into a WordPress CMS theme, there are 7 menu options that go to individual html pages.

    Now based on this, what is the best way to get these 7 individual html pages that I created using Dreamweaver into my WordPress CMS theme, i.e. is there a backend means or do I directly add these individual pages as the WordPress Admin, under the Pages option?

    Unsure, but can I just take my about-us.html page source, that I created in Dreamweaver, go into WP-Admin, Pages, Add New Page and drop the html code into the html tab within the tags, which might also include images for me to update again later on?

    If not, how else can I do it as these pages will not be STATIC pages as I would like to alter the text/images down the track?

    I’ve currently got my menu options setup as follows:

    <li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About Us</a></li>

    Also, how can I link back to the WP pages, using a href tag?

    Thanks.

    Tony.

Viewing 6 replies - 1 through 6 (of 6 total)
  • vtxyzzy

    (@vtxyzzy)

    13 years, 8 months ago

    I believe that you can just create a WP Page for each of your existing pages and copy the html into them. This assumes that the html content will look OK inside the WP theme you have chosen. Why not try one to see how it goes. If it doesn’t work, you can always delete the page.

    Be sure you are not in the ‘Visual’ mode in the editor when you paste in the html, or it will mess it up.

    As for adding the pages to a menu, the way you do that depends on the theme you use. Many themes have menu options built in. Others require you to do some php coding to set up a menu.

    Thread Starter tfx2010

    (@tfx2010)

    13 years, 8 months ago

    Hi,

    Thanks for the reply and the info. Just a few more queries pls:

    1) Has this not been done before, where a developer has a site that they developed using straight HTML/CSS and then created their own WP theme based on their original HTML/CSS design?

    2) For these individual pages that I want to move into WP, they require stylesheets that fall part of the header.php file – will these pages that I add into WP pick up these stylesheets in the header.php file or do I need to do something to ensure that they do?

    3) Can I use <php bloginfo(“template_url”) ?> notation inside my HTML pages as these pages point to images inside my images folder that I need to access?

    Thanks.

    EMG

    (@emg)

    13 years, 8 months ago

    Hi there! 🙂

    I will see if I can answer your questions.

    1) Yes, it has been done before (I’ve converted an XHTML and CSS-only site to a WordPress site), but the templating and theming process of WordPress is a bit different than putting together a straight-up XHTML page.

    When you look at a theme, you will see that it is split into several parts – header, main index, single, page, footer, funtions etc – and so to ‘import’ an XHTML site, you will need to know how and where to split up your site structuring into the different templates.

    Additionally, a WordPress site operates on WordPress-specific PHP code hooks and tags (like, to display all your recent posts on your main index) so you will need to know where these would go in your template.

    Furthermore, if your individual pages all have different XHTML structuring and different CSS stylesheets, you will have to create custom Page templates for each of them.

    The CSS is the least problematic bit as you can assign all the same selectors used in the original XHTML site to the WordPress site.

    2) Stylesheets – unless specified otherwise through custom coding – are shared throughout the WordPress site.

    3) If by ‘HTML pages’ you mean your custom Page templates (page.php), then yes.

    vtxyzzy

    (@vtxyzzy)

    13 years, 8 months ago

    To add a little to what EMG has said, your WP theme probably uses a style.css file to contain all the CSS for the theme. You can probably just cut and paste the CSS sections from your pages into that file, preserving the selectors. Unless, of course, you have used the same selector with different attributes on different pages. In that case, you will have to rename the selectors to be unique for each page.

    As for point 3, WP usually uses a mysite/wp-content/uploads folder to contain uploaded images. You may want to follow that scheme so that future images will be stored in the same location as the older ones.

    Thread Starter tfx2010

    (@tfx2010)

    13 years, 8 months ago

    Hi Guys,

    Thanks for your replies – really appreciate it, but if don’t mind, I still have a few more queries:

    At the moment, I have split up my XHTML/CSS into the appropriate WP sections, i.e. index.php, header.php, sidebar.php, functions.php and footer.php. All this works
    fine when I run my web app in WP, using my localhost.

    The thing is, in my original XHTML/CSS site, my menu has seven menu options, which I will give you a sample of three, i.e.

    Menu Option => About Us, when clicked on, would call my about-us.html file in my site directory and present this screen to the user.
    Menu Option => Promotions, when clicked on, would call my promotions.html file in my site directory and present this screen to the user.
    Menu Option => Photo Gallery, when clicked on, would call my photo-galler.html file in my site directory and present this screen to the user.

    Now, based on this and it is this part that I am not sure about, how do I move these three html pages into WP, so that inside WP, when the user clicks on the menu
    options in WP sidebar menu, it picks up these three pages, like it used to do in my original XHTML/CSS site?

    I just need some understanding on how to do this and see whether I need to do anything with page.php to make use of these three pages.

    The whole idea, is that I want to allow the user, that will have wp-admin access, to go into the site and make any necessary changes to text or update images inside, say the Photo Gallery page.

    This site is purely a CMS and no blogging/posts/comments will be required/performed.

    If there are any tutorials on this as well, pls pass on.

    Thanks again guys – really appreciate your help and patience.

    vtxyzzy

    (@vtxyzzy)

    13 years, 8 months ago

    How you do this depends to some extent on how your theme handles menus.

    If the theme can show Pages in the menu, then you would create a new Page for each menu item. Then you would paste the HTML into the content of that page.

    If the theme cannot show Pages in the menu, you may need to add a menu plugin that will allow this.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Adding HTML Pages into WordPress Theme’ is closed to new replies.