Blog2Works

This is the blog of freelance website designer and developer Ben Johnson, with thoughts on design, programming, frameworks, jquery and the latest technology.
  • PHP Upgrade: Cannot load the ionCube PHP Loader - it was built with configuration 2.2.0, whereas running engine is API220090626,NTS

    Author: Ben Johnson

    Tags: , , ,

    Cannot load the ionCube PHP Loader - it was built with configuration 2.2.0, whereas running engine is API220090626,NTS This PHP error is being caused because IonCube is trying to load the old version. To update this on Debian: EDIT: /etc/php5/conf.d/aa_ioncube.iniFIND: zend_extension = /usr/local/ioncube/ioncube_loader_lin_5.2.soREPLACE: zend_extension = /usr/local/ioncube/ioncube_loader_lin_5.3.so This error was caused when upgrading from PHP 5.2 to 5.3, I wanted to make sure no configuration files was overwritten. So when upgrading via apt-get, I made sure to always select the option for the local configuration files.  


  • Clear browser cache

    Author: Ben Johnson

    Tags:

    In order to speed up web browsing, modern web browsers are built to download web pages and store them locally on your computer's hard drive. So when you visit the same page for a second time, the browser speeds up loading time by loading the page locally from cache instead of downloading everything again. Although storing Internet cache makes web browser faster you sometimes want to overwrite this defualt behaviour, for example to see recent changes made to a webpage you just uploaded. Clearing Cache Memory This is done by doing what is called a "force refresh" by pressing both control and F5 buttons simultaneously on your keyboard (depending on your browser). Depending on your operating system all you need to do is the following key combination: Windows: ctrl + F5 Mac/Apple: Apple + R or command + R Linux: F5 If you find this does not work you can find step by step guides for Chrome, Firefox 3, Firefox 2, Internet Explorer 8, Internet Explorer 7, Internet Explorer 6, Safari.


  • Common MySQL data types

    Author: Ben Johnson

    Tags: , ,

    When designing a new database, each time I have to re-think what types should be used for one or the other columns. So I decided to make my own mainly just for reference but somebody may find this useful. Column Data Type Comment id INT AUTO_INCREMENT, UNSIGNED page name VARCHAR(64)   meta title VARCHAR(150)   meta description VARCHAR(160)   meta keyword VARCHAR(255)   status enum('ENABLED','DISABLED') DEFAULT "DISABLED" featured TINYINT(1) DEFAULT "0" content TEXT username VARCHAR(32) password VARCHAR(64) email address VARCHAR(100) phone/mobile VARCHAR(20) firstname/company VARCHAR(32) address_1 VARCHAR(128) postcode VARCHAR(10) file VARCHAR(255)   price DECIMAL (7,2)  UNSIGNED order INT(11)   ip VARCHAR(15) DEFAULT "0" modified TIMESTAMP on update CURRENT_TIMESTAMP create DATETIME DEFAULT "0000-00-00 00:00:00" forien_key INT(11)  


  • jQuery Selectors

    Author: Ben Johnson

    Jquery Selectors are used to specify which element from the HTML document you would like to use. If you are familuar with CSS 1-3 you will noticed the simularity. All meta-characters ( such as !"#$%&'()*+,./:;<=>?@[\]^`{|}~ ) must be escapes with two backslashes: \\.  All Selector ("*")Select all elements Contains Prefix Selector [name|="value"]Selects elements that have the specified attribute with a value either equal to a given string or starting with that string followed by a hyphen (-). Contains Selector [name*="value"]Selects elements that have the specified attribute with a value containing the a given substring. Contains Word Selector [name~="value"]Selects elements that have the specified attribute with a value containing a given word, delimited by spaces Ends with Selector [name$="value"]Selects elements that have the specified attribute with a value ending exactly with a given string. The comparison is case sensitive. Equals Selector [name="value"]Selects elements that have the specified attribute with a value exactly equal to a certain value. Not Equal Selector [name!="value="]Select elements that either don't have the specified attribute, or do have the specified attribute but not with a certain value Starts with Selector [name^="value"]Selects elements that have the specified attribute with a value beginning exactly with a given string :animated SelectorSelect all elements that are in the progress of an animation at the time the selector is run :button SelectorSelects all button elements and elements of type button. :checkbox SelectorSelects all elements of type checkbox :checked SelectorMatches all elements that are checked Child Selector ("parent > child")Selects all direct child elements specified by "child" of elements specified by "parent" Class Selector (".class")Selects all elements with the given class :contains() SelectorSelect all elements that contain the specified text Descendant Selector ("ancestor descendant")Selects all elements that are descendants of a given ancestor :disabled SelectorSelects all elements that are disabled Element Selector ("element")Select all elements with the given tag name :empty SelectorSelect all elements that have no children (including text nodes) :enabled SelectorSelects all elements that are enabled :eq() SelectorSelect the element at index n within the matched set :even/:odd SelectorSelects even elements, zero-indexed and odd :file SelectorSelect all elements of type file :first-child SelectorSelects all elements that are the first child of their parent. :first SelectoSelects the first matched element. :focus selectorSelects element if it is currently focused. :gt() SelectorSelect all elements at an index greater than index within the matched set. Has Attribute Selector [name]Selects elements that have the specified attribute, with any value. :has() SelectorSelects elements which contain at least one element that matches the specified selector. :header SelectorSelects all elements that are headers, like h1, h2, h3 and so on. :hidden SelectorSelects all elements that are hidden. ID Selector (“#id”)Selects a single element with the given id attribute. :image SelectorSelects all elements of type image. :input SelectorSelects all input, textarea, select and button elements. :last-child SelectorSelects all elements that are the last child of their parent. :last SelectorSelects the last matched element. :lt() SelectorSelect all elements at an index less than index within the matched set. Multiple Attribute Selector [name="value"][name2="value2"]Matches elements that match all of the specified attribute filters. Multiple Selector (“selector1, selector2, selectorN”)Selects the combined results of all the specified selectors. Next Adjacent Selector (“prev + next”)Selects all next elements matching "next" that are immediately preceded by a sibling "prev". Next Siblings Selector (“prev ~ siblings”)Selects all sibling elements that follow after the "prev" element, have the same parent, and match the filtering "siblings" selector. :not() SelectorSelects all elements that do not match the given selector. :nth-child() SelectorSelects all elements that are the nth-child of their parent. :only-child SelectorSelects all elements that are the only child of their parent. :parent SelectorSelect all elements that are the parent of another element, including text nodes. :password SelectorSelects all elements of type password. :radio SelectorSelects all elements of type radio. :reset SelectorSelects all elements of type reset. :selected SelectorSelects all elements that are selected. :submit SelectorSelects all elements of type submit. :text SelectorSelects all elements of type text. :visible SelectorSelects all elements that are visible. Reference Manual: Jquery, W3C http://api.jquery.com/category/selectors/


  • Install SmartyPDT Plugin into Zend Studio

    Author: Ben Johnson

    Tags: , , , , ,

    This guide explains how to install Smarty PDT with Zend Studio. Smarty PDT is a Smarty template syntax colouring, a feature that is not available by default with Zend Studio. Installing Smarty PDT into Zend Studio Be sure to check that the .tpl fule are not associated with any content type. Go to Window -> Prefences -> General -> Content Types Download the latest SmartyPDT .zip (currently 0.9.0) from http://code.google.com/p/smartypdt/ Go to Help -> Install New Software Click Add then click Archive button and select the .zip downloaded previously By default the Group item by category ensure you unselect this Click Next, accept the condition and restart Zend Studio If you are prompted that this is an unsigned package, just ignore the warning and install it anyway. Right click on the PHP project in the PHP Explorer and Select Configure -> Add Smarty Support Update/Fixes if this does not work by default Check you have the Smarty Editor selected as default for *tpl file in File Association in Preferences -> Ceneral -> Editors -> File Associations If after restarting Zend Studio you may find that the .tpl file type is locked. The only option I found was to remove the .tpl directly from the plugin PDT.  Firstly close Zend Studio to edit the core files:Go to the plugins folder where Zend Studio is installed (Mine was C:\\Program Files\Zend\Zend Studio - 8.0.0\plugins File the file org.eclipse.php.core_2.2.1.vxxxxxxxx-xxxx.jar - the exact version of the plugin may change with updates to the PDT You can infact open this file as a normal archieve file just like a .zip file. Right click a select open with is this does not open by default, if this does not work try renaming the file extension. Extract all the file and edit the the plugin.xml file Search for "tpl", this was line number 53 and remove "tpl" from the list


  • FREE Search Engine Optimisation Tips

    Author: Ben Johnson

    Tags: , , ,

    The following steps will help your Google search rankings:-------- Create Quality ContentThis is the most important one; make sure you have good, original content that people will want to read.-------- Create a Lot of ContentThe more pages, the better. This can easily be achieved by creating your own pages with lots of content. -------- Keep Content FreshKeep updating the site regularly. -------- Remove DuplicatesDo not create pages with the same, or almost same, content. The CMS will ensure that no two pages have the same name or URL-------- Versatile, Precise WordingAlternate the wording for repeated phrases if you like to target them in web searches.-------- Focus on Important KeywordsImagine your audience and what keywords they might enter in a search, and use those words.-------- Create Valid HTMLEach HTML version can be validate, obviously Web2Works only develops to the highest strict standards. You can validate your website for free here:W3C Validatorhttp://validator.w3.org/Link Checkerhttp://validator.w3.org/checklink-------- Create Structured HTMLUse headings and other phrase mark-up (h1, h2, em, strong). These are HTML code that wraps around each different sections of text, each element represents importance of the page, allowing search engines to easily find the correct content.-------- Provide text-alternativesWhen including images, especially those containing text, provide a text-alternative via the "alt"-attribute.-------- Use Meaningful Meta-DataEvery page should have a unique title. You might also want to add meta-keywords and a meta-description. Although this was abused in the early days of the Internet and most modern Search Engines will ignore them completley. Although if you have the time I would recommend entering as much content as possible to the page. One day the Google of the future may change their ways to reading the meta data. -------- Get a Reliable, Robust, Fast ServerGet your website on a proper server shared with a few websites not thousands with the cheap hosts.-------- Create Meaningful File-namesDon't abbreviate file and folder names, but instead use the full keywords which are important for that page.-------- Add Your URL to Search EnginesUse services like following:Google's Add URL://www.google.com/addurl.html-------- Communicate Your Site to OthersWrite to other people who you think might be interested and tell them about your site (but do not rely on spamming newsgroups).-------- Test Your Ranking and Fine-tuneCheck how Google reacts now that you've done the changes.


  • Difference between Web Accessibility & Usability

    Author: Ben Johnson

    Tags: , ,

    Both Website Accessibility and Usability are often misused and confused. Usability is a measure of how easy it is to use a site, while accessibility relates to whether the site can be accessed by everybody. Website Usability: Is a measure of how easy a system is to use and can be applied to any interaction between a user and the website. Usability is made up of several key factors: Ease of learning - how steep the learning curve is. Efficiency of use - how quickly a user can perform a task on a website, may be finding a certain piece of information, using the navigation menu and many other tasks depending on the website. Ease of memorisation - how simple (or difficult) it is to remember how to perform a particular task. Error trapping - ensuring errors are prevented by informing the user how to use the website before errors occur. When they do occur the user experience is not completely broken by providing feedback to the user why the error has accrued. Satisfaction - a user is able to perform a given task on a site satisfactorily. Website Accessibility: Allows for equal access to all users regardless of technological device and physical means. This ranges from people with mobile phones, screen readers and monitor size. Accessibility can even cover how accessible your website is for users with slow connections. A blind user will use a screen reader, whilst a businessman uses a mobile phone and granny turns her font size up, accessibility is about ensuring your site can be accessed equally in all these scenarios


  • A good example of how to over comment PHP code

    Opencart header navtion - Three levels deep http://www.shahz.net/web-development/open-cart-header-navigation-three-level-list.html


  • jQuery Default Input Text - placeholder HTML5

    Author: Ben Johnson

    Tags:

    jQuery plugin to provide a backwards compatible default input text fully browser compatible using JavaScript. // Input Clear Default    $('input[placeholder],textarea[placeholder]').each(function() {        if($(this).val() === '') {            $(this).val($(this).attr('placeholder'));            }        $(this).focus(function() {            if($(this).val() == $(this).attr('placeholder')) {                $(this).val('');                }        });        $(this).blur(function() {            if($(this).val() === '') {                $(this).val($(this).attr('placeholder'));                }        });    });


  • jQuery Select Option:Selected

    Author: Ben Johnson

    A really simple Options selected fully cross browser that even works in IE6. jQuery Select Option $('select').change(function () {     $(this).find('option').removeClass("selected");     $(this).find('option:selected').addClass("selected");});



1 2 3 4