Embedding WordPress into OS Commerce

I’ve created the following tutorial in response to topic 47148: osCommerce and WordPress at WordPress Support.

While I have been programming PHP for a while, I am new to both OS Commerce and WordPress. That being said, for this integration I have tried to follow the coding standards for creating a new OS Commerce page. If you see any refinements I need to make to my code, feel free to comment. I hope this helps all of you who are looking to integrate OS Commerce and WordPress.

10/06/2006 – UPDATE: In response to comments below, I’ve written a Part II to this tutorial showing how to embed WordPress into a default install of OSC MS2.2.

PLEASE NOTE: The code in this tutorial assumes that your OS Commerce install is located in your server’s web root and your WordPress install is located in a subdirectory named wordpress/.

ALSO NOTE: This tutorial is written for OS Commerce installs using the Basic Template Structure (BTS). For OSC installs using the Simple Template Structure (STS), please see comment number 9 below:

  1. Create a file for your WordPress blog in the root folder of your OS Commerce install. For our purposes, we’ll name this file blog.php. The contents of this file are as follows:
    <?php
    /*
    Title: Embedding WordPress into OS Commerce
    Author: Michael Wender (www.michaelwender.com)
    Disclaimer: This Software is provided "AS IS" and without warranty of any kind. The user assumes all risks associated with its use and installation.
    $Id: blog.php,v 1.1.1.1 2004/03/04 23:38:02 ccwjr Exp $
    
    osCommerce, Open Source E-Commerce Solutions
    
    http://www.oscommerce.com
    
    Copyright (c) 2003 osCommerce
    Released under the GNU General Public License
    */
    
    // turn off WordPress themes and include the WordPress</b> core:
    define('WP_USE_THEMES', false);
    require('./wordpress/wp-blog-header.php');
    
    require('includes/application_top.php');
    require(DIR_WS_LANGUAGES . $language . '/' . FILENAME_BLOG);
    $breadcrumb->add(NAVBAR_TITLE, tep_href_link(FILENAME_BLOG));
    $content = CONTENT_BLOG;
    require(DIR_WS_TEMPLATES . TEMPLATE_NAME . '/' . TEMPLATENAME_BLOG_PAGE);
    require(DIR_WS_INCLUDES . 'application_bottom.php');
    ?>
    
  2. Open the file oscommerce_root/includes/filenames.php.
    • Find the section that begins with the comment // define the content used in the project, and add the following code:
    • define('CONTENT_BLOG', 'blog');
    • Find the section that begins with // define the filenames used in the project, and add the following:
    • define('FILENAME_BLOG', CONTENT_BLOG . '.php');
    • Find the section that begins with // define the templatenames used in the project, and add the following:
    • define('TEMPLATENAME_BLOG_PAGE', 'blog_page.tpl.php');
  3. Create the following file: oscommerce_root/templates/your_template_dir/blog_page.tpl.php (Note: This file’s filename matches the variable you defined as TEMPLATENAME_BLOG_PAGE in filenames.php).

    The contents of this file will vary according to which template you are using (to start, I suggest making a copy of your main_page.tpl.php); however, the body content on this page will be your WordPress blog. You will display your blog using The WordPress Loop. The following file is only meant to show you how to get started. Your blog_page.tpl.php will vary according to the template you are using in OS Commerce:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html <?php echo HTML_PARAMS; ?>>
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=<?php echo CHARSET; ?>">
    <?php
    if ( file_exists(DIR_WS_INCLUDES . 'header_tags.php') ) {
      require(DIR_WS_INCLUDES . 'header_tags.php');
    } else {
    ?>
      <title><?php echo TITLE ?></title>
    <?php
    }
    ?>
    <base href="<?php echo (($request_type == 'SSL') ? HTTPS_SERVER : HTTP_SERVER) . DIR_WS_CATALOG; ?>">
    <link rel="stylesheet" type="text/css" href="<? echo TEMPLATE_STYLE;?>">
    </head>
    <body onload="preloadImages();" style="background-color: #8E8B8B;">
    <!-- warnings //-->
    <?php require(DIR_WS_INCLUDES . 'warnings.php'); ?>
    <!-- warning_eof //-->
    
    <!-- header //-->
    <?php require(DIR_WS_TEMPLATES . TEMPLATE_NAME .'/header.php'); ?>
    <!-- header_eof //-->
    <?php
    	// INSERT YOUR WordPress Loop Code HERE:
    	if (have_posts()) :
    	   while (have_posts()) :
    		  the_post();
    		  the_content();
    	   endwhile;
    	endif;
    	// END WordPress Loop Code
    ?>
    <!-- footer //-->
    <?php require(DIR_WS_TEMPLATES . TEMPLATE_NAME .'/footer.php'); ?>
    <!-- footer_eof //-->
    </body>
    </html>
    

    A discussion of The WordPress Loop is beyond the scope of this tutorial; however, here are some excellent resources:

  4. Create the following file: oscommerce_root/includes/languages/your_language/blog.php (Note: This file must be named the same as the file you created in step 1). The contents of this file are as follows:
    <?php
    /*
    Title: Embedding WordPress into OS Commerce
    Author: Michael Wender (www.michaelwender.com)
    Disclaimer: This Software is provided "AS IS" and without warranty of any kind. The user assumes all risks associated with its use and installation.
    
    $Id: blog.php,v 1.2 2004/03/05 00:36:42 ccwjr Exp $
    
    osCommerce, Open Source E-Commerce Solutions
    
    http://www.oscommerce.com
    
    Copyright (c) 2003 osCommerce
    
    Released under the GNU General Public License
    */
    
    define('NAVBAR_TITLE', STORE_NAME. ' Blog');
    define('HEADING_TITLE', 'Blog');
    ?>
    
  5. Okay, your WordPress blog should now be embedded into your OS Commerce install. Keep in mind that you will need to adjust your menus and links to point to this new page you have created. If your OS Commerce install is located in your site’s web root, and you have used the same filenames suggested in this tutorial, then the link to your blog will be: http://your-domain.com/blog.php.