Wednesday, March 11, 2015

How To Optimize Images Produced in PrestaShop

Finding: products images are not so optimized. The pictures produced in PrestaShop are optimized by default from the moment you activate the URL rewriting . Are obtained SEO friendly urls with the default name of the product as the image name. Rather, it is a good start.
The problem we will meet soon when a product has several pictures is that the pictures have the same filename as follows: produit.jpg-name. It is not ideal if you want to index, the greater number of product images in Google Images.

Solution: rename image in PrestaShop
To rename the names of images known to your .tpl including the product. tpl, we have to apply an override. We will build on what exists is the possibility to choose an image name via the legend already in place in the back office.
Then we set up a override the Class link.php to copy it simply:

class Link extends LinkCore
{
/**
* Cleans out a text and strip potentially dangerous tags.
* @since 3.0
**/
function toAscii($str, $replace=array(), $delimiter='-') {
if( !empty($replace) ) {
$str = str_replace((array)$replace, ' ', $str);
}
$clean = iconv('UTF-8', 'ASCII//TRANSLIT', $str);
$clean = preg_replace("/[^a-zA-Z0-9\/_|+ -]/", '', $clean);
$clean = strtolower(trim($clean, '-'));
$clean = preg_replace("/[\/_|+ -]+/", $delimiter, $clean);
return $clean;
}
/**
* Returns a link to a product image for display
* Note: the new image filesystem stores product images in subdirectories of img/p/
*
* @param string $name rewrite link of the image
* @param string $ids id part of the image filename - can be "id_product-id_image" (legacy support, recommended) or "id_image" (new)
* @param string $type
*/
public function getImageLink($name, $ids, $type = null, $legend = null)
{
$not_default = false;
// legacy mode or default image
$theme = ((Shop::isFeatureActive() && file_exists(_PS_PROD_IMG_DIR_.$ids.($type ? '-'.$type : '').'-'.(int)Context::getContext()->shop->id_theme.'.jpg')) ? '-'.Context::getContext()->shop->id_theme : '');
if ((Configuration::get('PS_LEGACY_IMAGES')
&& (file_exists(_PS_PROD_IMG_DIR_.$ids.($type ? '-'.$type : '').$theme.'.jpg')))
|| ($not_default = strpos($ids, 'default') !== false))
{
if ($this->allow == 1 && !$not_default)
$uri_path = __PS_BASE_URI__.$ids.($type ? '-'.$type : '').$theme.'/'.$name.'.jpg';
else
$uri_path = _THEME_PROD_DIR_.$ids.($type ? '-'.$type : '').$theme.'.jpg';
}
else
{
// if ids if of the form id_product-id_image, we want to extract the id_image part
$cleanlegend = $this->toAscii($legend);
$split_ids = explode('-', $ids);
$id_image = (isset($split_ids[1]) ? $split_ids[1] : $split_ids[0]);
$theme = ((Shop::isFeatureActive() && file_exists(_PS_PROD_IMG_DIR_.Image::getImgFolderStatic($id_image).$id_image.($type ? '-'.$type : '').'-'.(int)Context::getContext()->shop->id_theme.'.jpg')) ? '-'.Context::getContext()->shop->id_theme : '');
if ($this->allow == 1)
if($legend)
$uri_path = __PS_BASE_URI__.$id_image.($type ? '-'.$type : '').$theme.'/'.$id_image.'-'.$cleanlegend.'.jpg';
else
$uri_path = __PS_BASE_URI__.$id_image.($type ? '-'.$type : '').$theme.'/'.$id_image.'-'.$name.'.jpg';
else
$uri_path = _THEME_PROD_DIR_.Image::getImgFolderStatic($id_image).$id_image.($type ? '-'.$type : '').$theme.'.jpg';
}
return $this->protocol_content.Tools::getMediaServer($uri_path).$uri_path;
}
}
We took care to indicate that if the picture has a caption, so it will be used for the name of the image, and that this legend will be treated and cleaned (via this script: https://gist.github.com/chluehr/1632883) that comes out a name of optimized image.
Finally, we will edit the theme used product. tpl file and apply changes in attribute src and href images and thumbnails in the product description.
For the main picture …
0102-1.png
And for miniature …
0102-2.png
That's it, your product pictures each have a unique name and are called by this single url enabling robots to have images to locate several key words or phrases potential.

Along with SEO, a good customer service also helps to attract and engage with your prospective. And PrestaMonster.com provides you Quick Quote Tool Pro which would help to gain the quality and efficiency of your comnunication with customers. Enjoy!!!

0 comments:

Post a Comment