In the prior blog entry I talked about moving my domain for email over to GMail. Hosting my website at Dreamhost makes this simple.  I configured Gmail to allow POP access and changed my settings in Entourage to use the Gmail POP and SMTP settings.  It all seemed to work fine, except I notice that not all the emails were being downloaded.  When I checked my Gmail Inbox using a browser, I found messages there that did not download.

It was difficult to find out what was going on.  It seems that unlike most POP clients, with Gmail when any device downloads using POP, it marks the message as downloaded and then when another device tries to download the message, it does not download.  I had my iPhone setup for POP access, as well as using an app in MyYahoo to see the messages.  I view this to be a issue with Gmail that should have been fixed since all other POP clients can tell if a different device is attempting a download.

So how to fix?  I found this information: http://mail.google.com/support/bin/answer.py?hl=en&answer=47948

Basically you setup the mail client by adding “recent” in front of the username, as in “recent:name@gmail.com”.  You have to also leave a copy on the server, but that is true for all POP clients if you want to download to multiple devices.

When I added the “recent:” in front of my user name, I was able to get a bunch of messages.  I have to see how this works and see if I get multiple messages in my Inbox.

Categories: Web Development
No Comments »

If you host your domain, you can use Google Apps using your own domain name, including using their gmail application.   If you use Dreamhost the steps are different and much simplified.  Be sure to setup the new email accounts in Google BEFORE you change tell Dreamhost to make the chagne, or you change the MX Records or you will lose emails.  Google provide excellent help on how to do all this, including videos.  However these don’t take into account what Dreamhost is doing for you so I have written these notes.

1. Sign up and sign in.

Dreamhost: If you are using Dreamhost to host your domain, go to your Dreamhost control plane and select Domain/Manage Domain.  Select to edit the domain.  Towards the bottom look for Google Hosted and click the link “register at Google Apps for your Domain”.  Do NOT try to have Google host yet since your email will be routed to Google and you have not yet setup user accounts.

Other: If you are not using a hosting company that provides the support, from the Google Apps home page, click ‘Compare Editions and Sign Up’ to get started and access to the control panel.  For most everyone the free Standard Edition would provide all that is needed.  You might wish to pay for the Premier Edition if you need more disk space, need to migrate your old email over or want 24/7 support.  After you make your selection on which plan, then enter your domain name.  Be sure to check that you are an administrator.  Learn more

2. Verify domain ownership.

Dreamhost: For one domain I setup I did not need to verify.  It seemed that once I clicked in the Dreamhost control panel to switch over to Google mail, verification worked.  For another domain I had to follow the steps below.  I choose to create a HTML file and upload to the domain.  It might be that for this second domain I had a WordPress blog setup on it instead of a website, as was the case for the first domain I switched over.  Once I had it verify using the HTML file I uploaded it said it woudl take up to 48 hours to verify domain ownership, however it worked in a matter of minutes.

Other: Otherwise go sign in and go to the dash boarad and then confirm that you own the domain you signed up with to activate Google Apps.  If you did not purchase your domain from Google, you will need to verify you are the owner.  This requires you to ypload a special file to your site and then create a special CNAME record for your domain. Learn more

3. Customize Google Apps.

This is the same if you use Dreamhost or not.  Google Apps lets you easily modify a variety of settings that apply to your entire organization.  Learn more

4. Create User Accounts.

This is the same if you use Dreamhost or not.  From the Google  control panel, create your user accounts accounts to match the users email accounts you already have setup.  Do this BEFORE you change the MX records in the next step.  You can bulk upload a list of user accounts if you wish.  Learn more

5. Turn on Email.

Dreamhost: If you are using Dreamhost, go to the Dreamhost control panel there and select Domains/Manage Domains.  Select Edit for the domain you are hosting and click “Google Host this domain now”. Dreamhost will re-route your email rather than you needing to change the MX records for that domain.  Then go to the control panel in Google Apps and activate email.  Although I did not actually change the MX records, I had to tell the google control panel that I had.

Other: If you are not using Dreamhost, to receive your email at Google, you need to modify the MX record for your domain.  You do this at the company where you have your domain registered.  Once you make the change, your email will not longer be routed where it was previously sent.  If you wish to check things out before you change the MX record, you can use a temporary email address to send to using this format: user.name@your_domain.com.test-google-a.com. You can use the webmail function in Gmail to send out an email directly.  Learn more

6.  Migrate Email.

If you use Micosoft Windows, Google offers a tool to migrate your existing email from some applications, such as Outlook, to your new Google Inbox. For Mac users, I did find one commercial program.  I also found one approach but have not tested it:

• Using Thunderbird connect to your old email account through IMAP,
• Do the same with your new Gmail account. You need to have Imap activated in Gmail in order to access it from Thunderbird. .
• Copy email from each folder of your old accout to gmail.

If you are going to continue to use POP access it is not really important since you will use your email client to retrieve your new email and it will go into the same inbox as before.  If you wish to switch to IMAP, then prior emails will not be online, but that will be an issue of less importance as time moves on.

Categories: Web Development
No Comments »

So cool! There is a new app for the iPhone that allows me to write or edit a posting to a Wordpress blog. I am using it for this entry.

Too bad it does not yet support images from the iPhone camera

Categories: Blogging, Gadgets
No Comments »

A friend showed me how to install some files on my own web server that can be used to do a speed test, which I have done. I have installed on my server so you can test it out. The image below is a screen shot of what it looks like when running. Click the link below to actually run the test.

RUN SPEED TEST

The necessary files and instructions to setup this on your own server can be found at http://www.speedtest/mini.php. There are versions written in PHP, ASP.NET or ASP.

You can also test your speed at their main site by clicking the button below.

Categories: Web Development
No Comments »

I have mostly relied on the tools offered in WordPress to create and edit my blog postings but I have always wanted more. Since I have Adobe Creative Suite 3, I also have a copy of Adobe Contribute, which allows you to do direct editing of websites and blogs. Although this software has some nice features, such as the ability to insert tables, I have found using it to be rather annoying. If I try to edit an existing post, all the paragraphs are run together. It just seems to do havoc to the html code in the existing post.

I did stumble upon a neat plugin for FireFox, called ScribeFox. By clicking on the icon in the tool bar, I get a split screen, with the upper part of the FireFox window showing the blog and the lower one where I can create or edit a post. See below for what the input screen looks like. I did find there were no easy tools for setting the image attributes, such as the size. This software may not have all the bells and wistles but it is an elegant and straightforward approach to creating and editing blog entires. Also when I go back and use the built in tools in WordPress, I don’t get a scrambled mess like I do with Adobe Contribute.

Categories: Blogging
No Comments »

Setting up a WordPress blog is an easy way to do frequent posts, much easier than using a web development tool and uploading the files. One issue that causes some problems is the image size with prior postings.  Although this seems to be addressed with version 2.51 of WordPress you may have a lot of postings with a prior version that don’t contain the needed code to resize the image to fit within the blog column.

To fix those you have two choices. You can either resize the image before you upload so the width is around 450 pixels (this should work with most themes), or you can set the image size in the html code so the image is resized properly.

Some themes, such as the WordPress default theme, do a pretty good job of resizing of image but when you switch to a different them, you may see that larger image spills over. To fix it without the need to set the display size for each image if it is too wide. Here are the simple steps.

• Edit the post
• Select the Image
• Select the button to insert/edit an image
• Set the width to something like 450 (I use 470 on some themes)
• Leave the height measurement blank
• Change the Alignment if you want.
• Click Update

This basically will write the html code for the image size. If you leave the height measurement blank, most modern browsers will resize the image proportionally to fit the width you set. If you enter both the width and height measurement be sure to keep them proportional with the original image.

For some images you will want to upload a size larger than what will fit within the selected WordPress theme so that when the viewer clicks on it, then see a larger size.  Since I am making this post using version 2.51 of WordPress when I insert the image below, which is much wider than 450, and select to insert the full size, the WordPress editor automatically set the size for me with a witdh of 499 so  I don’t need to manually change it.  When someone clicks on the image, they can view the real full size.

Categories: Web Development
No Comments »

I was listing to a Security Now pod cast on the long drive home. The topic was SQL injection threats. It was the first time I heard about it but it is cleariy something I need to consider on our webpages that take user input.

Basically what it is that a portion of a SQL statement is used for user input. A simple example would be a log in form that askes for a user name and password. Let’s say that those two fields are used to see if there is a matching recording in a login MySQL database. The SQL statment might be something like this using a form input:

Here is a sample basic HTML form with two inputs, login and password.

<form method=”post” action=”http://mywebiste.com/login.php”>
<input name=”UserName” type=”text” id=”UserName”>
<input name=”UserPass” type=”password” id=”UserPass”>
</form>

If for the user name they enter “Bill” and for the password something like this: ‘anything’ OR ‘x’='x’

The SQL statement might make this check

SELECT FROM * WHERE UserName=Bill AND UserPass = anything OR ‘x’='x’;

By using a SQL command in the data filed the query is changed in a way never expected.

On some SQL servers such as MS SQL Server any valid SQL command may be injected via this method, including the execution of multiple statements. The following value of “UserName” in the statement below would cause the deletion of the “users” table as well as the selection of all data from the “data” table (in essence revealing the information of every user):

a‘;DROP TABLE users; SELECT * FROM data WHERE name LIKE ‘;

There is no patch on a MySQL database or any firewall that will stop this type of attach. What is needed is a check of the data. I will write more about that after dong some additional research.

Categories: Web Development
No Comments »

In the prior entry I discussed using an include() PHP command to use a single instance of the Spry horizontal menu on all webpages.

In addition I have switched to using Cascading Style Sheets exclusively. One item that was causing me a big of a problem was that I had one column heading style set as white on dark blue. If I tried to make that a link, it would change to the link color. The answer was to create a new style called “white”

a.white:visited {
color: #FFFFFF;
}

The when I create a column heading that is also a link I apply the style “white” and the one for the column heading as follows:

<td bgcolor=”#26354A”><div align=”center”><a class=”white” href=”http://www.sports.franzkelsch.com”><span class=”colHeading”>Introduction</span></a></div></td>

The link has both the style “white” and “colHeading”.

The later set the color for the white text on dark blue and the style “white” overrides the setting I have for the a:link style.

This file will show you what it looks like.

http://www.franzkelsch.com

The column headings are white on dark blue but are still a click-able link.

Categories: Web Development
No Comments »

For my websites I have been using the Spry Horizontal menu system. Although this makes it easy to add in menu items and links, as with any menu system, if it is in every webpage that becomes a burden if you should need to make a change to a single menu item. That would require making the same change on every page.

I also wanted to have a separate image header at to top of the webpage that changes with the section I am in.

I accomplished both things by using this approach. For reference go to the website http://www.ultracycle.net

In the main folder I have these files

1. index.php
2. header.php
3. header.jpg
4. footer.php

The header.php is the file that contains the HTML code for the image at the top of the page (using a relative address) and all the code needed for the Spry Menu. The header.php file has no <HEAD> tag, just the lines of HTML that are needed. I started with a full page with the <html> <head> and <body> tags, and started to delete all lines of code that were not clearly needed and I ended up with header.php.

The index.php file uses an include command as follows:

include (”header.php”)

The header.php file already has a link to the local header.jpg file. I use a similar approach to include the footer.php file.

For each section I created a separate folder. One is called “train” for long distance cycling training webpages.

In there are these files.

1. header.jpg
2. index.php
3. individual pages, all php files.

The index.php (and the other files there) all use the same include command but in this case it is:

include (”../header.php”)

and

include (”../footer.php”)

Not that this header.php will use the jpg file found in /train/header.jpg since in that file I use no relative reference. So when I run the file \train\index.php it accesses the header.php file in the root, which uses the local JPG file, and then of course has the body of what desired for that page. It also uses the footer.php file.

The index file looks like this:

<html>
– usual stuff here
<head>
– usual stuff here
</head>
<body bgcolor=”#64748B”>
<?
php
include (”../header.php”) ;
?>
—- then the code for the page —-
include (”/footer.php”)
</body>
</html>

By using this approach I only need to change the content that is unique to that page, which goes between the include for the header.php file and the include for the footer.php file.

I believe this approach will make it much easier to create new content and keep existing content up to date. To create a new page I have a template that has the includes to the header.php and footer.php file and a table in between the two. I just paste the new content on table. It will use the appropriate JPG header image, depending on which folder it is placed in. By using this approach I have reduced the create of new webpages to be only content that is unique to that page and yet when the page is viewed in the browser it has the header image, the Spry menu, and the footer images and links.

This file will show you what it looks like.

http://www.ultracycle.net/monitor/hrm.php You will see different header image than if you go to the main index page at:

http://www.ultracycle.net And yet both pages are using the same header.php file included in the code.

I plan to use this approach on other websites. It takes a bit of work up front but saves a lot of time going forward.

Categories: Web Development
No Comments »

The superiority of the Mac operating system continues to impress me. Having been a long term user of Windows, back from version 1.0, I have all but abandoned it for the Mac. I have used my Mac Book Pro for over one year now and have no intention to return to Windows. I do website programing in PHP and wanted to install PHP locally so I can do testing without the need to FTP files to the web server. I found out that Mac OS X 10.5 (Leopard) comes with both Apache 2.2.6 and PHP 5.2.4 pre-installed, but they’re not enabled by default. I found these instructions from Foundation PHP on how to get it up and running.

The first step was to download the free text editor TextWrangler (a free, cut-down version of BBEdit available from www.barebones.com). Using this editor I made one change in a single file. Next the instructions required use of the terminal to copy the php.ini default file, then I could use TextWrangler to edit it with a single change. In the Mac system prefrences I then enabled web services and was done. I created a test PHP file and ran it in the browser as follows to verify both Apache and PHP were working.

http://localhost/test.php .

The PHP information page came with this header.

The instructions were easy to follow. At this same site are some other tutorials. I plan to buy the book written by the author of this site called “The Essential Guide to Dreamweaver CS3 with CSS, Ajax, and PHP” because the author shows how to use an include for the Spry horizontal menu. One issue we have in a complex website is how to have one source for the menu system so changes made in one place will appear on all pages.

Categories: Web Development
No Comments »