Friday, December 4, 2015

Display Twitter Bootstrap Tooltip on Page Load (Initalize)

$('.tooltip-block').tooltip().eq(0).tooltip('show').tooltip('disable').one('mouseout', function() {
  $(this).tooltip('enable');
});

Friday, October 23, 2015

Magento: All Categories and respective Thumbnails in Magento 1.9

Got it. Here is the result, we need to the attribute to the collection and then get the image from the respective folder:

<?php $_helper = Mage::helper('catalog/category'); ?>
<?php $_categories = $_helper->getStoreCategories(false, true, false)
                    //Here is the solution
                    ->addAttributeToSelect('image')                    
                    ->addOrderField('name');
 ?>
<?php if (count($_categories) > 0): ?>
    <ul>
        <?php foreach($_categories as $_category): ?>
            <li>
                <a href="<?php echo $_helper->getCategoryUrl($_category) ?>">
                    <?php 
                        echo $_category->getName();
                        echo '<img src="'$_category->getImageUrl().'" width="100" height="100"/>';
                    ?>
                </a>
            </li>
        <?php endforeach; ?>
    </ul>
<?php endif; ?>

Note: if you using Magento version less then 1.9 you change "image" to "thumbnail"

->addAttributeToSelect('thumbnail')

Magento: Display Dumping Variables

The native Zend_Debug::dump() function is a step forward from the usual approach to dumping variables to debug your code (usually by using var_dump or print_r).

Zend_Debug::dump($_category->getData())

Magento: How to remove index.php from URL in IIS

First you need create web.config file under magento root folder then copy below into web.config


<?xml version="1.0" encoding="UTF-8"?>

<configuration>
 <system.webServer>
  <rewrite>
   <rules>
    <rule name="MYRule" stopProcessing="true">
    <match url=".*" ignoreCase="false" />
    <conditions>
    <add input="{URL}" pattern="^/(media|skin|js)/" ignoreCase="false" negate="true" />
    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
    </conditions>
    <action type="Rewrite" url="index.php" />
   </rule>
   </rules>
  </rewrite>
 </system.webServer>
</configuration>

Wednesday, October 21, 2015

Magento: Get tax value

$totals = Mage::getSingleton('checkout/session')->getQuote()->getTotals(); //Total object
$totals['tax']->getValue();

Magento: Get Grandtotal without Tax

$totals = Mage::getSingleton('checkout/session')->getQuote()->getTotals(); //Total object
$grandtotal = $totals["grand_total"]->getValue(); //Grandtotal value

Magento: Get Subtotal without Tax

$totals = Mage::getSingleton('checkout/session')->getQuote()->getTotals(); //Total object
$subtotal = $totals["subtotal"]->getValue(); //Subtotal value

Tuesday, October 20, 2015

Magento: How to remove or add the Welcome Text "Default welcome msg!"

By default Magento comes with the following Welcome Text: Default welcome msg! To remove the Magento Welcome Text, log in to your Magento admin panel and go to System > Configuration > General section > Design. Then click Header and remove the Default welcome msg! text from the Welcome Text field. Click Save Config to save the change. Now you can check your store's frontend - the welcome text will not be shown there.

Magento: How to Hide breadcrumbs via the admin-panel?

Best way to do it, Go to admin page:

System --> Configuration --> Web --> Default Pages --> Show Breadcrumbs for CMS Page


- Choose No for hide breadcrumbs 

Thursday, October 8, 2015

CSS: Fixed :nth-child in IE8

/* li:nth-child(1) */
#nav ul li:first-child a {
    border-top: 5px solid red;
}
/* li:nth-child(2) */
#nav ul li:first-child + li a {
    border-top: 5px solid blue;
}
/* li:nth-child(3) */
#nav ul li:first-child + li + li a {
    border-top: 5px solid green;
}​

Thursday, October 1, 2015

PHP: Calculate duration between two dates

<?php
$date11 = '2013-03-12';
$date22 = '2013-03-15';
$date11 = strtotime($date11);
$date22 = strtotime($date22);
$diff = $date22 - $date11;
$diff_in_days = floor($diff/(60*60*24));
echo $diff_in_days; // 3
?>

<?php
$date11 = '2013-03-15';
$date22 = '2013-03-12';
$date11 = strtotime($date11);
$date22 = strtotime($date22);
$diff = $date22 - $date11;
$diff_in_days = floor($diff/(60*60*24));
echo $diff_in_days; // -3
?>

Monday, September 21, 2015

jQuery: How to close a dropdown on clicking anywhere on the body?

jQuery: How to close a dropdown on clicking anywhere on the body? The dropdown is displayed when user click on the 'more' button, to hide the dropdown again user should click on the 'more' button again. But if user want to close the dropdown by clicking anywhere on the body so we need add code on click document.
HTML
-----
<a class="select-link" href="https://www.blogger.com/blogger.g?blogID=3817399277949715318#"><a href="#" class="select-link">Select List</a>
<ul class="dropdown-menu-list">
    <li><a href="#">My item name 1</a></li>
    <li><a href="#">My item name 2</a></li>
    <li><a href="#">My item name 3</a></li>
    <li><a href="#">My item name 4</a></li>
</ul>

CSS
---
.dropdown-menu-list {display:none;}
jQuery
---
$(".select-link").on('click',function(e) {
    e.preventDefault();
    $(".dropdown-menu-list").show();
});

$(document).on('click', function (e) {
 var menu = $(".dropdown-menu-list");
 if(e.target !== menu.get(0) && menu.find($(e.target)).length === 0) {
  menu.animate({top: '100px'}, '200').fadeOut('fast');
  $('.select-link').removeClass('active');

  console.log(e.target);
  console.log(menu.get(0));
  console.log(menu.get(0) !== e.target);
 } 
});

Sunday, September 20, 2015

MySql: Fixed sort datetime string field dd-mm-yyyy

If you using a system where the dates are stored as strings in the format dd/mm/yyyy or dd-mm-yyyy. Is it possible to convert this to yyyy-mm-dd in a sort Query.


Table:Product

year
----
20-08-2015
02-03-2010
03-03-2011
02-03-2011
02-04-2011 

SELECT `year` FROM `Product` WHERE 1 order BY DATE_FORMAT(STR_TO_DATE(`year`, '%d-%m-%Y'), '%Y-%m-%d') DESC 

Saturday, August 22, 2015

PHP: Date Difference for PHP 5.2

function days_diff($d1, $d2) {

    $x1 = days($d1);
    $x2 = days($d2);  

    if ($x1 && $x2) {
        return abs($x1 - $x2);
    }

}

function days($x) {

    if (get_class($x) != 'DateTime') {

        return false;

    }  

    $y = $x->format('Y') - 1;
    $days = $y * 365;
    $z = (int)($y / 4);
    $days += $z;
    $z = (int)($y / 100);
    $days -= $z;
    $z = (int)($y / 400);
    $days += $z;
    $days += $x->format('z');

    return $days;

}

// Call function
$start_date = '2015-08-19 15:18:19';
$end_date = '2015-08-22 15:18:19';

$date1=date_create(date('Y-m-j',strtotime($start_date)));
$date2=date_create(date('Y-m-j',strtotime($end_date)));
$diff=date_diff($date1,$date2);

echo $diff;

Monday, August 17, 2015

List of svg support in email template


For more details

Monday, August 10, 2015

Bootstrap 3: Equal Height Columns with jQuery

When you want height of each have the same height using coloumn of Bootstrap my recommend you should Javascript calculate height of each row if you using css maybe not support all browser.

1. Html Code

<div class="row eq-heights">
      <div class="eq-col-sm-4 eq-col-md-4 col-md-4">
      <div class="content clearfix">column 1 first in source </div>    
    </div>
    <div class="eq-col-sm-4 eq-col-md-4 col-md-4">
        <div class="content clearfix">col 2 second in source </div>    
    </div>
    <div class="eq-col-sm-4 eq-col-md-4 col-md-4">
        <div class="content clearfix"> Third in source. something fdaf fafdafd  dafdafdafdaf fdafdf ffdfdfd something fdaf fafdafd  dafdafdafdaf fdafdf ffdfdfd something fdaf fafdafd  dafdafdafdaf fdafdf ffdfdfd something fdaf fafdafd  dafdafdafdaf fdafdf ffdfdfd </div>    
    </div>
</div>


2.Css Code


.content {
    background: #eee none repeat scroll 0 0;
    border: 1px solid #ccc;
    padding: 10px;
}



3.jQuery Code

$.fn.eqHeights = function(options) {

    var defaults = {  
        child: false ,
      parentSelector:null
    };  
    var options = $.extend(defaults, options); 

    var el = $(this);
    if (el.length > 0 && !el.data('eqHeights')) {
        $(window).bind('resize.eqHeights', function() {
            el.eqHeights();
        });
        el.data('eqHeights', true);
    }

    if( options.child && options.child.length > 0 ){
        var elmtns = $(options.child, this);
    } else {
        var elmtns = $(this).children();
    }

    var prevTop = 0;
    var max_height = 0;
    var elements = [];
    var parentEl;
    elmtns.height('auto').each(function() {

      if(options.parentSelector && parentEl !== $(this).parents(options.parentSelector).get(0)){
        $(elements).height(max_height);
        max_height = 0;
        prevTop = 0;
        elements=[];
        parentEl = $(this).parents(options.parentSelector).get(0);
      }

        var thisTop = this.offsetTop;

        if (prevTop > 0 && prevTop != thisTop) {
            $(elements).height(max_height);
            max_height = $(this).height();
            elements = [];
        }
        max_height = Math.max(max_height, $(this).height());

        prevTop = this.offsetTop;
        elements.push(this);
    });

    $(elements).height(max_height);
};

// run on load so it gets the size:
// can't have the same pattern for some reason or it scans the page and makes all the same height. Each row should be separate but it doesn't work that way.
$(window).load(function() {

//$('[class*="eq-"]').eqHeights();
$('.eq-heights [class*="eq-"]').eqHeights({parentSelector:'.eq-heights'});


  }); 

Working Demo

Wednesday, August 5, 2015

jQuery to hide a DIV when the user clicks outside of container

- Html code

<a href="#" class="select-link">Select List</a>
<ul class="dropdown-menu-list">
    <li><a href="#">My item name 1</a></li>
    <li><a href="#">My item name 2</a></li>
    <li><a href="#">My item name 3</a></li>
    <li><a href="#">My item name 4</a></li>
</ul>

- Css Code

.dropdown-menu-list {display:none;}


- jQuery Code

$(".select-link").on('click',function(e) {

    e.preventDefault();

    $(".dropdown-menu-list").show();


})


$(document).mouseup(function (e)
{
    var container = $("YOUR CONTAINER SELECTOR");

    if (!container.is(e.target) // if the target of the click isn't the container...
        && container.has(e.target).length === 0) // ... nor a descendant of the container
    {
        container.hide();
    }
});

Wednesday, June 17, 2015

jQuery split long ul list to multiple UL

1. HTML code

<ul id="bigList">
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
<li>Elem</li>
</ul>
2. jQuery Code
 var $bigList = $('#bigList'), group;
  while((group = $bigList.find('li:lt(20)').remove()).length){
    $('
    ').append(group).appendTo('body'); }
Working Demo

Monday, June 1, 2015

Scroll to bottom of image when mouse over

1. Css Code
<style type="text/css">

            .image-bg {

                margin:0;
                padding:0;
                background-image: url("landingpage_07.jpg");
                background-repeat: no-repeat;
                display: inline-block;
                height: 344px;
                padding-top: 31px;
                position: relative;
                width: 457px;

            }

            .image-bg:hover .image-shop-scroll {

                background-position: center 100% !important;

            }

            .image-bg .image-shop-scroll {

                transition: all 5s ease-out 0s;

            }

            .image-bg .image-shop-scroll {

                background-position: center 0;
                background-repeat: no-repeat;
                height: 313px;
                left: 0;
                margin-bottom: 20px;
                overflow: hidden;
                position: absolute;
                width: 100%;

            }

        </style>


2.html Code

<div>

            <span class="image-bg">

                <span style="background-image: url('demo1.jpg');" class="image-shop-scroll"></span>

                <span class="glare"></span>

            </span>

        </div>
Working Demo

Saturday, May 30, 2015

Exclude weekends on jQuery datepicker

$('yourSelector').datepicker({
    minDate: 0, // your min date
    maxDate: '+1w', // one week will always be 5 business day - not sure if you are including current day
    beforeShowDay: $.datepicker.noWeekends // disable weekends
});

Disable all Sundays in jQuery UI Calendar (datepicker)

$("#datepicker").datepicker({
    beforeShowDay: function(date) {
        var day = date.getDay();
        return [(day != 0), ''];
    }
});

Thursday, March 12, 2015

Javascript random number between two numbers

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min)) + min;
}

console.log(getRandomInt(1,100));

Javascript display numbers with commas

function commaSeparated(val){
    while (/(\d+)(\d{3})/.test(val.toString())){
      val = val.toString().replace(/(\d+)(\d{3})/, '$1'+','+'$2');
    }
    return val;
}

// Call Function
console.log(commaSeparated(1)); // 1
console.log(commaSeparated(10)); // 10
console.log(commaSeparated(100)); // 100
console.log(commaSeparated(1000)); // 1,000
console.log(commaSeparated(10000)); //10,000

Tuesday, March 3, 2015

PHP: show a comma on all value except last value from mysql_fetch_array

$count = 0;
while ($servdescarrayrow = mysql_fetch_array($servdescarray)) {
    if ($count++ > 0) echo ",";
    echo $servdescarrayrow['serv_desc'];
}

PHP: Prepend leading zero before single digit number

It will only add the zero if it's less than the required number of characters.

When working with numbers, you should use %d (rather than %s), especially when there is the potential for negative numbers. If you're only using positive numbers, either option works fine.

For example:

sprintf("%04s", 10); returns 1000
sprintf("%04s", -10); returns 0-10

Where as:

sprintf("%04d", 10); returns 1000
sprintf("%04d", -10); returns 100

<?php
    $num = 4;
    $num_padded = sprintf("%02d", $num);
    echo $num_padded; // returns 04
?>
You can use sprintf: http://php.net/manual/en/function.sprintf.php.

Wednesday, February 4, 2015

WordPress: Defined Home and Site Url

WP_SITEURL, defined since WordPress Version 2.2, allows the WordPress address (URL) to be defined. The value defined is the address where your WordPress core files reside. It should include the http:// part too. Do not put a slash "/" at the end. Setting this value in wp-config.php overrides the wp_options table value for siteurl and overrides the WordPress address (URL) field in the Administration > Settings > General panel when logging in using wp-login.php. It will _not_ update your Home url. Read more about this in depth in the link provided in the Note field:

WP_HOME is another wp-config.php option added in WordPress Version 2.2. Similar to WP_SITEURL, WP_HOME overrides the wp_options table value for home but does not change it permanently. home is the address you want people to type in their browser to reach your WordPress blog. It should include the http:// part and should not have a slash "/" at the end.

If you won't change the Database value though, so need manually add WP_HOME and WP_SITEURL in wp-config

define('WP_HOME','http://mytest.com');
define('WP_SITEURL','http://mytest.com'); 

Friday, January 30, 2015

Email template: eDM SPECIFICATIONS



eDM SPECIFICATIONS

- Content must be supplied in HTML
- email body width: 600 pixels
- Total file weight (including HTML, CSS, images): 50KB
- We cannot accept emails built with CSS in the header tags or that include flash or forms!
- Use HTML tables for layout. Tables control the design layout and presentation.
- Use Standard Inline CSS. Do not design your HTML as a web page. Most web-based email clients strip Header CSS

HTML

- Explicitly define colour values as email clients may have different default colours which vary from web browsers.
- All image tags should include width and height attributes as stretched images will not render correctly in some email clients.
- <div> tags as the box model is not supported by a majority of e-mail clients and should be avoided. Tables should be used for e-mail layout. Also, avoid using rowspan as it won’t render consistently.
- It is recommended to set cellpadding and cellspacing to 0 on the table elients.
- Line-breaks (<br />) should be used instead of paragraphs (<p>) to ensure a more consistent rendering.
- Use blank <td>s with spacer images or alignment techniques with nested tables where necessary instead of padding or margin attributes as some email clients do not support them.


CSS

- There are many different types of email programs and it is likely your email will display differently across each of them. For this reason we ask you not to put CSS in the header tags or link to a CSS file since many email programs will not recognise it.
- You may wish to use standard in-line CSS coded HTML e.g. <span style="font-weight:bold; ...etc..."> as opposed to <span class="style 5">. If so, please refer to the attached guide from Campaign Monitor which details the programs that support CSS.
- Please note, Outlook 2007 uses Word 2007 to display HTML email and not Internet Explorer, which strips out all CSS. Our advice is to keep your email design simple to ensure your email will appear as intended.

Tuesday, January 27, 2015

Email preheader best practices, Preheader email marketing and email preheader html

A preheader is a small section that appears at the top of your email. The following tips can help you make the most of the preheader in every marketing campaign  you develop.




  • Understand that the first line of your text is critical. It is this text that will appear when recipients access their inboxes from smartphones, tablets and other mobile devices.
  • Know how to code the preheader properly. The preheader should convey the message of your email clearly and concisely.
  • Use the preheader text to summarize your offer in a way recipients can easily understand.
  • Keep things short and simple. Your recipients are busy, and they are probably looking through dozens of new emails every time they log on to their mobile devices.
  • Use left alignment for your preheader text. This will make the text easier to read, especially on mobile devices.
  • Use a standard easy to read font for your preheader text. Now is not the time to get too fancy.
  • Include a clear call to action in your preheader text. Link your call to action to your landing page.
  • Test your preheader text as you would any other part of your email. Try various A/B splits to see which preheaders have the best response and open rates.

 
 <style>
   /* ... */
    /*--- Preheader declaration in style block in addition to inline for Outlook */
    .preheader { display:none !important; visibility:hidden; opacity:0; 
color:transparent; height:0; width:0; }
  </style>
</head>

<body>
  <!-- PRE-HEADER TEXT -->
  <span class="preheader" style="display: none !important; visibility: hidden; 
opacity: 0; color: transparent; height: 0; width: 0;">Preheader text shows up 
in GMail, iOS, Mail.app, &amp; more: 75 text char limit</span>
  ...

Wednesday, January 21, 2015

Convert from MySQL datetime to another format with PHP

// $datetime is something like: 2014-01-31 13:05:59
$time = strtotime($datetimeFromMysql);
$myFormatForView = date("d-m-Y g:i A", $time);
// $myFormatForView is something like: 01/31/14 1:05 PM

Tuesday, January 20, 2015

PHP get Google News RSS Feed

If you know how to get the HTML data from the right XML-element (<description> in this case) you can just strip all HTML with PHP's strip_tags

This seems to work like you want it:

<?php
$news = simplexml_load_file('http://news.google.com.kh/news?pz=1&cf=all&ned=kh&hl=en&as_scoring=r&as_maxm=4&q=html5&as_qdr=a&as_drrb=q&as_mind=6&as_minm=3&cf=all&as_maxd=5&output=rss');

foreach($news->channel->item as $item) {
    
    echo "<h1>" . $item->title . "</h1>";
    echo '<p>' . strip_tags($item->description) ."</p>";
} 
?>