Posts Tagged ‘website’

Implementing a WordPress build into an existing website

Saturday, July 12th, 2008

It took a few hours to determine the best way to integrate a WordPress build into my already functioning website. With these tips you should be able to do it in under an hour and here is how:

  • Download WordPress here: WordPress Weblog Platform
  • Move the WordPress build into the http://www.yourwebsite.com/blog folder
  • Add a shell database using PhpMyAdmin
  • Install WordPress by going to: http://www.yourwebsite.com/blog
  • Login to your blog (I immediately change the admin password) and go to the ‘Design -> Theme Editor’ section
  • First modify the Header. I include my StyleSheet as the last style sheet and access it by adding ‘http://www.yourwebsite.com/’ to the beginning of the path (which is what you will need to add to all of your IMG and HREF tags.
  • Next, copy and paste your templates header replacing the WordPress tags <div id=page> and <div id=header> I include everything that exists within my template that appear before the content (ie banner, left menu, top menu). Don’t forget to update your IMG and HREF tags with a ‘http://www.yourwebsite.com/’.
  • Then I address the footer file. Here I replace all of the code with my footer. It is important to include your closing div tags for any opened div tags that you added to the header. Do this with maintaining the structure from your template.
  • Address the sidebar section next. Here I remove the meta information list element and customize the titles between the H2 tags.
  • A seemingly daunting but simple area is the Main Index Template (index.php). In here I delete nothing. To add static content above your blog’s main page, add it under the <?php get_header(); ?> tag and above the <div id=”content” class=”narrowcolumn” > tag.
  • Now you must carry through the changes to index.php to all of the inner content pages.  These include: 404.php, archive.php, archives.phh, image.php, links.php, page.php, serach.php and single.php.  The same system can be employed that was employed for the index.php file.
  • Lastly is adjusting the CSS file which can be found in the Stylesheet (style.css) section. Consideration varies depending on the definitions that appear in your template’s CSS file. This part is by far the most complex and will take some time to master to master the elements.  I recomment deleting most of the wordpress template definitations and creating your own, especially in regards to UL, LI, and the header tags.

That’s it! Now you are ready to share your voice with the world in the luxury of your own website / template design!

Blog on.