Thursday 21 March 2013

Add category Slider With More/Less Functionality


Create  Category Slider with Less/More Functionality

Add Js and CSS

<link href="<?php echo $this->getSkinurl('css/overzichtstyle.css')?>" rel="stylesheet" type="text/css">

<script type="text/javascript" src="<?php echo $this->getSkinurl('js/jquery_002.js');?>"></script>

<script type="text/javascript" src="<?php echo $this->getSkinurl('js/jquery_004.js')?>"></script>

<script type="text/javascript" src="<?php echo $this->getSkinurl('js/expander.js')?>">
</script>

<script language="javascript" src="<?php echo $this->getSkinurl('js/seo.js')?>"></script>


Change category view.phtml

<?php
    $_helper    = $this->helper('catalog/output');
    $_category  = $this->getCurrentCategory();
    $_imgHtml   = '';
    if ($_imgUrl = $_category->getImageUrl()) {
        $_imgHtml = '<div class="category-image"><img src="'.$_imgUrl.'" alt="'.$this->htmlEscape($_category->getName()).'" title="'.$this->htmlEscape($_category->getName()).'" /></div>';
        $_imgHtml = $_helper->categoryAttribute($_category, $_imgHtml, 'image');
    }
?>
<div id="mm_seotextholder">
    <div id="mm_seotextcontent"> <?php if($_imgUrl): ?>
    <?php echo $_imgHtml ?>
<?php endif; ?>
      <h1><?php echo $_helper->categoryAttribute($_category, $_category->getName(), 'name') ?></h1></h1>
     
              <?php if($_description=$this->getCurrentCategory()->getDescription()): ?>
    <div class="category-description std">
        <?php echo $_helper->categoryAttribute($_category, $_description, 'description') ?>
    </div>
    <?php endif; ?>
           
          
    </div>
  </div>
  <?php if($_imgHtml || $_helper->categoryAttribute($_category, $_description, 'description')):?>
  <!--<span id="mm_seoleesmeer">Lees meer</span>-->  
  <?php endif;?>

<?php echo $this->getMessagesBlock()->getGroupedHtml() ?>

<?php if($this->isContentMode()): ?>
    <?php echo $this->getCmsBlockHtml() ?>

<?php elseif($this->isMixedMode()): ?>
    <?php echo $this->getCmsBlockHtml() ?>
    <?php echo $this->getProductListHtml() ?>

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

Create More Tabs in Product info Tabs on Product View page

Add map tab

Navigate to=>Theam=>Layout=>catalog.xml

Add below code

 <action method="addTab" translate="title" module="catalog"><alias>Location</alias><title>Location</title><block>core/template</block><template>catalog/product/map.phtml</template></action>

Add this code in map.phtml


<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
/* private variables */
var geocoder;
var map;
var infowindow = new google.maps.InfoWindow();

/* function to initialize the map */
function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var mapOptions = {
        zoom: 10,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
}


function codeAddress(address, title, imageURL) {
    geocoder.geocode({ 'address': address }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({map: map,position: results[0].geometry.location,icon: imageURL,title: title});

            /* Set onclick popup */
var infowindow = new google.maps.InfoWindow({content: title});
google.maps.event.addListener(marker, 'click', function() {infowindow.open(marker.get('map'), marker);});
        } else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });
}

/* Geocoding based on latitude and longitude */
function codeLatLng(latlng, title, imageURL) {
    var latlngStr = latlng.split(',', 2);
    var lat = parseFloat(latlngStr[0]);
    var lng = parseFloat(latlngStr[1]);
    var latlng = new google.maps.LatLng(lat, lng);
    geocoder.geocode({ 'latLng': latlng }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            if (results[1]) {
                map.setZoom(11);
                marker = new google.maps.Marker({position: latlng,map: map,icon: imageURL,title: title,content: title});

                /* Set onclick popup */
            var infowindow = new google.maps.InfoWindow({content: title});
google.maps.event.addListener(marker, 'click', function() {infowindow.open(marker.get('map'), marker);});

            } else {
                alert('No results found');
            }
        } else {
            alert('Geocoder failed due to: ' + status);
        }
    });
}
</script>
<div>
  <div id="map_canvas" style="height:500px;width:600px;"></div>
</div>

<script>
/* set  iconpath and the initiate the google map */
var iconPath = "";
initialize();

/* Geocoding based on latitude and longitude */
codeLatLng('-33.971750, 150.894251', 'Glenfield NSW', iconPath + "icon2.png");

</script>

Tuesday 19 March 2013

for website performance






<filesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">

Header set Cache-Control "max-age=604800,public"

</filesMatch>

#################################

<IfModule mod_headers.c>

  <FilesMatch "\.(js|css|xml|gz)$">

    Header append Vary: Accept-Encoding

  </FilesMatch>

</IfModule>

Find Controller on Front End

Find Product View Page:




Mage::registry('current_product')

Find controller

Mage::app()->getFrontController()->getRequest()->getRouteName() == 'catalog'

Add Related Product using Ajax

<script src="<?php echo $this->getJsUrl() ?>mage/adminhtml/loader.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>var js = jQuery.noConflict(); </script>
<?php if($this->getItems()->getSize()): ?>
      
      <form action="" method="post" id="" enctype="multipart/form-data">
           <input type="hidden" name="related_product_custom" id="related_product_custom" value="" />
        <ol class="relatedeasy">
        <?php foreach($this->getItems() as $_item): ?>
        <li class="relatedli<?php if($_item->isComposite() || !$_item->isSaleable()): ?>&nbsp;super-products<?php endif; ?>">
            <div class="product-images">
            <?php if(!$_item->isComposite() && $_item->isSaleable()): ?>
                <span class="checkbox-container">
                <?php if (!$_item->getRequiredOptions()): ?>
                   
                    <input name="qty_related_<?php echo $_item->getId() ?>" id="qty_related_<?php echo $_item->getId() ?>" value="" size="4" title="<?php echo $this->__('Qty') ?>" class="input-text qty rel_qty" maxlength="12" />
                <?php endif; ?>
                </span>
            <?php else: ?>
                <span class="checkbox-container">&nbsp;</span>
            <?php endif; ?>
                <a href="<?php echo $_item->getProductUrl() ?>"><img src="<?php echo $this->helper('catalog/image')->init($_item, 'thumbnail')->resize(56) ?>" alt="<?php echo $this->htmlEscape($_item->getName()) ?>" /></a>
            </div>
            <div class="product-details">
                    <div class="shortdesc"><a href="<?php echo $_item->getProductUrl() ?>"><?php echo $this->htmlEscape($_item->getName()) ?></a>
                   <?php echo $_item->getShortDescription()?>
                    </div>
                    <?php echo $this->getPriceHtml($_item, true) ?>
                   
            </div>
        </li>
        <?php endforeach ?>
        <button type="button" title="<?php echo $this->__('Add to Cart') ?>" id="cart_add"  class="button btn-cart" ><span><span><?php echo $this->__('Add to Cart') ?></span></span></button>
        <div id="loadingmask" style="display: none;">
<div class="loader" id="loading-mask-loader"><img src="<?php echo str_replace("index.php/","",$this->getUrl()) ?>skin/adminhtml/default/default/images/ajax-loader-tr.gif" alt="<?php echo $this->__('Loading...') ?>"/><?php echo $this->__('Loading...') ?></div>
<div id="loading-mask"></div>
</div>
        </ol>
        </form>
<script type="text/javascript"> 

  js(document).ready(function() {
    js('#cart_add').live('click', function(event)
 {

    var pdt_arr=[];
   
   js('.rel_qty').each(function(e,elem){
       
        var pdt_id=elem.readAttribute('id').split('_')[2];
        var qty=js('#qty_related_'+pdt_id).val();
           var str="";
        if(qty>0)
        {
            var pdt_qty=pdt_id+"_"+qty;
    
            pdt_arr.push(pdt_qty);
        }       
    });
   
      js('#related_product_custom').val(pdt_arr);
     var myval=    js('#related_product_custom').val();
    Element.show('loadingmask');
    js.ajax({
        type: "POST",
        url: "<?php echo $this->getUrl('checkout/cart/addnew') ?>",
        cache: false,
        data: "pdt="+myval,
        success: function(data)
        {
            Element.hide('loadingmask');
            location.reload();           
            alert("Product added Successfully");
          
        }
         });

 });
 });
 </script>
<?php endif ?>


Add function in Controller /app/code/core/Mage/Checkout/controllers/cartcontroller

public function addnewAction()
    {
            try
            {
             $params = $this->getRequest()->getParams('pdt'); 
             $pqty=explode(",",$params['pdt']);         
             $cart = Mage::getSingleton('checkout/cart');
             $model = Mage::getModel('catalog/product');       
            //print_r(explode("_",$pqty[0]));
              for($i=0;$i<count($pqty);$i++)
                {
                                   
                     $qty=explode("_",$pqty[$i]);
                                              
                     $_product = $model->load($qty[0]);
                    // $_product->setVisibility(Mage_Catalog_Model_Product_Visibility::VISIBILITY_BOTH); 
                    //print_r($_product->getId());             
                     $cart->addProduct($_product->getId(), $qty[1]);
                   
               }
               $cart->save();
              Mage::getSingleton('checkout/session')->setCartWasUpdated(true);
                  
          
        }
        catch(exception $e){

                return $e->getMessage().$e->getLine();
        }
    }

Fancy Box Image Popup

<link rel="stylesheet" href="<?php echo $this->getSkinUrl('css/jquery.fancybox-1.3.4.css');?>" type="text/css" media="screen" />
<script src="<?php echo $this->getSkinUrl('js/jquery.js');?>"></script>
<script src="<?php echo $this->getSkinUrl('js/jquery.fancybox-1.3.4.pack.js');?>"></script>
<script type="text/javascript">
var j=$.noConflict();
j(document).ready(function() {
       j(".single_1").fancybox({
          helpers: {
              title : {
                  type : 'float'
              }
          }
      });
});
</script>

  <a class="single_1" href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $_image->getFile()); ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>" >
                <img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(256); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a>
                <div class="product-name"><h1><?php echo $this->htmlEscape($_image->getLabel())?></h1></div>