Posts tagged "customization"

Show SKU in Magento Shopping Cart

April 16th, 2011 Posted by Public 2 comments on “Show SKU in Magento Shopping Cart”

Quick code addition to display the product SKU in the shopping cart in Magento.

Copy the file “default.phtml” from here: “app/design/frontend/default/default/template/checkout/cart/item/” to your local template directory.

Something like “app/design/frontend/default/”your_template”/template/checkout/cart/item/”

Add the following under the product title:

        SKU: <?php echo $_item->getSku() ?>  

Finished:

<h4 class="title"><a href="<?php echo $this->getProductUrl() ?>"><?php echo $this->getProductName() ?> </a></h4>
        SKU: <?php echo $_item->getSku() ?>  

Auto Populate Cross Sell with Products from Current Category Magento

April 16th, 2011 Posted by Public 26 comments on “Auto Populate Cross Sell with Products from Current Category Magento”

eCommerce Data is clear – you need to have cross sell items for every product in your catalog to help conversion.  The usual process consists of manually associating items in the Magento Admin interface.  This process works fine if you have hundreds or even a few thousand items – OR – you have this data in back end systems.

What happens if you don’t have the data and you have 15,000+ items in your catalog?

  • Hire someone to associate all products?
  • Randomly apply products in your data feed?
  • Develop custom code?

All of the above items are true for my Medical Supplies business – Medical Delivered so I needed a solution.  I decided to auto assign cross sell products on the front end on product page render.

In action: http://www.medicaldelivered.com/medline-k1-excel-wheelchair.html

Rules:

  1. The item must be “visible”
  2. The item must reside in the same category as the current item
  3. Don’t display the item from the current product detail page

Results:

  1. All products automatically have cross sells displayed
  2. No need to assign products on the back end
  3. BAD:  Less control over items displayed

This solution won’t work for everyone, if you are an advanced retailer you won’t want to lose this control but if you just want cross sells and don’t have the time/resources to define manually you can try the code below.

Path:  app/design/frontend/default/<template>/catalog/product/list/upsell.phtml

(you may need to create this path – make sure to replace <template> with your template name)


<?php
/**
* Magento
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE_AFL.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@magentocommerce.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade Magento to newer
* versions in the future. If you wish to customize Magento for your
* needs please refer to http://www.magentocommerce.com for more information.
*
* @category   design_default
* @package    Mage
* @copyright  Copyright (c) 2008 Irubin Consulting Inc. DBA Varien (http://www.varien.com)
* @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
* @author        Nick Cron
* @authorweb  www.njcmedia.com
*/
?>
<?php
$_related = $this->getProduct();
// get the parent id to skip
$_parentid = $_related->getId();

if ($_related) {
// get collection of categories this product is associated with
$categories =$_related->getCategoryCollection()
->setPage(1, 1)
->load();

// if the product is associated with any category
if ($categories->count())
foreach ($categories as $_category)
{
$cur_category = Mage::getModel('catalog/category')->load($_category->getId());

?>

<div>
<div><h4><?php echo $this->__('You may also be interested in the following product(s)') ?></h4></div>
<table cellspacing="0" id="upsell-product-table">

<tr>

<?php

$visibility = array(
Mage_Catalog_Model_Product_Visibility::VISIBILITY_BOTH,
Mage_Catalog_Model_Product_Visibility::VISIBILITY_IN_CATALOG
);

$products = Mage::getResourceModel('catalog/product_collection')
->addCategoryFilter($_category)
->addAttributeToFilter('visibility', $visibility)
->addAttributeToSelect('small_image');

$products->getSelect()->limit(5);

// count the number of displayed products
$_i=0;

foreach ( $products as $productModel )       {
$_related = Mage::getModel('catalog/product')->load($productModel->getId());
$_realtedid = $_related->getId();

// prevents displaying the same product your are already on
if ($_realtedid != $_parentid && $_i<4):

?>

<td>
<p><a href="<?php echo $_related->getProductUrl() ?>"><img src="<?php echo $this->helper('catalog/image')->init($_related, 'small_image')->resize(125) ?>" width="125" height="125" alt="<?php echo $this->htmlEscape($_related->getName()) ?>" /></a></p>
<h5><a href="<?php echo $_related->getProductUrl() ?>"><?php echo $this->htmlEscape($_related->getName()) ?></a></h5>

<?php echo $this->getPriceHtml($_related, true) ?>
<?php echo $this->getReviewsSummaryHtml($_related) ?>
</td>

<?php
// increment displayed products
$_i++;
endif;
}
?>

</tr>

<?php }
}
?>
</table>
<script type="text/javascript">decorateTable('upsell-product-table')</script>
</div>

Room for improvement:

  1. Display items from the back end if exist
  2. Display only items with images
  3. ..?

I hope this helps someone.  If you have any suggestions for improvement or code upgrades/fixes please let me know in the comments.

Magento: Remove auto breaks (“br/”) from product description

April 16th, 2011 Posted by Public 2 comments on “Magento: Remove auto breaks (“br/”) from product description”

By Default Magento automatically adds

 <br/> 

html tags to product descriptions for display on the customer interface.  If you have created a nice description with the WYSIWYG Editor or imported HTML descriptions you most likely want to remove this behavior.   Luckily this is not hard to do.

1.  Find the file “description.phtml” here:  /app/design/frontend/base/default/template/catalog/product/view/description.phtml

2. Make a local copy by copying the file to your local template.  You may need to create the same path in your Magento template (you never want to change core code for upgrade reasons).

New Path: app/design/frontend/default/<template name>/template/catalog/product/view/description.phtml

3.  Remove the “nl2br” tag

Before:


<div>
<?php echo $this->helper('catalog/output')->productAttribute($this->getProduct(), nl2br($this->getProduct()->getDescription()), 'description') ?>
</div>

After:


<div>
<?php echo $this->helper('catalog/output')->productAttribute($this->getProduct(),     $this->getProduct()->getDescription()), 'description' ?>
</div>

4.  Upload the file to your server.

WordPress 3.1: Show widget content in Thickbox overlay

March 7th, 2011 Posted by Public 1 comment on “WordPress 3.1: Show widget content in Thickbox overlay”

Follow these steps to add thickbox support to your WordPress site and display the contents of a widget in the thickbox overlay.

High Level Process:

  1. Add thickbox support to WordPress theme
  2. Register Custom widget
  3. Reference widget in theme code
  4. Add widget content

Step 1: Add thickbox

There are a number of WordPress plugins for thickbox that should do this for you, however I was unable to get them to work on WordPress 3.1 and not automatically change image behavior.  In this case I want to control when thickbox is used.

1. Get thickbox code at thickbox website http://jquery.com/demo/thickbox/

2. Add reference to js file in header of theme

Path: <root>/wp-content/themes/<your theme>/header.php

Standard


<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.js"></script>

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/thickbox.js"></script>

Compressed


<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.js"></script>

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/thickbox-compressed.js"></script>

2.  Create “js” folder and save thickbox.js or thickbox-compressed.js to the folder and upload to your server (also jquery if this does not already exist)

Path: <root>/wp-content/themes/<your theme>/js/

3. Add reference to thickbox.css OR add thickbox styles to your existing style sheet

Step 2: Register Custom Widget

Path: <root>/wp-content/themes/<your theme>/functions.php

Standard


if ( function_exists('register_sidebar') ) {

register_sidebar(array(
'name' => 'Contact Links',

));
}

Step 3. Add link to custom widget with thickbox tags and add custom widget reference:

Path: <root>/wp-content/themes/<your theme>/header.php

NOTE: Could be any page in your theme, in this case the link is in the header of the theme.


<a href="#TB_inline?height=400&width=600&inlineId=contact-links"
title="link title">Link</a>

Path: <root>/wp-content/themes/<your theme>/footer.php

NOTE: Could be any page in your theme, in this case I wanted on all pages but at the bottom of the code for SEO.


<div id="contact-links" style="display:none;">
<div>
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Contact Links') ) : ?>
<?php endif; ?>
</div>
</div>

Step 4. Add widget content in Appearance > Widgets in administration UI

If you added the reference correctly you should see the following:

Add any widget content you wish, in this case a custom text widget was used.

Step 5: Test

Your setup is now complete, upload all new files and test your new thickbox link.  If needed add CSS to style the widget and change the height, width parameters on the link.

Let me know if this works for you or if I can be of assistance.  Also, is there an easier way to do this?  A plugin maybe?

SimpleFolio: Add Custom Menu Support

March 6th, 2011 Posted by Public 12 comments on “SimpleFolio: Add Custom Menu Support”

Adding support for custom menus is simple with WordPress.  Follow the steps described below to add custom support to your SimpleFolio themed site.

1. Add menu support to the theme:

Path: <root>/wp-content/themes/simplefolio/functions.php

Add at the end of the file before closing php  “?>”


add_theme_support( 'menus' );

2. Change header.php and add reference to custom menu

Path: <root>/wp-content/themes/simplefolio/header.php

Line 63


<div id="pagenav">
<ul id="nav">
<?php wp_list_pages('title_li='); ?>
</ul>
</div>

Replace the wp_lis+pages tag with your custom menu reference.


<?php wp_nav_menu( array('menu' => 'Main Navigation' )); ?>

Final:


<div id="pagenav">
<ul id="nav">
<?php wp_nav_menu( array('menu' => 'Main Navigation' )); ?>
</ul>
</div>

In this case the custom menu has the menu name “Main Navigation”.  Look at the WordPress function reference for additional ideas: WordPress Codex Function Reference – wp_nav_menu

3. Create the custom menu in WordPress – http://en.support.wordpress.com/menus/ – name the menu “Main Navigation”