Information for designers and interactive developers - Issue 3 - September 2008
home  |  articles  |  register for the newsletter  |  Issue 1  |  Issue 2  |  Issue 4  |  Issue 5  |  Issue 6
Introducing PHP Support in Expression Web 2
by Nishant Kothary & Tyler Simpson
PHP (PHP: Hypertext Preprocessor) is one of the most popular server-side scripting languages on the Internet today. It is cross-platform, runs on most popular web servers, and it's free. Expression Web 2 includes a powerful set of features for PHP developers. In this article, we will provide a brief summary of the PHP features available in Expression Web 2 to get you up and running. We encourage you to examine PHP in greater depth by exploring examples and tutorials published all over the Internet by the vast PHP community.

What you will need:
  • Expression Web 2 - Try or Purchase
  • PHP 5.2.5 (for the development server) - Download
A Quick Overview
In response to feedback from Expression Web 1 users, we've added a rich set of features for PHP development in Expression Web version 2. There are the expected productivity features such as code-coloring, snippets and IntelliSenseT, but it doesn't stop there. The product now ships with a PHP development server that lets you test your PHP pages without any other external web server dependencies (e.g. IIS or Apache). Essentially, PHP is now a first-class citizen in Expression Web 2, and will continue to be in upcoming versions of the product.

In a nutshell, the features that we'll cover in this article are:
  • PHP Snippets
  • Byte-order Mark (BOM) Enhancements
  • Design View Integration
  • Code Coloring
  • IntelliSenseT
  • PHP Development Server
So, let's get started.

PHP Snippets
You can insert the most common PHP functions, superglobals, language constructs and control structures by using PHP snippets. Select Insert > PHP to access the snippets. They are logically organized into three groups.



Pre-Defined Variables
  • Form Variable
    Form variables are used to collect values from a form using the HTTP POST method in an invisible manner. Form variables may be accessed by using the $_POST[] superglobal (a variable available in all scopes throughout a script). Selecting this option inserts the code
    <?php $_POST[];?>
  • URL Variable
    URL variables are used to collect values from a form using the HTTP GET method; they are passed through the browser's address bar and are visible to the world. URL variables may be accessed by using the $_GET[] superglobal. Selecting this option inserts the code
    <?php $_GET[];?>
  • Session Variable
    Session variables allow you to temporarily serve user information, e.g. username, shopping cart, etc., on the server for later use. Session variables may be stored and retrieved by using the $_SESSION[] superglobal. Selecting this option inserts the code
    <?php $_SESSION[];?>
  • Cookie Variable
    Cookies allow you to save data on a user's hard drive, e.g. username, preferences, etc., that may be retrieved the next time they come to the site. Cookie variables may be retrieved by using the $_COOKIE[] superglobal. Selecting this option inserts the code
    <?php $_COOKIE[];?>
Server Side Includes
  • Include
    The include() function allows you to insert the contents of a file into a PHP script before the server executes it. Selecting this option brings up a dialog that lets you choose the file that you'd like to insert, and then inserts the code <?php include('myfile.php');?>, where myfile.php is the file you selected.
  • Include_Once
    The include_once() function is identical to the include function except it ensures that if the target file has already been included, then it won't include it again. Selecting this option brings up a dialog that lets you choose the file that you'd like to insert, and then inserts the code <?php include_once('myfile.php');?>, where myfile.php is the file you selected.
  • Require
    The require() function is identical to the include() function except in how it handles errors. If an include() function fails for some reason, it generates a warning and executes the rest of the script. The require() function generates a fatal error resulting in termination of script execution at that point. Selecting this option brings up a dialog that lets you choose the file that you'd like to insert, and then inserts the code <?php require_once('myfile.php');?>, where myfile.php is the file you selected.
  • Require_Once
    The require_once() function is identical to the require() function except it ensures that if the target file has already been included, then it won't include it again. Much like the require() function, require_once() will terminate script execution upon failure. Selecting this option brings up a dialog that lets you choose the file that you'd like to insert, and then inserts the code <?php require_once('myfile.php');?>, where myfile.php is the file you selected.
Commonly Used Code
  • Code Block
    Selecting this option inserts an empty PHP code block as follows
    <?php?>.
  • Echo
    Echo is a PHP language construct that outputs one or more strings. Selecting this option inserts an empty echo statement as follows
    <?php echo?>.
  • Comment
    Selecting this option inserts an empty comment block as follows
    /* */.
  • If
    Selecting this option inserts an empty if control structure as follows
    <?php if>.
  • Else
    Selecting this option inserts and empty else control structure as follows
    <?php else>.
Byte-Order Mark (BOM) Enhancements
Expression Web 1 adopted UTF-8 as the default encoding and as a result of this it always added a Byte Order Mark, more commonly referred to as a BOM when saving XHTML pages. A Byte Order Mark is a signal used to identify the encoding of a file. The problem with this approach is that some web servers - in particular, servers processing PHP documents - do not correctly handle the BOM. In Expression Web 2, we've added features giving users complete control over BOM settings and configuration. Also, by, by default, the BOM is turned off for new PHP pages.

Select Tools > Page Editor Options. > Authoring to access the default global setting that allow you to configure which file extensions will include a BOM when Expression Web creates new files.

To configure the BOM in the scope of a single page, right click on a document opened in Expression Web 2 and select the Encoding. menu option. This will pop up the Page Properties dialog where you can enable or disable the BOM for any given document.


Design View Integration

Server Side Includes are files generally containing commonly used code (functions, libraries, etc.) that may be reused throughout your site. They are very powerful and commonly used in PHP through the include(), include_once(), require(), and require_once() functions.

Expression Web 2 has a very subtle but powerful feature that will render them in the design view as if the code were all in one file (for practical purposes, that's really the intention of an include). Consider a common scenario where you take the common header code for your site and put it in its own file header.php, and then you include this code in all the pages of your site that display the header.

Code Coloring

Expression Web 2 provides a default scheme to color code PHP language constructs, and also allows you to customize this scheme for most types of display items. For PHP, specifically, you have the ability to customize comments, functions, identifiers, keywords, numbers, operators and other items (e.g. variables).

Select Tools > Page Editor Options. > Coloring Code to customize the default code coloring scheme.

IntellisenseT
IntelliSenseT is Microsoft's version of auto-completion. It's an extremely convenient way to write code faster and access descriptions of functions such as parameter lists. Auto-completion is a standard feature of any IDE worth its salt, and Expression Web 2 is no stranger to this feature. With the introduction of IntelliSenseT support for PHP, you get rich support from the code editor to resolve function names, parameter lists, and superglobals. Whether you're coming from Visual Studio or not, you're going to feel right at home with IntelliSenseT because it just works.

Functions and Parameter Lists
You can invoke IntelliSenseT within any PHP code block by hitting CTRL+SPACE. This will bring up the function list for PHP 5.2.5 in alphabetized order.


As you would expect, the list resolves to the closest matching function while you type.



Superglobals
PHP provides a set of predefined arrays containing a few different types of variables such as session variables, environment variables, server variables, form variables, URL variables, and so on (for a full list, check out the PHP documentation). These arrays are commonly referred to as Superglobals because they are automatically set to global, i.e. they are available to any script and within any scope of a script.

You can invoke IntelliSenseT for superglobals by typing $_ within any PHP code block. This will bring up a list of available superglobals.



As you would expect, picking one of these, e.g. $_SERVER, gives you the next level of detail by letting you pick from the many pre-defined variables.



IntellisenseT Options
You may customize IntelliSenseT similar to how you can customize the Code Coloring scheme. Simply select Tools > Page Editor Options. > IntelliSense to access options to toggle various aspects of IntelliSenseT.



PHP Development Server
We definitely saved the best feature for last. Expression Web 1 allowed you to test your ASP.NET pages out of the box through the ASP.NET Development Server. Expression Web 2 gives you the same capability for PHP pages. What this means in layman's terms is that you don't need to upload your PHP script to your web server and then hit it through a web browser every time you want to test a change. In fact, you don't even need to set up a web server, e.g. IIS or Apache, on your development machine. All you need to do is download and unpack the PHP runtime and point Expression Web 2 at it (don't worry, we'll tell you exactly how) and you're ready to go.

Here's how you set it all up:
Step 1: Download and Extract the PHP 5.2.5 Runtime
Under the Windows Binaries section, download the PHP 5.2.5 zip package file from www.php.net/downloads.php and save the file to your computer.



Next, extract the zipped files to C:\PHP (or any directory of your choosing).



Step 2: Configure PHP Runtime
Open the PHP folder. Locate the file named "php.ini-recommended" and rename it to "php.ini". We need to make two quick configuration changes to this file, so go ahead and open it up in Notepad.

While we're working with php.ini configuration file, let's update two quick configuration settings. On first launch of the Expression Development Server, Expression Web 2 will ask if you want it to update these settings.
  • Displaying Errors
    Search for "display_errors = Off" (use the "Find" feature in Notepad) and replace the "Off" with "On". This ensures that the Expression Development Server will display errors coming from the php-cgi.exe runtime engine and will be extremely helpful when you debug your PHP scripts.



  • Turning Off Forced Redirects Search for "cgi.force_redirect = 1" as you did above. You'll notice that this is commented out, i.e. it has a semi-colon in front of it. Remove this semi-colon and change '1' to '0'. The other setting a setting to turn off forced redirects.



    Now go ahead and save php.ini and close it.
Step 3: Expression Web 2 Configuration
Now that the PHP runtime engine is installed and configured, we need to point Expression Web 2 to the php-cgi engine. You have two powerful options to pick from:

Option 1: Global Setting
Pick this option if you want to configure a global setting that will be used to preview PHP documents across any site in Expression Web 2. In other words, this setting will use the PHP runtime you just installed and configured for all your web sites.
  • Select Tools > Application Options. > General.
  • At the bottom of the General tab, there's a field that reads "Path to PHP executable for previewing PHP page".
  • Browse to and select C:\PHP\php-cgi.exe.


Option 2: Local Setting
Pick this option if you want to configure a local setting that will be used to preview PHP documents at an individual web site level. In other words, this setting will use the PHP runtime you just installed and configured for one particular web site. This allows you to install and configure multiple runtimes for separate sites (say you are using a prior version of PHP for one of your clients).
  • Select Site > Site Settings... > Preview. (Note: you will need to have a web site opened in Expression Web 2 before having access to Site Settings)
  • By default, the product will have the "Use Microsoft Expression Development Server" option selected and enabled for PHP and ASP.NET page.
  • If you installed PHP in a different location, or if the text box under the Path to PHP executable for previewing PHP pages in this website setting is empty, click Browse, locate and select php-cgi.exe, and then click OK.


Step 4: Preview in Browser!
Now that we have the PHP 5.2.5 runtime and the Expression Development Server configured to preview documents, we need to quickly test it. If you do not already have a web site open, first do so. While in Expression Web 2, create a new PHP document and in Code View write a line of code that will echo out the PHP runtime settings. You can quickly do this with the following line of code:
<?php echo phpinfo();?>



To preview documents in a browser in Expression Web 2, you can simply hit F12 or select File > Preview in Browser and select a browser. Once you do this, you'll see the Expression Development Server process start up and display a bubble in your task pane.



You should see the PHP test document we just wrote rendered through the Expression Development Server and display PHP Version 5.2.5 configuration settings. .

Conclusion
With the addition of this rich set of PHP features, we now have a solid foundation for building PHP applications in Expression Web 2. Features like IntelliSenseT, code coloring and the PHP Development Server take the guesswork out of development and add a tremendous amount of productivity to the development process. PHP is undeniably a first-class citizen in Expression Web 2 and we don't see that changing in the future. We hope you found this article informative, and look forward to your feedback.
50 screencasts on Silverlight
If you need some material to start learning Silverlight 2, check out this set of 50 short screencasts delivered by Mike Taulty and Mike Ormond, two evangelists from the UK.
Download a free trial of Expression Studio 2
Download a trial of the new Expression Studio. New features in Blend 2: Silverlight support, vertex animations and an improved user interface with a new split design/XAML view. Expression Web 2: now with PHP support, Photoshop import functionality, improved web standards compliancy, and ASP.NET Ajax server control support and more.
Laguna Coupé with Silverlight and Deep Zoom
Enjoy a Silverlight & DeepZoom experience with the Laguna Coupé microsite, from Renault.

Popfly Game Creator
Maybe you already know Popfly, the platform for building gadgets, mashups and web pages all in a visual way without any coding. Now there is a new feature launched: check out Popfly Game Creator, and build your own game without writing any line of code. Have fun!
Microsoft