Introduction
By nature, WordPress is very powerful. It can be as complex or as simple as you wish. With that in mind, how much you want to use WordPress with your existing website is totally up to you. There may be only a few features of WordPress you want to use when integrating it with your site, or you may want your entire site run with WordPress. This tutorial will guide you through making your WordPress site look like your current design. We will start with how to make a WordPress blog look like the rest of your site. Then we can move on to making your entire site running on WordPress.
These directions will not work on a MultiSite Network.
Begin the transformation
First, assume you have an existing site at http://myexample.com. Next, create a new sub-directory (folder) at your site and call it 'blog' (you could use something other than blog, but you must create this sub-directory). So you now have an empty sub-directory at http://myexample.com/blog/. Now, download WordPress and upload all of its files into this new folder, and install Wordpress.
Grab the header
In order to transform regular PHP pages into ones that utilize WordPress, you need to add either of the following code snippets to the start of each page.
<?php
/* Short and sweet */
define('WP_USE_THEMES', false);
require('./wp-blog-header.php');
?>
<?php
require('/the/path/to/your/wp-blog-header.php');
?>
The Loop
It is necessary to include The Loop in your pages to effectively take advantage of the multitude of Template Tags or plugins available. Familiarize yourself with The Loop and the basics of The Loop in Action to get underway with integrating the power of WordPress into your website.
Examples
Generate a list
In the event you want to show ten posts sorted alphabetically in ascending order on your web page, you could do the following to grab the posted date, title and excerpt:
<?php
require('/the/path/to/your/wp-blog-header.php');
?>
<?php
$posts = get_posts('numberposts=10&order=ASC&orderby=post_title');
foreach ($posts as $post) : setup_postdata( $post ); ?>
<?php the_date(); echo "<br />"; ?>
<?php the_title(); ?>
<?php the_excerpt(); ?>
<?php
endforeach;
?>
Last three posts
Display the last three posts on your web page.
// Get the last 3 posts. <?php global $post; $args = array( 'posts_per_page' => 3 ); $myposts = get_posts( $args ); foreach( $myposts as $post ) : setup_postdata($post); ?> <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a><br /> <?php endforeach; ?>
Making a theme
The first portion of this tutorial described how to take components of WordPress and integrate them into your existing site. You may wish to stop right now, but perhaps you would like to create a WordPress theme that would eventually replace web pages on your site.
You will need to create a custom theme. A theme is a set of files used to tell WordPress how to display the site. Using_Themes. Go to your WordPress Themes folder (located at /wp-content/themes/) and create a new folder, call it "mytheme". This is where you will be adding files to control your site's look. You may wish to acquaint yourself with Theme_Development at this time. The basic theme files are index.php, style.css, single.php, and comments.php.
A little known, but very helpful HTML element, <base> is going to help you out a lot. It instructs the browser to use a specified URL for relative paths:
<base href="http://myexample.com" />
Normally, the <base> would be your current URL. For example, the default <base> at your blog will behttp://myexample.com/blog/. By changing it with the <base> element, you tell the browser to look for files athttp://myexample.com/. Why is this useful? When copying and pasting HTML from your current site, you will have references to something like:
<img src="me.jpg" alt="" />
When you copy this HTML to your theme, the browser will be looking for http://myexample.com/blogs/me.jpg, when the file actually exists at http://myexample.com/me.jpg. Using <base href="http://myexample.com" />, the browser is told the right place to find the files and you do not have to edit every reference to every file that you copied from your main site.
Performance
Although WordPress is fast, it does contain a substantial quantity of code that needs to be loaded each time a page is displayed. This may or may not affect performance depending on the hosting environment, but on a shared hoasting environment using SuPhp (and thus without op code caching) it can add several seconds to each page load.
