Magento

Documentation for setting up your Magento store to work with Pixlee

❗️

Magento 1 End of Life June 30, 2020

Magento version 1 is no longer supported as of June 30, 2020. Your Magento 1 system may still work, but support and security updates will no longer be available. It is highly recommend to migrate to Magento 2 as soon as possible.

Installing the Pixlee Magento Extension

Get Your Pixlee API Keys

Before installing the Pixlee Magento extension, we need to get the Account API Key and Account Secret Key from https://www.pixlee.com.

  1. First, log in to https://www.pixlee.com and click on the Settings button inside the top right hamburger menu.

(Alternatively, point your browser to https://app.pixlee.com/app#settings/account_settings while logged in).


The settings page should look like this:


  1. Click on Pixlee API on the left-hand navigation bar.

From this page, record the value of Account API Key and Account Secret Key.

We'll need these later.


  1. Now's a good time to download the Pixlee_magento.tgz extension file if you don't have it.

If you already have a copy of that file, use what you have instead.


Install the Pixlee Magento Extension in your Magento Admin Panel

  1. Log in to your Magento Admin Panel.

Hover over the System tab, and in the dropdown that appears, hover over the Magento Connect item.

In the overlay that appears from that, click on Magento Connect Manager:


You'll have to log in again, so do that. This is normal.


  1. In the page that follows, look for the Direct package file upload section.

Click on the Choose File button.


  1. In the dialog that appears, navigate to your Pixlee_Magento.tgz file from step 3.

On pressing OK in the dialog, the page should now look like this:


  1. Press the Upload button.

The page should now automatically scroll to the bottom.

In the black box, you should see something like the following.


Configure the Pixlee Extension

Before we can start using the plugin, we need to configure it.

  1. Open up the Magento Admin Panel and hover over the System tab once again. This time click on the Configuration item.


  1. On configuration page, select the website on which you want to install Pixlee like following.

  1. On the resulting page, click on the item named Pixlee Account Configuration on the lefthand navigation.

It should be under the Pixlee logo.


You should be redirected to the following Pixlee configuration page.

Note: In the case that on clicking the Pixlee Account Configuration you get redirected to a 404 Page, log out via the Log Out button on the top right corner and log back in. In some cases, the Pixlee Account Configuration page is not available upon first installing the extension.


  1. Now it's time to use the keys we saved from pixlee.com in step 2.

Fill in the Account ID, Account API Key and Account Secret Key with the value you recorded earlier.

Skip Widget ID for now.

In this example, the filled out form would look like the following.


  1. Conveniently, the Export Products to Pixlee button is right here!

Click it to complete the Pixlee Magento Extension installation.

That's it! You're done!

🚧

Note

If you have ever changed the max_execution_time variable for Magento, please ensure that it is set to at least 3600 seconds (1 hour). The default should be 18000 seconds, which is fine to leave alone.




Exporting Products from Magento to Pixlee

You can export your Magento products to Pixlee at any time from the Export Products to Pixlee button on the Pixlee Account Configuration page.

  1. Log in to your Magento Admin Panel

Hover over the System tab in the top navigation bar, and click on the Configuration item.


  1. On the configuration page, select the website on which you want to install Pixlee like following.

  1. On the resulting page, click on the item named Pixlee Account Configuration on the lefthand navigation.

It should be under the Pixlee logo.

Since the Pixlee extension is already installed, the page that loads should look like the following.


  1. Now simply click on the Export Products to Pixlee button, and you're done!



Embedding a PDP Widget on your Product Page

Assuming that all of your products are in sync with Pixlee, you can embed a PDP Widget on your product page by doing the following.

  1. Go to http://pixlee.com, log in, and navigate to the Publish tab.

(Alternatively, point your browser to https://app.pixlee.com/app#publish while logged in).

  1. Click the "Install Product Displays" and it should present you with a lightbox that looks like following.


  1. Customize the widget as you wish. At the end, press the "Generate Embed Code" button and you'll be presented with an embed code. Note - We recommend that you leave the "Load Priority" setting to "Low priority" when customizing.

Copy the value for widgetId in the resulting code snippet. Fill in this value in the PDP Widget ID field inside Admin > System > Configuration > Pixlee Account Configuration.

  1. To implement the Pixlee gallery, simply make the following call anywhere on your view file:
<?php echo $this->getLayout()->createBlock('pixlee/gallery')->toHtml(); ?>
  1. Where exactly you put this depends on your store's layout, but in the Magento sample store (Madison Island) for example, it'd be in the following file:

    $MAGENTO_ROOT/app/design/frontend/template/catalog/product/view.phtml

Where $MAGENTO_ROOT might be something like /var/www or /usr/share/nginx/html, depending on your installation.

  1. The Pixlee extension will attempt to discern the current product's SKU automatically in order to display the correct gallery, but if it is unable to do so you can explicitly set the product SKU with the "setProductSku" function like so:
<?php echo $this->getLayout()->createBlock('pixlee/gallery')->setProductSku($SKU)->toHtml(); ?>
  1. Using the sample store Madison Island as an example, the it would look something like the following (at the bottom of the file).

Before:

</div>
	<?php echo $this->getChildHtml('upsell_products') ?>
	<?php echo $this->getChildHtml('product_additional_data') ?>
</div>

After:

</div>
  <?php echo $this->getChildHtml('upsell_products') ?>
  <?php echo $this->getChildHtml('product_additional_data') ?>
	<?php echo $this->getLayout()->createBlock('pixlee/gallery')->toHtml(); ?>
</div>

With this done, every product description page will have an embedded PDP widget, which will remain hidden until you start tagging photos with that product.

  1. For example, here's a product without tagged photos:


And here's one with:


Embedding a CDP Widget on your Category Pages

The first three steps are exactly the same as embedding a PDP widget as they only involve getting a widgetId from the Control Panel.

  1. Go to http://pixlee.com, log in, and navigate to the Publish tab.

(Alternatively, point your browser to https://app.pixlee.com/app#publish while logged in).

  1. Click the "Install Product Displays", and it should present you with a lightbox that looks like following.


  1. Customize the widget as you wish. At the end, press the "Generate Embed Code" button and you'll be presented with an embed code. Note - We recommend that you leave the "Load Priority" setting to "Low priority" when customizing.

Copy the value for widgetId in the resulting code snippet. Fill in this value in the Category Widget ID field inside Admin > System > Configuration > Pixlee Account Configuration.

  1. To implement the Pixlee gallery, simply make the following call anywhere on your view file:
<?php echo $this->getLayout()->createBlock('pixlee/categorygallery')->setData('category_id', $this->getCurrentCategory()->getId())->toHtml(); ?>
  1. Where exactly you put this depends on your store's layout, but in the Magento sample store (Madison Island) for example, it'd be in the following file:

    $MAGENTO_ROOT/app/design/frontend/template/catalog/category/view.phtml

Where $MAGENTO_ROOT might be something like /var/www or /usr/share/nginx/html, depending on your installation.

  1. In case you want to install the category widget on a page that is not a category page. You can still install the widget but you'll have to specify the category_id of the category manually in the setData function like following
<?php echo $this->getLayout()->createBlock('pixlee/categorygallery')->setData('category_id', **Function call to get category id here**)->toHtml(); ?>
  1. Using the sample store Madison Island as an example, it would look something like the following (at the bottom of the file).

Before:

<?php else: ?>
    <?php echo $this->getProductListHtml() ?>
<?php endif; ?>

After:

<?php else: ?>
    <?php echo $this->getProductListHtml() ?>
<?php endif; ?>

<?php 
    echo $this->getLayout()->createBlock('pixlee/categorygallery')->setData('category_id', $this->getCurrentCategory()->getId())->toHtml();
?>

With this done, every category description page will have an embedded CDP widget, which will remain hidden until you start tagging photos with that product.




Testing and Troubleshooting

To test that everything was implemented correctly, we need to check two things -

  1. Were all the products exported?
  2. Are API calls being successfully made to the Pixlee API?

Were all the products exported?

Before testing, please make sure that the Pixlee Product Exports job has at least ran once. If you've already run the exports once, skip to step 3.

  1. In order to run it manually. Please follow the steps explained in the Exporting Products from Magento to Pixlee section of the document.

  2. Login to Pixlee and navigate to Products under the Album tab. Alternatively, click this link..

  3. You should see a list of products on this page.

  1. Try searching for a few products on this page that you know exist in your catalog.

  2. In case the list is empty or you were not able to search for a particular product, proceed to the next step. Otherwise proceed straight to the next section i.e. Are API calls being successfully made to the Pixlee API?

  3. There can be several causes of failure to export products so first we need to find out the exact cause of the failure. The Pixlee Product Exports job logs the progress and all exceptions to the server logs. So the next step for us is to get the both Magento server logs and the PHP (Apache or equivalent) logs.

  4. The Magento server logs are usually located at $Magento_Root$/var/log so navigate to that location and look for file named system.log.

  5. For the PHP logs location it depends on your setup. For example, if you're using Apache the logs should be in $Apache Root$/logs. We're looking for the file named php_error.log in this directory.

  6. One of the most common issues that we encounter is a lack of allocated memory to the Magento or PHP/Apache server. Open the php_error.log file using your favorite text editor and search for a log entry similar to the following line

Allowed memory size of 33554432 bytes exhausted (tried to allocate 43148176 bytes) in php
  1. If you found a similar looking error, please increase the allocated memory and run the product export job again.

  2. Another common issue we encounter is a low setting for the max_execution_time. Look for a log entry similar to the following

Fatal error: Maximum execution time of XYZ seconds exceeded in ...
  1. If you found a similar log entry please increase the max_execution_time setting inside your php.ini file to at least 3600. And then try exporting the products again.

  2. If at this point you're still not able to see any products exported to Pixlee, please contact us at [email protected] and attach the both sytem.log and php_error.log with the email.

Are API calls being successfully made to the Pixlee API?

API calls are made to Pixlee API when a customer adds something to their cart and when they buy something on your store. We need to make sure that these calls are being made at the right time.

  1. Open your favorite browser and open a product page of your store. And click Add to Cart.

  1. Open the system.log file located at $Magento_Root$/var/log using your favorite text editor and scroll down to the very end.

  2. There should be an entry beginning with * In _sendPayload. Event: addToCart

  1. If you found the * In _sendPayload. Event: addToCart calls then your analytics were integrated correctly. If not, contact us at [email protected] and attach the system.log file with the email.

  2. Switch back to the browser and proceed to checkout and buy the product that you added to cart previously. Use a test payment method for the checkout.

  3. When you reach the order confirmation page switch open the sytem.log file again and ensure that you viewing the latest copy of the file.

  4. This time look for log entries beginning with * In _sendPayload. Event: checkoutSuccess

  1. If you do not see the * In _sendPayload. Event: checkoutSuccess calls like in the screenshot, please contact us at [email protected] and attach the sytem.log file with the email.