Asia Connect Technology JSC » Magento Tricks

Adding a new language in Magento

lydh — Wed, 30 Sep 2009 02:08:09 +0000

As anything in Magento adding a new language is something that requires a certain procedure which we will explain right now and for future reference.

Follow these easy steps and enjoy your multilingual site:

1. Download the desired translation thru Magento connect via admin.
2. Once installed Go to: System -> Manage Stores -> Create store view. Enter the data and save.
3. Now go to: Configuration -> Current Configuration Scope (Select your language from the dropdown) and on the right side under “Locale options” choose the desired language.

Note: Be sure to clear the cache before trying to use your new language.

That’s it, now when you go to the frontend of the site, you’ll notice a dropdown menu allowing the language switching.

Did you clear the cache?

By Željko Prša from Inchoo.net

Add New Reference in Magento

lydh — Tue, 29 Sep 2009 02:52:53 +0000

If you already performed some Magento research, you will know that it is built on a fully modular model that gives great scalability and flexibility for your store. While creating a theme, you are provided with many content blocks that you can place in structural blocks. If you are not sure what they are, please read Designer’s Guide to Magento first. Magento provides few structural blocks by default and many content blocks. This article tells what needs to be in place to create new structural block.

What are structural blocks?

They are the parent blocks of content blocks and serve to position its content blocks within a store page context. Take a look at the image below. These structural blocks exist in the forms of the header area, left column area, right column…etc. which serve to create the visual structure for a store page. Our goal is to create a new structural block called “newreference”.

Step 1: Name the structural block

Open the file layout/page.xml in your active theme folder. Inside you will find lines like:

Let’s mimic this and add a new line somewhere inside the same block tag.

Good. Now we told Magento that new structural block exists with the name “newreference”. Magento still doesn’t know what to do with it.

Step 2: Tell Magento where to place it

We now need to point Magento where it should output this new structural block. Let’s go to template/page folder in our active theme folder. You will notice different layouts there. Let’s assume we want the new structural block to appear only on pages that use 2-column layout with right sidebar. In that case we should open 2columns-right.phtml file.

Let’s assume we wish the “newreference” block to be placed below 2 columns, but above the footer. In this case, our updated file could look like this:



< ?php getChildHtml('breadcrumbs') ?>


< ?php  getChildHtml('global_messages') ?>


< ?php  getChildHtml('content') ?>




< ?php getChildHtml('right') ?>

< ?php getChildHtml('newreference') ?>

Step 3: Populating structural block

We have the block properly placed, but unfortunately nothing is new on the frontsite. Let’s populate the new block with something. We will put new products block there as an example. Go to appropriate layout XML file and add this block to appropriate place.

That’s it. I hope it will help someone

By Tomislav Bilic from Inchoo.net

Changing default category sort order in Magento

lydh — Mon, 28 Sep 2009 02:42:37 +0000

Category toolbar has many options. By default is shows how many items are in the category, you can choose how many products you wish to be displayed per page, you can change the listing type (List or Grid) and you may choose Sort Order. This “Sort Order” can be confusing. The default “Sort Order” is “Best Value”. What does it mean? How is the Best value determined? Can we change the default sort order?

What is “Best Value” filed?

When you go to Category page in Magento administration, you will see “Category Products” tab. From there, you will see the list of products that are associated to this category. The last column in “Position”. That is how “Best Value” is determined. So, best value is not something that is dynamically calculated. You can tailor it to your likings.

How to change default Sort Order

The file you need to look at is: /app/code/core/Mage/Catalog/Block/Product/List/Toolbar.php Since we’ll modify it, make a copy to /app/code/local/Mage/Catalog/Block/Product/List/Toolbar.php

One there, you will notice this code at the beginning of the file:

$this->_availableOrder = array(
'position'  => $this->__('Best Value'),
'name'      => $this->__('Name'),
'price'     => $this->__('Price')
);

Default order takes the first value available. So, all you have to do is to either:

reorder it if you want to have a selection in the Toolbar or
set only one value of choice if you will remove the selection from the toolbar

I hope this will help somebody.

By Tomislav Bilic from Inchoo.net

Create a Color Switcher in Magento

lydh — Thu, 03 Sep 2009 04:19:12 +0000

Magento comes packed with a lot of options. But no matter how many options you put into some product you can never cover all of them. One of such options (for now) is a color switcher in Magento. To be more precise, an image switcher based on color selection.

Recently I’ve made a screencast on my site on this subject, with somewhat different title. The idea is to have a dropdown box from which you choose a color and based on the color selection product image changes. All of this is to be based on some simple javascript (in my case, jQuery).

Before we continue, you might want to see color switcher in action. We used this solution on our Kapitol Reef project.

First you need to upload some images to your product and give them some meaningful names like Red, Blue, Green depending on your product color. When I say give them name, I mean on label values. Same goes for creating custom attribute. You create a dropdown selection box and create the same amount of dropdown options as you have images, giving them the same name Red, Green, Blue… and so on. Here are some images for you to see what I’m talking about:

After this is done we go to the code part. There are three things you need to do here.
Upload the jQuery and save it into the /js/jquery/jquery.js. One important note on jQuery; for some reason I had to use jQuery 1.2.3 to get this example working. Latest version 1.2.6 (as of time of this writing) did not work. You can see the exact error it gave me on my screencast.
Now you need to modify /template/page/html/head.phtml file to include the jQuery script (or any other if you can code the same logic into it) and write down few lines of JS to do the switching (you can download my version of file here head.phtml)
And finaly, you need to modify the /template/catalog/product/view/media.phtml file to grab all of the product images and dump them into some div. Here is my sample (media.phtml) so just copy paste the code.

And some additional screenshots for you to see final result

After some additional styling you can get some impressive results for this. Hope you find it useful.

You can see complete screencast at:
http://activecodeline.com/wp-content/uploads/videos/MagentoProductColorChooser.swf

By Branko Ajzele from Inchoo.net

Improving Magento Speed & Performance With MySQL Query Cache

admin — Tue, 28 Jul 2009 08:49:35 +0000

Improving Magento performance is at the top of the list for most professional Magento developers. There’s no doubt that enhancing the speed at which Magento performs can only be good for business.

One of the most important enhancements you can make to your Magento installation is to properly configure your MySQL database server.

A proper MySQL configuration requires a low level understanding of your underlying hardware and, primarily, the memory (RAM) available.

There is one specific MySQL configuration parameter above all others that will produce significant performance improvements and takes very little understanding to implement.

Query Caching

The single most effective configuration item for enhancing the performance of Magento is money. The second is MySQL’s cache queries configuration parameters.

Magento Commerce is a database application, and as such, requires a great deal of database access and read operations. However, Magento also makes many identical queries each time a page is viewed with relatively little changes in these queries over time.

Each time a Magento page is loaded, a series of database queries are made and the database server must go to work.

Each query is first parsed and the execution of the query is initiated. Then the data must be retrieved from the disk or storage media, sorted and manipulated, and then ultimately returned to the client. This results in performance slow downs because of, among other things, slower disk access.

MySQL offers a built in configuration parameter known as query_cache_size. This configuration directive tells the MySQL server to store the result of the query in memory—much faster than accessing from disk.

The actual size of this cache and number of query result sets cached is dependent on the amount of memory available to your MySQL database server.

In a hosting environment with 1 GB RAM, such as Magento Containers, this allows for a query cache size of 64 MB or larger depending on other memory use factors, such as other services running on the server.

This allows 64 MB of queries to be stored in the very fast RAM, or memory of your hosting environment, as opposed to having to access the disk each time this query is executed or each time the page is loaded. This is an extremely large amount of data.

Now is a good time to point out a bug in MySQL query cache that proves bigger is not always better:

Invaldating a subset of a sufficiently large query cache can take a long time. During this time the server is efficiently frozen and no other operation can be executed. This patch addresses this problem by moving the locks which cause the freezing and also by temporarily disable the query cache while the invalidation takes place.

Extremely large query cache sizes should not be used. The larger the query cache size, the greater the impact of the data validation MySQL performs on the cache when a table has changed, and the resulting set of data in the cache is no longer valid. The bottom line is not to use a query cache size larger than what you need.

On a Magento installation with over 80,000 products, we have found 64 MB to provide 10x the performance improvement over disabled query cache. The actual use or capacity of the cache is less than 50 percent, which provides room for continued cache growth up to 64 MB.

The performance increase you should see from this single configuration enhancement will be in the order of 100-1000% depending on the query executed and the disk being accessed.

Shared vs. Dedicated

MySQL query cache is disabled by default and tells MySQL how much RAM to use for this cache and ultimately how many queries we can cache. This cache is cleared each time the MySQL server is restarted and must be rebuilt query by query after each restart of the MySQL server.

In a product database containing over 80,000 items, our test results show a non-cached query returning in just over 11 seconds.

This same query performed a second time results in using the cached query and produces the same result set in just over 1 second.

This further demonstrates the necessity of a dedicated or application specific hosting environment for production ecommerce websites, which provide a far more stable MySQL database service, among many other advantages, to the less expensive shared hosting.

Contrast this performance enhancement with shared hosting, where a database server could be bounced daily, or even hourly in some cases.

Each time the MySQL server is restarted you lose your cached queries and each new query performed will result in a significantly longer wait for page load. That is, if cached queries ared even enabled on your shared host.

How To Check If Query Caching Is Enabled

To check if your host has query caching enabled in the MySQL server, you can issue the following command from your MySQL command prompt:

mysql> SHOW VARIABLES LIKE 'have_query_cache'; +------------------+-------+ | Variable_name | Value | +------------------+-------+ | have_query_cache | YES | +------------------+-------+

If you are using a standard MySQL binary this value is always YES, even if query caching is disabled so it’s not time for great joy, yet.

To verify that query cache is actually operational, you can issue the following command to the MySQL server:

mysql> SHOW VARIABLES LIKE 'query_cache_size'; +------------------+----------+ | Variable_name | Value | +------------------+----------+ | query_cache_size | 67108864 | +------------------+----------+ 1 row in set (0.00 sec)

This shows that we have 64 MB available to our query cache size, a very respectable amount of memory.

The following demonstrates a server that has MySQL query cache disabled by setting the value to zero:

mysql> SHOW VARIABLES LIKE 'query_cache_size'; +------------------+-------+ | Variable_name | Value | +------------------+-------+ | query_cache_size | 0 | +------------------+-------+ 1 row in set (0.00 sec)

If you have root access, making a change to this value is trivial. Simply add the following line to your my.conf file in the [mysqld] section and restart your MySQL server:

query_cache_size=32M

Query caching is an extremely effective and simple method that can use to improve your Magento performance in minutes. Query caching offers several other configuration parameters that should also be carefully considered when configuring your MySQL server, including:

query_cache_type query_cache_min_res_unit query_cache_limit

I highly recommend that you review these additional configuration parameters prior to implementing your query cache configuration.

Not only will this provide you with even better performance, but you’ll also have a deeper understanding of how your MySQL configuration can enhance the performance and increase the speed of Magento.

From Crucialwebhost.com

Boost the speed of your Magento by ~235%

admin — Tue, 28 Jul 2009 08:46:00 +0000

One of the drawbacks of Magento is currently its speed if default configuration is used. There are certain ways of making it run faster. The best one is to enable GZip compression by changing .htaccess file a little. You just need to uncomment part of the code. In my case, the speed increase was exactly 235%.

Find the following lines in your Magento .htaccess file and replace them with the following code.

############################################
## 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

# enable resulting html compression
php_flag zlib.output_compression on

From Inchoo.net

Magento Menu Customization with Product List

admin — Sat, 25 Jul 2009 18:33:40 +0000

Magento main menu is construed based on the hierarchy like,

Root Category → Category → Sub-Category

We will customise the menu to show the Products of a category/su-bcategory along with its hierarchy in dropdown menu as seen below.

This is a good feature if you have less products in a website.

In order to implement the above structure, we need to modify the navigation.php file of drawItem() function like below. The navigation.php is available in the following location,

app/code/core/Mage/Catalog/Block/Navigation.php

The code is,


Public function drawItem($category, $level=0, $last=false){
$html = '';
if (!$category->getIsActive()) {
return $html;
}
$children = $category->getChildren();
$hasChildren = $children && $children->count();
/***** Getting Product List Start ******/
$cur_category = Mage::getModel('catalog/category')->load($category->getId());
$_productCollection =
Mage::getResourceModel('catalog/product_collection')->addCategoryFilter($cur_category)->setOrder('position',
'ASC');
$cnt=1;
$hasProduct1=$_productCollection->count();
$phtmlChildren='';
if($hasProduct1>=1){
$l=$level+1;
foreach ($_productCollection AS $_product){
$cur_product = Mage::getModel('catalog/product')->load($_product->getId());
if ($cur_product->getStatus()){
$phtmlChildren.= 'htmlEscape($cur_product->getName()).' last';
}
else {
$phtmlChildren.= ' class="level'.$l;
$phtmlChildren.= ' nav-'.$this->htmlEscape($cur_product->getName());
}
$phtmlChildren.= '">'."\n";
$phtmlChildren.= ' '. $this->htmlEscape($cur_product->getName()) .
''."\n";
$phtmlChildren.= '';
$cnt=$cnt+1;
}
}
}
/***** Getting Product List End ******/
$html.= 'getRequestPath());
if ($this->isCategoryActive($category))
$html.= ' active';
if ($last)
$html .= ' last';
if ($hasChildren || (!empty($phtmlChildren))) {
$cnt = 0;
foreach ($children as $child)
if ($child->getIsActive())
$cnt++;
$html .= ' parent';
}
$html.= '">'."\n";
$html.= ''.$this->htmlEscape($category->getName()).''."\n";
$htmlChildren = '';
if ($hasChildren) {
$j = 0;
foreach ($children as $child)
if ($child->getIsActive())
$htmlChildren.= $this->drawItem($child, $level+1, ++$j >= $cnt);
}
if ((!empty($htmlChildren)) || (!empty($phtmlChildren)))
$html.= ''."\n" .$htmlChildren .$phtmlChildren .'';
$html.= ''."\n";
return $html;
}

The below lines in drawItem() function will fetch the current sub-category’s product list based on the sub-category id. The $_productCollection has the list of product of selected subcategory by getting the id as $category->getId() function.


 $cur_category = Mage::getModel('catalog/category')->load($category->getId());
$_productCollection =
Mage::getResourceModel('catalog/product_collection')->addCategoryFilter($cur_category)->setOrder('position',
'ASC');

We will loop through them and generate the menu structure using

tag.

From Hastentechnologies.com

Adding Links to Magento Menu Bar

admin — Sat, 25 Jul 2009 18:27:06 +0000

Look for the top.phtml corresponding to your menu.

You can find the top.phtml files using SSH shell with this command.

Come to the app/ folder
find -name top.phtml

./design/frontend/default/iphone/template/catalog/navigation/top.phtml
./design/frontend/default/default/template/catalog/navigation/top.phtml
./design/frontend/default/blank/template/catalog/navigation/top.phtml
./design/frontend/default/modern/template/catalog/navigation/top.phtml

From above you should be able to locate your themes top.phtml

now edit the top.phtml

nano design/frontend/default/modern/template/catalog/navigation/top.phtml


getUrl(”)?>”>__(’Home’) ?>

getStoreCategories() as $_category): ?>
drawItem($_category) ?>


getUrl(’about-magento-demo-store’)?>”>__(’About Us’) ?>

I have added two links “Home” and “About Us” in the above code (colored yellow)

–

Not happy with where your site shows up in the search engines? Our clients are on page ONE of Google for their keywords. Let us show you how we can help you too.

Tips For Creating Dynamic Category Landing Pages

admin — Thu, 23 Jul 2009 15:55:31 +0000

This is quite a common want, so I thought I would put together a quick tutorial with some ideas and pointers. My main goal will be to give you a starting point for building a static block and PHTML file that can be applied to top level categories to dynamically create a block with of all the subcategories.

The first thing to do is create a new static block (CMS → Static Blocks), lets call it ‘Dynamic Landing Pages’. Within the content paste this:

{{block type="catalog/navigation" name="catalog.category" template="catalog/category/list.phtml"}}

If you’ve not seen one of these before, then basically it loads the list.phtml into the block allowing you to include dynamic content in your site.

Next create list.phtml in app/design/frontend/default/your_theme/template/catalog/category/

Then go to ‘Manage Categories’ select the relevant category and then choose ‘Static Block Only’ in the ‘Display Mode’ dropdown and then choose the ‘Dynamic Landing Pages’ static block we’ve just created from the ‘CMS Block’ dropdown.

Now to look at some coding to put in list.phtml, to get the category id of the current category and an array containing the ids of its child categories, use the following:


$current = $this->getCurrentCategory()->getId();
$category = Mage::getModel('catalog/category')->load((int)$current);
$children = $category->getChildren();
$children = explode(",",$children);

This leaves you with:
$current, your current category id.
$category, which is an instance of Mage_Catalog_Model_Category.
$children, is an array of the child category ids.

Then cycle through each of the child categories by loading the category object using the id from the array. We check first that the first value is not just an empty string (as it will be if there are no categories):


if (strlen($children[0]) > 0)
{
foreach($children as $child)
{
$_child = Mage::getModel('catalog/category')->load($child);
// then use the $_child object to pull out category properties
}
}

Some of the key methods that I then subsequently used to create the landing pages were:

$_child->getName()
$_child->getUrl()
$_child->getImageUrl()
$_child->getProductCount()

The Image URL is based on the image that is uploaded in the ‘General Information’ tab in ‘Manage Categories’ but be aware that if you use this functionality you will probably want to edit frontend/default/your_theme/template/catalog/category/view.phtml so that it doesn’t load that image at the top of the subcategory.

To view the methods of the Mage_Catalog_Model_Category class look at the file: app/code/core/Mage/Catalog/Model/Category.php.

Comments and questions welcome