Easy Way to Run Yii’s yiic.php Command Line Tool (Windows)

To avoid having to change any PATH variables in your windows installation, you can run yiic.php commands by defining the exact path to your php.exe file in your PHP installation.

C:/path/to/php/php.exe C:/path/to/yii/framework/yiic.php webapp C:/path/to/website/folder

WordPress Custom Post Type Permalink not working on 3.5

This was a fun one. I created a custom post type on WordPress 3.5.1 and everything appeared like it should be working. The permalink was displaying correctly underneath the title of the post, however once I hit “View Post” it threw me to a 404 page.

The solution was to go to Settings -> Permalinks, then hit “Save Changes”.

It seems that WordPress requires some sort of undocumented refresh of the permalinks after you create a custom post type. Hopefully that saves someone else a lot of time!

jQuery Focus / Scroll to element on page

A simple way to adjust the position of the browser window to an element of interest is by using the jQuery animate function. Adjust the selector (#focus_element) in the following code to an element you want the screen to scroll to.

$('html, body').animate({
    scrollTop: $("#focus_element").offset().top
}, 2000);

Major Performance Optimization for Joomla 2.5 Websites

Joomla has always been a resource hogging monster, but I have recently discovered its default behavior is loading a lot of extra javascript files on the frontend. If you are using a template and extensions that rely on jQuery instead of Mootools, you can remove 332.3kB on every page load with a simple fix. This fix resulted in a 33% reduction in page size for the website I recently launched.

Place the following code in the main index.php file of your template (i.e. /templates/beez/index.php), immediately following the code at the top: “defined(‘_JEXEC’) or die;”

if(JFactory::getUser()->guest == 1){
    JHtml::_('behavior.framework', true);

    unset($this->_scripts[JURI::root(true).'/media/system/js/mootools-core.js']);
    unset($this->_scripts[JURI::root(true).'/media/system/js/mootools-more.js']);
    unset($this->_scripts[JURI::root(true).'/media/system/js/core.js']);
    unset($this->_scripts[JURI::root(true).'/media/system/js/caption.js']);

    if (isset($this->_script['text/javascript']))
    {
       $this->_script['text/javascript'] = preg_replace('%window\.addEvent\(\'load\',\s*function\(\)\s*{\s*new\s*JCaption\(\'img.caption\'\);\s*}\);\s*%', '', $this->_script['text/javascript']);
       if (empty($this->_script['text/javascript']))
          unset($this->_script['text/javascript']);
    }
}

The first line of the code checks to see if the user is logged in before removing the Mootools-related files. Mootools is required for frontend editing, and this conditional ensures that the scripts are available to users who might use that feature.

A “fix” for Nivo Slider not working in IE7 or IE8

As I was performing browser-testing on a site that is nearing release I found that the Nivo Slider would sit there with a spinning loading icon on IE7 and 8. It worked perfectly on all other browsers (including IE9), and the developer tools in Internet Explorer were not throwing up any errors. I tried modifying the Nivo Slider call to no options, CSS changes, and changing the order of Nivo options without any luck.

The Solution

There was a form field in the footer of my page that had an extra quotation mark:

<input type="submit" id="site-index-redirect" value="Go"" />

Removing the extra quotation mark fixed the issue, and Nivo Slider began working again in Internet Explorer 7 and 8. Check the forms on your page for extra quotation marks, hopefully this saves someone a lot of time troubleshooting!

Memcached (Memory-based cache) Caching for OpenCart

Current Version: v1.1 (9/9/2012)

Safely increase the speed of your store by converting OpenCart’s hard drive based caching approach to memory. This non-invasive caching uses OpenCart’s already existing caching mechanisms to implement Memcached. Additionally, this extension adds individual product and category caching to speed up every area of your website.

What is Memcached?

Memcached is a “high-performance, distributed memory object caching system, generic in nature, but intended for use in speeding up dynamic web applications by alleviating database load.” It is used extensively by sites such as Facebook, Twitter, Youtube, and Wikipedia.

How does this compare to other OpenCart caching solutions?

1) Many other caching solutions are hard-drive based. While you may get to avoid database calls, you are going to be limited by the speed of your hard drive to serve that information. Also, any hard-drive based page cache extension will have a hard time with individual product page caching (creating, deleting, and modifying thousands and thousands of temporary files on your server is not a good idea).

2) Some solutions do far to much processing. This caching solution is for developers familiar with good practices in building a template. Your javascript and CSS files should already be minified on a production environment, and any script that does that on the fly is going to tax your CPU every page load.

3) This solution is not invasive to your OpenCart installation. It safely modifies the existing caching mechanism already in place, and leaves all functions and calls to the cache untouched.

4) Any additional extensions you have installed that use OpenCart’s cache will automatically switch to Memcached, no extra code required.

How does OpenCart benefit from Memcached?

By default, OpenCart’s caching mechanism stores all cache files in /system/cache. Each cache file is either a single database result, or a collection of several rows of database results. Because it reads and writes from that folder, its speed is limited by how fast the hard drive can react to many tiny files. Also, since we are dealing with so many tiny files, the OpenCart developers have opted to not include caching for individual product pages.

Memcache excels at handling these tiny database results. The speed of your server’s memory is going to be far faster than your hard drives as well, making the read and writes near instant. Now that the read/write speed has increased, we can safely cache thousands of product pages and categories.

Since this extension safely hooks in with the existing OpenCart cache, any changes you make to the site will invalidate the cache and rebuild the next time the pages are hit.

Features

• Memcached (memory-based caching)
• Major increase to site speed
• Adds individual product page caching
• Adds category caching
• Template independent
• Multilingual
• Multi-store support

Using Yii Framework Validators Outside of a Form

The Yii Framework comes bundled with a large collection of validation methods used to validate user input data in a form. In some situations you might want to validate data outside of a form, and instead of rolling your own validation methods it is best to hook into the existing Yii ones.

For example, in a method you want to check if a value is a valid email address, you can use the following code:

$validator = new CEmailValidator;

if(!$validator->validateValue($email_address))
{
   //invalid
}

For a list of all the Yii validators you can hook into, please visit the system.validators reference page.

Phone Number HTML Links for Visitors on Mobile Devices

Displaying mobile numbers as clickable links on mobile devices can be a very easy task. If your numbers are formatted in any of the following ways, the vast majority of your mobile visitors (iPhone and Android) will automatically see the phone number as a clickable link:

• (555) 555-5555
• 555 555 5555
• 555.555.5555

If your phone numbers are not formatted this way you can add the following HTML around your phone numbers:

<a href="tel://555.555.5555">555.555.5555</a>

It is important that only your mobile visitors see this link, as the majority of desktop users will be greeted with an error message when clicking the link. Make sure the linked and non-linked versions of the phone number are swapped out accordingly depending on the device the user is browsing your website with.

For more information, please check out mobile Tuts+ Mobile Web Quick Tips post.

Website Crashes Only in Internet Explorer 8

Internet Explorer continues to be the most frustrating browser to develop websites for. The most recent bug I encountered with IE8 took hours to track down.

While working on a website I noticed in IE8 the site would crash the entire browser before the site even had a chance to render any content. The website worked fine in IE6, 7, and 9. The error logs provided no valuable information, leaving me to a trial and error approach for debugging. I eventually found that when I disabled the stylesheet, the website would render.

The Problem

There is a known bug with jQuery 1.6.2 that causes Internet Explorer 8 to crash if there is a body background image defined in a CSS file loaded before jQuery in the header: http://bugs.jquery.com/ticket/9028

The Solution

Change your jQuery version, preferrably to 1.7.1. Check out the jQuery website for more information.

Debugging Javascript using the Browser’s Console

Avoid using alert() to debug your Javascript, and instead use the browser’s built in console. It is an unobtrusive way to view the status of variables and events throughout your code. For example:

console.log("Hello!");

Please visit “How to debug Javascript” for more information