Archive for the ‘HTML Guides (PHP’ Category

Geany PHP Beautifier

Saturday, August 16th, 2014

PHP Beautifier Support for Geany

Geany is by far one of the best text editors I have come across that works on both Windows and Linux.  It is also one of the most aesthetically pleasing editors to look at right out of the box.  I do a lot of PHP scripting, and as such, it is nice to have a "beautifier" script that will automatically format my code for me so that it looks nice.  Geany can also call the php executable and check your script syntax. You can achieve both of these features by installing both PHP for Windows and the PHP Beautifier PEAR addon.   

Install PHP for Windows:

If you code your PHP scripts in Windows, you'll want to use syntax checking and the PHP_Beautifier script.  To do so, you must install the PHP5 Windows package, which includes the main PHP binaries.

To get the files, download the latest version of PHP 5.3.

Extract the contents of the archive to "C:\php5"

Go into C:\php5 and rename "php.ini-development" to "php.ini".

PHP BEAUTIFIER WILL NOT WORK ON ANY NEW VERSION OF PHP FROM 5.4.X and UP!

Install PEAR for Windows:

PHP_Beautifier relies on PEAR functionality.  To install pear, save this file using a browser and place it in the "C:\php5" directory.  

Start command prompt, change directory into "C:\php5", and run the phar script:

C:\
cd C:\php5
php go-pear.phar

Install everything and keep default options.

Install PHP_Beautifier:

Now, install PHP Beautifier by running the following commands:

pear install PHP_Beautifier

Integration in Geany:

For PHP Syntax Checking:

In Geany, click on "Edit" in the menu bar and choose "Preferences".

In the "General" and "Startup" tabs, under the "Paths" section, paste "C:\php5" (without the quotes) into the "Extra plugin path:" field.

For PHP Beautifier:

Start the Geany text editor program.  Open a PHP script file.

Select the code you want to format, right click on the selected text, and choose "Format" –> "Send Selection to" –> "Set Custom Commands".

For command, use the following:

php C:\\php5\\php_beautifier -s4 -l "ArrayNested() NewLines(before=T_COMMENT:for:switch:foreach:T_CLASS:function:T_CLOSE_TAG,after=T_ENDIF:T_CLOSE_TAG:T_OPEN_TAG:T_ENDSWITCH:T_ENDWHILE:T_ENDFOR:T_ENDFOREACH)"

For "Label", use "PHP Beautifier"

Hit OK.

Now, select the code you want to format, right click on the selected text, and choose "Format" –> "Send Selection to" –> and pick "PHP Beautifier".  The code should now be formatted using the options specified in the command line arguments above.

For more filter options and commandline parameters, please read this PHP_Beautifier document.

 

Multiple Comment Forms on WordPress Page – Using WYSIWYG Editor NicEdit

Tuesday, January 28th, 2014

WYSIWYG WordPress Comments

I tried and tried to get the CKEditor plugin for WordPress to initalize multiple comment textareas for a custom post type I had created using the pods WordPress plugin.  No matter how hard I tried, I failed.  Only the first instance would get initialized.  I dug through the code and found where the instance was created, but even with the code in front of my eyes, I could not figure out how to adapt the messy PHP / Javascript mesh to do what I wanted.

Eventually, I came accross a great guide explaining how to use NicEdit, a simple WYSIWYG editor that can be used easily to replace the boring WordPress comment box with something more friendly for end users leaving comments.

Following this guide, I downloaded and uploaded the NicEdit files to a folder named "scripts" in my theme's directory (please adjust the path in the functions below if you want to use another directory or place the files elsewhere).  I would recommend downloading the non-compressed version, as the code is easier to read and making changes is a lot easier.  I inserted the following function into my WordPress theme's functions.php file:

function add_nicEdit() {
    if ( !is_admin() ) {
        // register scripts
        wp_register_script('nicEdit', get_stylesheet_directory_uri() . '/scripts/nicEdit.js', array(), false, true);
 
        // enqueue scripts
        wp_enqueue_script('nicEdit');
    }
}
 
add_action('wp_enqueue_scripts', 'add_nicEdit');

Then, I created a new function that I added to NicEdit.js file.  After this code:

allTextAreas : function(nicOptions) {
        var textareas = document.getElementsByTagName("textarea");
        for(var i=0;i<textareas.length;i++) {
            nicEditors.editors.push(new nicEditor(nicOptions).panelInstance(textareas[i]));
        }
        return nicEditors.editors;
    },

I added a function called allCommentTextAreas:

allCommentTextAreas : function(nicOptions) {
        var textareas = document.getElementsByTagName("textarea");
        for(var i=0;i<textareas.length;i++) {
      if(textareas[i].className == "comment_editor"){
               nicEditors.editors.push(new nicEditor(nicOptions).panelInstance(textareas[i]));
      }
        }
        return nicEditors.editors;
    },

The way this function works is that it will replace all textareas that have a class of "comment_editor" only.

Next, in my theme's footer.php file after the <?php wp_footer(); ?> line, I added the following:

<script type="text/javascript">
           // We need to initialize the WYSIWIG editor for the comments field                   bkLib.onDomLoaded(function() { nicEditors.allCommentTextAreas({
                   iconsPath : '<?php bloginfo( 'stylesheet_directory' ) ?>/scripts/nicEditorIcons.gif', buttonList : ['bold','italic','strikethrough','link','unlink','removeformat']})
                   });
        </script>

In your pods page template, load comments like this:

$args["comment_notes_after"] = "";
$args["comment_field"] = '<p class="comment-form-comment"><label for="comment">' . _x( 'Comment', 'noun' ) .          
'</label><textarea id="comment" class="comment_editor" name="comment" cols="45" rows="8" aria-required="true">' .          
'</textarea></p>';
comment_form( $args, $post_id ); 

Your comments form will now look a lot better, specifically, they will look like this:

nic edit