Magento - Moving Directory from Test to Live

Many Magento users try the application out first on sub-directory or test directory. A lot of times, moving an application from test directory to live directory can be hectic and time-consuming. Luckily, it is relatively easy to move Magento from one directory to another withing the same server.

  • Backup everything.
  • Update the unsecure / secure URLs via the Admin panel.
    System -> Configuration -> Click Web from the left menu.
    i.e.) Change http://www.mycompany.com/test/ to http://www.mycompany.com.
    When you save the new URLs through the Admin panel, it will show error messages after you’re done. This happens because the Admin can’t be redirected to the old directory any more. Just ignore the message.
    If you’re familiar with SQL queries, you can update the URLs directly from database using phpMyAdmin or other database tool:
    update core_config_data set value='NEW URL' where path like '%base_url%';
  • Delete the cache from /var/cache/.
  • Move all the files to the new directory.
    You can use a file manager tool that your hosting company provides, do SSH or use FTP. The file manager tool from cPanel is fast and reliable.

This procedure should work in both ways:
when you move Magento from sub-directory to top as ‘http://www.mycompany.com/test/’ to ‘http://www.mycompany.com/’
or from top to sub-directory as ‘http://www.mycompany.com/’ to ‘http://www.mycompany.com/shop/’.

You don’t have to use the word ‘magento’ when you move your store to sub-directory.

Magento - Yahoo Analytics Conversion Code

Unlike other tracking codes, we need to put Yahoo Analytics Conversion code between <HEAD> and </HEAD> tags.

Yahoo’s Instructions for the following code are:

Copy the HTML code below and insert it between the <HEAD> and </HEAD> tags on your site’s conversion page(s). To pass a dynamic revenue value in the tag, you must modify your web pages accordingly.

To add the Yahoo conversion tracking code in the Head tags, we need to look at the checkout layout configuration file:
/app/design/frontend/your_interface/your_theme/layout/checkout.xml

Find out which page layout it uses when an order is completed.

i.e.) For one page checkout, look for this code:

<checkout_onepage_success>
<reference name="root">
<action method="setTemplate"><template>page/2columns-right.phtml</template></action>
</reference>

You can edit the Head section of ‘2columns-right.phtml’ to add the Yahoo tracking code. But if this template, 2columns-right.phtml is being used for other pages, I would make a copy of it and name it ‘2columns-right-success.phtml’ and add the tracking code there. This way, it will track it only when there is a successful conversion.

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->getLang() ?>" lang="<?php echo $this->getLang() ?>">
<head>
<?php echo $this->getChildHtml('head') ?>
<SCRIPT language=”JavaScript” type=”text/javascript”>
<!– Yahoo! Inc.
window.ysm_customData = new Object();
window.ysm_customData.conversion = “transId=,currency=,amount=”;
var ysm_accountid = “—–YAHOO_ACCOUNT_ID—–”;
document.write(”<SCR” + “IPT language=’JavaScript’ type=’text/javascript’ ”
+ “SRC=//” + “srv2.wa.marketingsolutions.yahoo.com” + “/script/ScriptServlet” + “?aid=” + ysm_accountid
+ “></SCR” + “IPT>”);
// –>
</SCRIPT>

Magento - AdWords Conversion Tracking

When you use Google AdWords to receive more traffic, don’t forget to track the traffic. AdWords Conversion Tracking is a free tool to help you understand how many users actually buy products or services from you.

Installing AdWords conversion tracking codes is pretty straightforward.

Open the file /app/design/frontend/your_interface/your_theme/template/checkout/success.phtml.

Find the following code in the file.
<?php echo $this->__(’Your order # is: %s’, $this->getViewOrderUrl(), $this->getOrderId()) ?>.
<?php else :?>
<?php echo $this->__(’Your order # is: %s’, $this->getOrderId()) ?>.
<?php endif;?>

Add the following code under the above code. If your success.phtml is customized, add it at the end of the file. In most cases, it should work.

<?php
//-------------------------------------------
// ADWORDS CONVERSION TRACKING
//-------------------------------------------
$order_details = Mage::getModel('sales/order')->loadByIncrementId(Mage::getSingleton('checkout/session')->getLastRealOrderId());
$adwords_saleamt = $order_details->subtotal;
?>
<!-- Google Code for Purchase/Sale Conversion Page -->
<script language="JavaScript" type="text/javascript">
<!--
var google_conversion_id = ---YOUR_GOOGLE_CONVERSION_ID---;
var google_conversion_language = "en";
var google_conversion_format = "1";
var google_conversion_color = "ffffff";
var google_conversion_label = "purchase";
var google_conversion_value = "<?php echo $adwords_saleamt; ?>";
//-->
</script>
<script language="JavaScript" src="http://www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<img height="1" width="1" border="0" src="http://www.googleadservices.com/pagead/conversion/---YOUR_GOOGLE_CONVERSION_ID---/?label=purchase&guid=ON&script=0"/>
</noscript>

To look at the conversion data from Google AdWords, generate reports as follows:

Reports -> Create Report -> … ->
Add or Remove Columns from Advanced Settings (Optional) -> Choose conversion related columns.

AdWords Conversion Report

This code is to track conversion rate for regular sales.

Magento Speed and Performance

Magento is one of the most flexible open-source e-commerce applications that comes with lots of desirable features for shopping-cart sites. However, due to these various functionalities, its performance can be a major issue.

Magento provides helpful resources in its blog and forum to improve performance including database tuning and server configuration modification. But in many cases, these performance enhancements should be done through system administrators of your hosting company or would work only when you have a dedicated server. Read more about Magento Performance Improvement.

An easier way to improve Magento website speed is to turn on GZip compression via .htaccess. GZip compression is a kind of technique to compress textual content when it’s transferred from the web server to a user’s browser.

A single web page from a Magento site can be a few hundreds KB -one of my site shows its homepage size is 500KB when Yahoo homepage is 200KB! (you can check this by clicking Information View Document Size from FireFox developer’s tool bar.)

GZip compression can reduce page size significantly and transfer the data faster to your site visitors.
The files that can be compressed are text files such as XHTML, JavaScript or CSS. Image, video or other multi media files are already compressed.

Find the section for “mod_deflate.c” from your .htaccess file and uncomment the settings as follows:

<IfModule mod_deflate.c>
############################################
## enable apache served files compression
## http://developer.yahoo.com/performance/rules.html#gzip

# Insert filter
SetOutputFilter DEFLATE

# Netscape 4.x has some problems…
BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems
BrowserMatch ^Mozilla/4\.0[678] no-gzip

# MSIE masquerades as Netscape, but it is fine
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
# Don’t compress images
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary

# Make sure proxies don’t deliver the wrong content
Header append Vary User-Agent env=!dont-vary
</IfModule>

############################################
## enable resulting html compression

php_flag zlib.output_compression on

Notes:

  • Some older browsers might not have issues with compressed content. Use specific rules for those browsers.
  • It will add some CPU loads to compress texts when transferred. But compression is still regarded worthwhile because of its trade-off - speed boost.

Change Order of Blocks - ‘before’ and ‘after’ attributes

Use ‘before’ and ‘after’ block attributes to change the order of blocks. You can set the position of a block within a structural block by assigning the name of another block to either ‘before’ or ‘after’ attribute.

For example, if you’d like to put ‘Product Viewed’ box below ‘Cart’ box on the right menu, you can define the layout XML files as follows:

in catalog.xml
<reference name=”right”>
<block type=”reports/product_viewed” before=“cart_sidebar” name=”reports.product.viewed” template=”reports/product_viewed.phtml”/>

</reference>

You can define block position at the very top or bottom by using before=”-” or after=”-”.