Magento & WordPress Integration – .htaccess & index files

Magento is a great ecommerce platform, WordPress a great content management system, so how do you integrate the two?

Online seller of Art Deco Prints LoveThyWall.com needed more control over their homepage than the default Magento cms blocks could offer, so the decision was taken to move Magento from the root to a subfolder (/shop). WordPress was then installed in further subfolder (/news) to control the homepage and blog posts.

So this is what I did to integrate Magento & WordPress.

 

Step 1 – Copy the Magento files

Find all the Magento files in the root, including index.php and .htaccess. Copy these and paste them into a new subfolder. We created /shop.

 

Step 2 – Change Magento’s Base URL to a subfolder

Login into your Magento admin and change the site’s URLs to point to the new files.

Unsecure  >Base URL

> System  > Configuration > Web > Unsecure  >Base URL

We changed this to http://www.lovethywall.com/shop/

Secure  >Base URL

> System  > Configuration > Web > Secure  >Base URL

We changed this to https://www.lovethywall.com/shop/

This should update the database. Refresh the cache, reindex and see if the new subfolder path has now been picked up in the frontend.

 

Step 3 – Update your .htaccess to look for Magento in a subfolder

Find your .htaccess file in your /shop subfolder. Look for the following comment, and add the below.

############################################
## you can put here your magento root folder
## path relative to web root

RewriteBase /shop/

 

Step 4 – Install WordPress

To keep the site architecture clean, we installed WordPress in its own subfolder, /news.

 

Step 5 – Setup WordPress at the root

For WordPress to control the homepage, you need to go to your WordPress admin and modify the URL values there.

WordPress Address (URL)

Settings >  General >  WordPress Address (URL)

Change this your subfolder address;

Vintage French Art Deco Prints

Site Address (URL)

Settings >  General >  Site Address (URL)

Change this your root;

Vintage French Art Deco Prints

 

Step 6 – Call WordPress from index.php

In your root index.php you need to point to your WordPress files installed in the /news subfolder.

/*
* Tells WordPress to load the WordPress theme and output it.
*/
define(‘WP_USE_THEMES’, true);

/* Loads the WordPress Environment and Template */
require( dirname( __FILE__ ) . ‘/news/wp-blog-header.php’ );

 

Step 7 – Modify your .htaccess files

Magento and WordPress both use specific rewrite conditions in your .htaccess files, that will cause 500 and 404 errors if not properly setup. A common issue is WordPress controlling your Magento /shop pages and showing a WP 404 page.

/shop .htaccess

/shop .htaccess has the original Magento file pointing to the subfolder with;
RewriteBase /shop/

root .htaccess

The root .htaccess has some index setup code and the WordPress rewrite code;
#prevent directory browsing — for security
IndexIgnore */*
IndexIgnore *.gif *.jpg

# default index file
DirectoryIndex index.php

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L] </IfModule>
# END WordPress

/news .htaccess

and /news .htaccess is blank.

Now check that you can access both your /shop product pages and your WordPress home and blog post pages.

 

Step 8 – Delete your old Magento files

With your Magento install now working in a subdomain, you can now delete your old Magento files in the root. Again test, everything in the frontend to make sure no links point to the old setup.