A typical workgroup and/or CRM applications comes with  full featured applications : sugarcrm, tine2.0 come with much more than contact management, task tracking, customer relation ship, and are conceived to integrate third party developments (plugins). But if you only need to track work to do, might have a look at simpler web based php applications :

• myTinyTodo is so small and simple – yet ajax powered-  you’d love it at first sight
• TaskFreak is the free version of a much more advanced applicatin, can be enough for a lot of small freelance  projects.
• PlanCake is a nice hosted  job tracking application that can also be downloaded and installed on your server. Nice for testing before adopting.
• todoyu (picture above) is the most advanced of our selection, with advanced features : manage multiple projects with team members but also clients online, overview your customer’s data, assign tasks to team member and external staff, share files within your work group, schedule events in a shared calendar, check and meet the deadlines

1. in your media.phtml file, the big images are loaded via html. the image id is a collection of images from which only the first one is displayed initially, the other are waiting for the thumbail to be clicked. Simply add here the images collection from associated products,  each image being allocated a css ID built from product id and the increment

           <?//<associated product all images>
               if ($_product->getTypeId() == "configurable") {
           $associated_products = $_product->loadByAttribute('sku', $_product->getSku())->getTypeInstance()->getUsedProducts();
             foreach ($associated_products as $assoc)
               {
               $assocProduct =Mage::getModel('catalog/product')->load($assoc->getId());
                $i=0; 
   
                if (count($assocProduct->getMediaGalleryImages()) > 0) {
                      foreach ($assocProduct->getMediaGalleryImages() as $_image)
                       {
                        $imageFile=str_replace(Mage::getBaseUrl('media'),"",$_image->url);
                        $imageId=$assoc->getId() . "_" . $i++;?>
                         <div onclick="showZoom('<?=$imageFile?>')" class="jqzoom">
                 <img style="z-index:-1;display:none" id="image<?php echo $imageId; ?>"
                 width="340px"
                 height="250px"
                 src="<?php echo $this->helper('catalog/image')->init($assocProduct, 'thumbnail2', $_image->getFile())->resize(350, 250); ?>"
                 alt="<?php echo $this->htmlEscape($assocProduct->getName()) ?>"
                   jqimg="<?php echo $_image->url; ?>"></div>
               <?php
                        }
                   }
               }
               } //</associated product all images>
           ?>

2. in the same file, below, the images thumbnails are displayed in unordered lists. What you need to do here to create one unordered list per associated product, with a display none styling  :

               <?//<associated product all images>
               if ($_product->getTypeId() == "configurable") {
           $associated_products = $_product->loadByAttribute('sku', $_product->getSku())->getTypeInstance()->getUsedProducts();
             foreach ($associated_products as $assoc)
               {
               $assocProduct =Mage::getModel('catalog/product')->load($assoc->getId());
               $i=0;
                if (count($assocProduct->getMediaGalleryImages()) > 0) { ?><ul id="teckLoom<?=$assoc->getId()?>" style="z-index:-1;display:none">   <?
                      foreach ($assocProduct->getMediaGalleryImages() as $_image)
                       {
                        $imageFile=str_replace(Mage::getBaseUrl('media'),"",$_image->url);
                        $imageId=$assoc->getId() . "_" . $i++;?>
                        <li>
               <a href="#" onclick="jSelectImage('<?=$imageId ?>'); return false;">
               <img src="<?php echo $this->helper('catalog/image')->init($assocProduct, 'thumbnail', $_image->getFile())->resize(70); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>" />
           </a>         </li>
   
               <?php
                        }      ?></ul> <?
                   }
               }  }
                 //</associated product all images>   ?>

3. use the select color  function from our previous article to display the associated image set when an option is selected via image click :

   function selectColor(idAttribute, idProduct)
   {
   jQuery('#attribute76').val(idAttribute);
   spConfig.reloadPrice();
   displayProductConfigImage(idProduct);
   jQuery(".more-views ul").hide();
   jQuery(".more-views ul#teckLoom" + idProduct).show();
   }

4. add the following code to js/varien/product.js to let the effect work when an option is selected in the dropdown menu :

   var productNo = intersect(selectedAssocProducts) || selectedAssocProducts[attributeId][0];
   //alert(jQuery("#image0").attr('src'));
   //$('image').attr("src", assocIMG[productNo]);
   displayProductConfigImage(productNo);
   jQuery(".more-views ul").hide();
   jQuery(".more-views ul#teckLoom" + productNo).show();

5. Have a look at the result on ruedesiam’s lovely designed multi color loom furniture : try  the chaise giulietta

Announcement : http://crowdfavorite.com/wordpress/carrington/

Warning: simplexml_load_string() [function.simplexml-load-string]: Entity: line 61: parser error : StartTag: invalid element name  in C:\aa_work\RueDeSiam\www\lib\Varien\Simplexml\Config.php on line 502

#0 C:\aa_work\RueDeSiam\www\lib\Varien\Simplexml\Config.php(502): mageCoreErrorHandler(2, 'simplexml_load_...', 'C:\aa_work\RueD...', 502, Array)
#1 C:\aa_work\RueDeSiam\www\lib\Varien\Simplexml\Config.php(489): Varien_Simplexml_Config->loadString('?????? ...', 'Mage_Core_Model...')
#2 C:\aa_work\RueDeSiam\www\app\code\core\Mage\Adminhtml\Model\Config.php(102): Varien_Simplexml_Config->loadFile('?????? ...', 'Mage_Core_Model...')
#3 C:\aa_work\RueDeSiam\www\app\code\core\Mage\Adminhtml\Model\Config.php(63): Mage_Adminhtml_Model_Config->_initSectionsAndTabs('C:\aa_work\RueD...')
#4 C:\aa_work\RueDeSiam\www\app\code\core\Mage\Adminhtml\controllers\System\ConfigController.php(70): Mage_Adminhtml_Model_Config->getSections()
#5 C:\aa_work\RueDeSiam\www\app\code\core\Mage\Core\Controller\Varien\Action.php(367): Mage_Adminhtml_System_ConfigController->editAction(NULL)
#6 C:\aa_work\RueDeSiam\www\app\code\core\Mage\Core\Controller\Varien\Router\Admin.php(143): Mage_Core_Controller_Varien_Action->dispatch()
#7 C:\aa_work\RueDeSiam\www\app\code\core\Mage\Core\Controller\Varien\Front.php(158): Mage_Core_Controller_Varien_Router_Admin->match('edit')
#8 C:\aa_work\RueDeSiam\www\app\Mage.php(457): Mage_Core_Controller_Varien_Front->dispatch(Object(Mage_Core_Controller_Request_Http))
#9 C:\aa_work\RueDeSiam\www\index.php(66): Mage::run()
#10 {main}

the problem with this kind of error is that it doesn’t tell you which file is causing the error. To find out, work with your local installation

• set the developer mode in index.php : Mage::setIsDeveloperMode(true);
• open the app/code/core/Mage/Adminhtml/Model/Config.php and let the _initSectionsAndTabs tell you which xml is being loaded in the modules loop, just after $configFile is defined : echo $configFile;
• the last file that pops before the error is thrown out is likely to cause the breakout !!

add_action("wp_update_nav_menu" , 'wp_cache_clear_cache' );

cache clear for POD CMS

Generally, all actions that update content from the admin should clear the cache. the following line, to be added in the same manner, will catch the pod cms update action and clear the cache (pod cms forum discussion).

add_action('pods_post_save_pod_item','wp_cache_clear_cache');

Same job for other plugins : look for a hook (search do_action in files)  and use the save action of your plugin data to clear the cache .

Beyond the code and standarts : what’s available

MVC is a nice idea but it’s only an idea and even if it’s useful to structure the code the power of frameworks are in their community.

• Look for application samples.
  • Zend framework used to have a good application sample, distributed free as DodoApp. Unfortunately it’s not available any more but other applications are out there to get you started if you need code samples, check out our article. In general I have been looking a lot and it’s hard to find a starter application for Zend Framework
  • Symfony has a lot of opensource applications, the list is here
  • Code Igniter is simpler to learn apparently but you’ll find it hard to find good sample applications .We ‘ve listed two of them in a previous article
• Look for available code snippets
• Zend framework code snippets can be found all over the web but you have to know the framework really well to integrate them in your application
• Code igniter snippets are displayed on the forum but not categorized
• symfony snippets are organized and tagged in the plugin repository, easily available from Symfony’s official web site,  and I have to say that’s a real sign of good community work

The conclusion is make your life and your own choice. I was using Zend framework but a few minutes investigation convince me I should look into symfony.

• allows end user to choose color option by clicking on thumbnail
• change product image to associated product image

the technique above is inspired from Magento Wiki page that describes the javascript that catches the Options price select event to modifyu the product image. We’ve changed a few things though

1. this example is a color chooser. First thing is to create a folder in media/productColors with thumbnails of available colors, all stored in a file with the name of the color
2. follow the Magento Wiki tutorial carefully
3. instead of adding the code to view.phtml, create a new phtml file
   app/design/frontend/*/*/template/catalog/product/view/WebmasterBulletin_JsConfigColors.phtml with the following code

   <?
       $_helper = $this->helper('catalog/output');
       $_product = $this->getProduct();
   ?>
   <script type="text/javascript">
       var optionsPrice = new Product.OptionsPrice(<?php echo $this->getJsonConfig() ?>);
   
       var assocIMG = { // Added
       <?php
       if ($_product->getTypeId() == "configurable") {
           $associated_products = $_product->loadByAttribute('sku', $_product->getSku())->getTypeInstance()->getUsedProducts();
   
           foreach ($associated_products as $assoc)
               {$dados[] = $assoc->getId().":'".($assoc->image == "no_selection" || $assoc->image == "" ? $this->helper('catalog/image')->init($_product, 'image', $_product->image)->resize(365,400) : $this->helper('catalog/image')->init($assoc, 'image', $assoc->image)->resize(365,400))."'";
               }
       } else {
           $dados[] =  "''";
       }
       echo implode(',', $dados );
       ?>
       }   
   
   function displayProductConfigImage(id)
   {
   jQuery('#image0').attr('src', assocIMG[id]) ;
   jQuery('#image0').attr('jqimg', assocIMG[id]) ;
   jSelectImage('0');
   }
   function selectColor(idAttribute, idProduct)
   {
   jQuery('#attribute76').val(idAttribute);
   spConfig.reloadPrice();
   displayProductConfigImage(idProduct);
   }
   var tipConfigImgThumb = "Choose your color :";
   </script>
   <?  $ii=0;foreach ($associated_products as $assoc)
            {
            $color=$assoc->getAttributeText("color");
            $w=100; $h=100;
            $imageColorSource =  "/media/productColors/" . strtolower($color) . ".jpg";
            $imageColorResized =  Mage::getBaseUrl() . "/media/phpThumb_1.7.9/phpThumb.php?src=" .  $imageColorSource . "&w=$w&h=$h&iar=1";?>
            <a href="javascript:selectColor(<?=$assoc->getColor()?>, <?=$assoc->getId()?>)" id="ConfigImgThumb<?=$assoc->getId()?>"><img src="<?=$imageColorResized?>" width="<?=$w?>" height="<?=$h?>" alt="<?=$color?>" border="0"></a>
   <script>new Tip('ConfigImgThumb<?=$assoc->getId()?>', tipConfigImgThumb + '<b><?=$color?></b>');</script><?
            }
        ?>

4. reference WebmasterBulletin_JsConfigColors.phtml in layout/catalog.xml, in the catalog/product_view block section :

       <block type="catalog/product_view" name="product.products_jsConfigColors" as="webmasterbulletin_products_js_config_colors" template="catalog/product/view/WebmasterBulletin_JsConfigColors.phtml" />

5. in the product.view.phtml you can now place your color chooser where you like

   <?if ($_product->isSaleable() && $this->hasOptions()) echo $this->getChildHtml('poleouest_products_js_config_colors');?>

Worpdress is great for quick publishing and a variety of plugins are available that let users publish to various platforms. The image above, extracted from the gigya website, illustrates the versatily of social networks. Gigya itself provides a plugin for Wordpress. The technique is commonly described as cross posting, meaning one post on wordpress notifyes various social networks. Cross post plugins include:

• WordBook : cross-post your blog posts to your Facebook Wall.
• Same for wordbooker
• Wordpress to myspace publishes  posts to myspace
• Ping FM is a free  service that publishes posts to social networks. Wordpress has a few plugins that integrate with ping.fm, check this out

Statistics are an important part of social networking : no point developping web presence without knowing where you go

• Facebook Share Stats : provides charts and numbers  on your posts shared on Facebook, with statistics and charts about the number of “like“, comments and clicks received.

Interesting links

• Summary of blog / social interaction by Rachel Levy

• TDO Mini Forms : comes with a lot of options that specify who can publish what and how new posts are moderated
• FV Community News

Out of smart combination of powerful jquery plugins and functions comes the Minibar, contextual editing menu that pops up in windows Office 2007 fashion. The demo provided works with standard textarea editor but we’d like to see it implemented within tinymce or fckeditor, for instance : no doubt this is coming in the next few hours !!