I get good questions now and then from readers who want to tweak and configure their WordPress blog. I usually have the answers but if not I know where to send them to get the help they need. Today I got a question about HTML:
How do I bring an HTML page into the default theme main page in WordPress?
Could you give me a few pointers? Thanks.
Now this question came from someone who is a professional programmer so I am going to assume the basic knowledge of wiki(CSS) and PHP is there (if not, I apologize just let me know). I’m posting the Q&A because it is an excellent question that opens up a quite wide area of discussion which I would most definitely enjoy. Okay, here goes . . .
Wordpress is comprised of CSS, PHP, and HTML. However, it is mostly run by PHP and CSS. There are varying levels at which I have delved into Wordpress and made modifications. Because there are so many variable items that come into a blog: ie; variable sized photos, banners in the sidebar and header, plugins, and themes . . . it is usually preferable for a beginner or novice to simply find a theme one likes and then make only minor mods within that person’s realm of knowledge. Going out from there can get scary. (Just telling you from personal experience). Having said that, it is absolutely possible to put HTML code into your Wordpress template files (Header, index, footer, sidebar, etc.) Is it the best way to put things in . . . no. Will it work? Yes. Do we care if it’s the best way? No ;) The best way to tweak Wordpress is through either CSS or PHP changes. The PHP stuff is usually offerred through plugins and the CSS requires you doing your homework. There are a lot of amazing tutorials if you just do a simple Google search.
OKAY NOW YOUR QUESTION!!!
If you go into admin and then options and then reading, you can select the front page to be a static page from within your wordpress installation. SO . . . the way to get your HTML page as the front is to go to admin, then write then write page. Then, in the CODE editor paste your page’s code (minus the HTML wrap and header info). Save it. Now this page can be selected from that “static page” area I mentioned earlier.
That’s the only way I know of to get an HTML page on the front of your blog. You could also do a redirect, but those can get tricky when it comes to Wordpress, I don’t know how you could get back home if you wanted to.
Okay . . . I expect this will be a process so feel free to tell me I missed the point or if you need anything clarified and we will go from there ;)
PS I hope it helped!
Hi. I'm Damien Riley, MA.
8 Comments
Hi Damien,
Thanks very much for the detailed info and instructions, which had me created a HTML page with the default theme in it. I’ve just begun to learn PHP, CSS and HTML :-). My other programming lanugage skills may make my learning easier here.
Here are my additional questions and goals:
1. After selecting the new page as a static page in the Front page field, my latest posts can No longer be picked in the Front page displays, have I understood it correctly?
2. By the Theme default, there is a new menu item created along with the newly created page. Instead of creating the new menu item “mytest”, I’d prefer the new page being invoked whenever one clicks on the “MYTEST” popup menu items. (I’ll also try the WordPress Forums)
Uh, for #2, I’ve been testing Header.php, which has the function wp_list_pages(). This funtion seems to be generating each page number (i.e. “?page_id=15″ & etc). Thus, I am reading this page:
codex.wordpress.org/wp_list_pages
Thanks, Damien.
The codex is the bomb! Hang out there for sure. There’s also a section called Wordpress Lessons that might help.
I’d recommend looking for a theme you like rather than doing a static front with a call to show recent posts. That can be done for sure, but it’s advanced! More than I could explain here. Also, if I knew something of what you were planning to do, maybe I could help better that way. You have to settle sometimes between what you envision and what is possible. Keep me posted on the codex and one of these days, gimme your link ;) I’ll promise to keep it under wraps!!!
Hi Damien,
Thanks for showing me how to navigate in WordPress, which is still very new to me.
Uh, I’ve just figured out the problem and I am so happy that it’s working now :-).
In a default theme, in order to load a page linked to a mouse over menu item or any menu item, here are the steps:
1. Create a page and save it. Do not publish it because it will create an extra menu item(which is not what I want). (login to WordPress, go to Manage->Pages).
2. Place the page id NUMBER that was created in step 1 in the desired URL path for the Mouse Over menu item. For example:
Mytest
Oh, it doesn’t let me placing one line simple code here. The example is basically to add div class=”POST” and A href=”YourdomainPath/?page_id=NUMBER”
Misty! I am so pleased to see you are making your Wordpress dreams come true! You taught me something about that page creation (without publishing) thing THANK YOU!
Hi Damien,
Sorry, not publishing the page had problems with some browsers. After some in depth testing, here is solution seems to work consistently ;-):
1. Publish the page in WordPress.
2. Use the ID generated in step1 in the menu item href wherever it is(for example, href=”http://noname/?
page_id=19″). It is in Header.php in my case.
3. Excluding page 19 from the menu bar after the page is published by using exclude parameter
TAG ?php wp_list_pages(’title_li= &exclude=19′); ? TAG
Thanks for everything, I will be back soon.
Looks like you’re gettin’ to be a Wordpress code pro already! Good job.