Magento 2, Magento Development, Customization, Extension Development and Integration, Optimization, SEO and Responsive Design

Magento 2, Magento Development, Customization, Extension Development and Integration, Optimization, SEO and Responsive Design

How to add rel=prev and rel=next to Magento product pagination

If you want to add rel=prev and rel=next for SEO purpose and high ranking of your website. Than follow easy step to add rel=prev and rel=next to Magento product pagination.

ex.
<link rel="prev" href="http://www.example.com/store.html?p=2">
<link rel="next" href="http://www.example.com/store.html?p=4">

1. So, if you didn’t already modified head.phtml file, create identical directory hierarchy and copy/paste head.phtml in your theme or package.

Path example if using package:
..\app\design\frontend\[your_package_name]\default\template\page\html\head.phtml

Path example if using theme:
..\app\design\frontend\default\[your_theme_name]\template\page\html\head.phtml

2. Add code below to head.phtml at the bottom of file.

$actionName = $this->getAction()->getFullActionName();
if ($actionName == 'catalog_category_view') // Category Page
{
     $category = Mage::registry('current_category');
     $prodCol = $category->getProductCollection()->addAttributeToFilter('status', 1)->addAttributeToFilter('visibility', array('in' =>     array(Mage_Catalog_Model_Product_Visibility::VISIBILITY_IN_CATALOG,   Mage_Catalog_Model_Product_Visibility::VISIBILITY_BOTH)));
     $tool = $this->getLayout()->createBlock('page/html_pager')->setLimit($this->getLayout()->createBlock('catalog/product_list_toolbar')->getLimit())->setCollection($prodCol);
     $linkPrev = false;
     $linkNext = false;
     if ($tool->getCollection()->getSelectCountSql()) {
     if ($tool->getLastPageNum() > 1) {
     if (!$tool->isFirstPage()) {
     $linkPrev = true;
     if ($tool->getCurrentPage() == 2) {
     $url = explode('?', $tool->getPreviousPageUrl());
     $prevUrl = @$url[0];
     }
     else
    {
          $prevUrl = $tool->getPreviousPageUrl();
     }
  }
  if (!$tool->isLastPage()) {
  $linkNext = true;
  $nextUrl = $tool->getNextPageUrl();
 }
 }
}
if ($linkPrev) echo '<link rel="prev" href="' . $prevUrl . '" />';
if ($linkNext) echo '<link rel="next" href="' . $nextUrl . '" />';
}

How to convert ul/li (unordered list) into Dropdown using jquery

If you want to convert your ul/li into dropdown list, you can do it easily using jquery. If you have responsive web page and you want to convert your menu which is in ul/li structure and want to change in dropdown for small screen or mobile screen than use following jquery solution.

Suppose you have menu structure as:

<div class="menu">
<ul class="myclass">
        <li><a href="one.php">one</a></li> 
        <li><a href="two.php">two</a></li> 
        <li><a href="three.php">three</a></li> 
        <li><a href="four.php">four</a></li> 
        <li><a href="five.php">five</a></li> 
        <li><a href="six.php">six</a></li>
</ul>
</div>

and want to convert into dropdown as:

<select>
       <option value="one.php">one</option> 
       <option value="two.php">two</option> 
       <option value="three.php">three</option> 
       <option value="four.php">four</option> 
       <option value="five.php">five</option> 
       <option value="six.php">six</option> 
</select>

<script>
jQuery(document).ready(function()
{
    jQuery(function()
   {
        jQuery('ul.myclass').each(function()
       {
            var $select = jQuery('<select />');
            jQuery(this).find('a').each(function()
           {
               var $option = jQuery('<option />');
               $option.attr('value', jQuery(this).attr('href')).html(jQuery(this).html());
               $select.append($option);
$select.click(function()
              {
                if(jQuery(this).val() != "#")
               {
window.location.href = jQuery(this).val();
               }
            });
        });
jQuery(".menu").append($select);
    });
jQuery("ul.myclass").hide());
  });
});
</script>

 

Copyright @ 2017 HKBlog.