30 June 2009

Add the jquery library to your php zend website

Today we are going to look at how to add the jquery library to your website in the Zend Framework.

Firstly you need to download the jquery library here.

At the time of this writing the current release is v1.3.2 and the size is about 55.9KB

Save/move that file to your 'js' folder, .e.g. c:\wamp\www\MyProject\public\js\jquery.1.3.2.min.js

Next step is to add it to your layout. Currently I'm adding my external javascript and stylesheet in my layout page. The common place for this view script is in /MyProject/application/layouts/script/layout.phtml, although I use /MyProject/application/views/layouts/layout.phtml. Whichever you prefer ;)

In the head section of layout.phtml I have this code:

headScript()->prependFile($this->baseUrl() . '/js/jquery-1.3.2.min.js'); ?>
headScript() ?>
I used prependFile instead of appendFile as this is the library and should be loaded first in my opinion.

Now if you save that and preview your page, the source should include something like this:

Now you have the jQuery library attached and ready to use it's commands and associated plugins. More on that in future articles.

Take care!
Tjorriemorrie

29 June 2009

A look at CSS font-families

Font-families are the CSS style that define which font is used on your web pages. Here I quickly look at the fonts which is 'safe' for web development. Fonts are divided into a lot of categories, but for web development there is mainly four categories:
  • sans-serif
  • serif
  • script
  • monospace
For web development, there is mainly 8 safe fonts to use:
  1. Arial (and Arial Black)
  2. Comic Sans MS
  3. Courier New
  4. Georgia
  5. Impact
  6. Times New Roman
  7. Trebuchet MS
  8. Verdana
Now let's catgorise these safe fonts into the categories:
  • sans-serif: Arial (and Arial Black), Impact, Trebuchet MS, Verdana
  • serif: Georgia, Times New Roman
  • script: Comic Sans MS
  • monospace: Courier New
Now to make a family we start by using the most generic font specification. Let's make a sans-serif font-family:
  • Calibri, Verdana, Arial, sans-serif
The font-family is comma separated, meaning if the user doesn't have the left-most font on his computer, the next font in the list will be used. Normally a font-family consists of four fonts. As you can see, I used Calibri as the first choice; it's installed with MS Office 07 and most users will probably have the font installed on their system. If not, it will use Verdana and then Arial, which users will have 99% of the time, otherwise the system can choose any default font it want. And so it's easy to make font-families. Let's make a script one:
  • Lucida Handwriting, Comic Sans MS, script
Last note, remember to try to use sans-serif fonts for body text, as it is by far the easiest to read on a screen. You can be daring with serif, but I don't recommend script fonts. There you go! Tjorriemorrie

26 June 2009

Zend Quickstart Guide

Setting up and using the Zend Framework will definitely be something daunting to the first time user of Zend. And if you moved over from procedural to Object Oriented Programming [OOP] it will also be very confusing. This article covers setting up and running the Quickstart guide from the Zend’s website. Firstly, the Zend Framework is a library you use. Download it here. Secondly, you need to get the quickstart guide as well. That can be downloaded here. Let’s first set up our development environment. What you need to development locally on your machine, is a server, the PHP engine and a database. I’m sure most developers use Apache, MySql and PHP in one package. I use wampserver but there is also a xamp for a Mac. What I like about WampServer is that it installs everything for you and gives a you nice tray icon. Now you need to know where your root folder is. If you installed WampServer it will be c:\wamp\www which is equivalent to http://localhost/ in a browser. PHP files in the root folder will be processed by the server, but files outside of the root folder will not be touched by the server (Apache server using the PHP engine). Now let’s put the framework we downloaded in the root folder, e.g. c:\wamp\www\library\zend\ it should be about 18MB. Then extract the quickstart you downloaded and move that folder to the root as well, e.g. c:\wamp\www\ZendFrameworkQuickstart-20090430. Then open your IDE of choice and add the project directory, i.e. ZendFrameworkQuickstart-20090430, as the project folder. So everything is almost set up, so let’s get started running the application. Open public/index.php and preview the file in your browser. All projects start by running this file. However, you should be getting an Internal Server Error in your browser. That’s because of the .htaccess file in the public folder, which redirects requests. I’ll cover .htaccess in a later post, but for now realize that this rule in the
file: RewriteRule ^.*$ index.php [NC,L]
Makes use of Apache commands/functions. To fix this you need to open your httpd.conf file for Apache. It should be in your Apache folder otherwise search for it. You can open the file the quickest using wampserver’s tray icon and clicking on the filename under the Apache menu. With the file open, you are looking for this line:
LoadModule rewrite_module modules/mod_rewrite.so
There should be an # in front which you need to remove – this will uncomment the line and apache will read and use that command from now on. Restart your server's services. If you refresh the page it will remove the Internal Server Error, however, there should be a new error. The new error should be a PHP warning: Warning: require_once(Zend/Application.php) This is because the index.php file can't find the Zend Framework's library file. If you open the index.php file in the public folder you will see on lines 6-9 the following snippet:
set_include_path(implode(PATH_SEPARATOR, array(
  realpath(dirname(__FILE__) . '/../library'),
  get_include_path(),
)));
What you need to do is change the path to the library, which is one more folder further down. Change it to:
set_include_path(implode(PATH_SEPARATOR, array(
  realpath(dirname(__FILE__) . '/../../library'),
  get_include_path(),
)));
Running that should work. And that's it for this article. I highly recommend reading the quickstart guide on Zend's website. I'll be covering each portion of the set up in detail in future articles.