Blog

  • WordPress Sidebar Stats Widget

    I wrote a WordPress plugin that displays a small collection of site stats in a sidebar widget. Here is a screen shot of sample output:

    sidebar-stats-widget

    Widget options screen shot

    The widget includes a control panel to change the title and format the HTML that is inserted before and after each numerical stat.

    sidebar-stats-widget-options

    Installation Instructions

    1. Download sidebar-stats-widget.zip
    2. Decompress the file contents
    3. Upload the sidebar-stats-widget folder to a WordPress plugins directory (/wp-content/plugins)
    4. Activate the plugin from the Administration Dashboard
    5. Open the Widgets page under the Appearance section
    6. Drag the Sidebar Stats Widget to the active sidebar
    7. Configure the widget options to suit your needs and click Save

    WordPress.org plugin page

    This plugin is in the official WordPress Plugin Directory here.

  • Clear default text from input boxes using Javascript

    Providing labels is a great way to help users interact with your website properly. I like to put instructional text inside text boxes to save space. Users get annoyed when the text inside the box they click on does not disappear when they are ready to type. Users do not want to backspace default instructional text before typing in boxes, so some code is required to make this happen.

    I would like to share two small Javascript functions. The first clears out default text box contents automatically when a user clicks on the box. The second restores the default instructional text if the user leaves the box empty.

    Implement these functions using onfocus=”wash(this);” and onblur=”checkWash(this);” on your text input control. You may want to avoid the second function on text fields where input is optional, so the user can leave the text box blank.

    function wash( anInput ){
    if(anInput.value == anInput.defaultValue) anInput.value = '';
    }

    function checkWash( anInput ){
    if(anInput.value == '') anInput.value = anInput.defaultValue;
    }

    Try it

    Look, I made a demo!