• /store-locator/view-locations.php
• /store-locator/add-locations.php
• /store-locator/generate-xml.php
• /store-locator/js/store-locator.js

By making additions to these four files as well as the store-locator database, you can add custom form fields to the plugin that actually store data and, of course, display this data to the user!

Step 1: Add custom fields (or “columns”) to the wp_store_locator table

We need to add columns to the table named wp_store_locator in our WordPress database so that our custom info can be stored somewhere. We are going to add our columns after the last column in the table (which should be named sl_neat_title).

So, using phpMyAdmin or any other database administration tool, add your custom columns. For this tutorial, I’m going to add sl_creditcard and sl_giftcard to keep track of which stores allow the use of credit cards or gift cards. Notice that I included the sl_ prefix. This is necessary because the plugin expects every column in the table to have this prefix.

Note: From now on when you see “creditcard” or “giftcard” OR “sl_creditcard” or “sl_giftcard” OR “Credit Card” or “Gift Card” this is where you can insert the names of your custom fields.

Above: Database table wp_store_locator before adding custom fields

Above: Database table wp_store_locator after adding custom fields

Step 2: Modify view-locations.php, and add-locations.php

We need to modify these two files so the custom forms and info show up in the admin panel when the admin tries to add, edit, remove, or view locations.

In add-locations.php we must append our custom form field HTML. Opening the file initially and looking at lines 98 to 100 you will see:

“.__(”Hours”, $text_domain).”<br><input name=’sl_hours’><br><br>
“.__(”Phone”, $text_domain).”<br><input name=’sl_phone’><br><br>
“.__(”Image (shown on map with location)”, $text_domain).”<br><input name=’sl_image’><br><br>

To add form fields for the fields we added to the database (sl_creditcard and sl_giftcard), simply do the following:

“.__(”Hours”, $text_domain).”<br><input name=’sl_hours’><br><br>
“.__(”Phone”, $text_domain).”<br><input name=’sl_phone’><br><br>
“.__(”Credit Card“, $text_domain).”<br><input name=’sl_creditcard‘><br><br>
“.__(”Gift Card“, $text_domain).”<br><input name=’sl_giftcard‘><br><br>
“.__(”Image (shown on map with location)”, $text_domain).”<br><input name=’sl_image’><br><br>

Next, in view-locations.php, we will have to make three additions. First, on lines 153 to 155 find:

<th><a href='".ereg_replace("&o=$_GET[o]&d=$_GET[d]", "", $_SERVER[REQUEST_URI])."&o=sl_hours&d=$d'>".__("Hours", $text_domain)."</th>
<th><a href='".ereg_replace("&o=$_GET[o]&d=$_GET[d]", "", $_SERVER[REQUEST_URI])."&o=sl_phone&d=$d'>".__("Phone", $text_domain)."</a></th>
<th><a href='".ereg_replace("&o=$_GET[o]&d=$_GET[d]", "", $_SERVER[REQUEST_URI])."&o=sl_image&d=$d'>".__("Image", $text_domain)."</a></th>";

And do the following:

<th><a href='".ereg_replace("&o=$_GET[o]&d=$_GET[d]", "", $_SERVER[REQUEST_URI])."&o=sl_hours&d=$d'>".__("Hours", $text_domain)."</th>
<th><a href='".ereg_replace("&o=$_GET[o]&d=$_GET[d]", "", $_SERVER[REQUEST_URI])."&o=sl_phone&d=$d'>".__("Phone", $text_domain)."</a></th>
<th><a href='".ereg_replace("&o=$_GET[o]&d=$_GET[d]", "", $_SERVER[REQUEST_URI])."&o=sl_creditcard&d=$d'>".__("Credit Card", $text_domain)."</a></th>
<th><a href='".ereg_replace("&o=$_GET[o]&d=$_GET[d]", "", $_SERVER[REQUEST_URI])."&o=sl_giftcard&d=$d'>".__("Gift Card", $text_domain)."</a></th>
<th><a href='".ereg_replace("&o=$_GET[o]&d=$_GET[d]", "", $_SERVER[REQUEST_URI])."&o=sl_image&d=$d'>".__("Image", $text_domain)."</a></th>";

Then on lines 189 to 191 find:

<td><input name=’hours-$value[sl_id]‘ value=’$value[sl_hours]‘></td>
<td><input name=’phone-$value[sl_id]‘ value=’$value[sl_phone]‘></td>
<td><input name=’image-$value[sl_id]‘ value=’$value[sl_image]‘></td>”;

And do the following:

<td><input name=’hours-$value[sl_id]‘ value=’$value[sl_hours]‘></td>
<td><input name=’phone-$value[sl_id]‘ value=’$value[sl_phone]‘></td>
<td><input name=’creditcard-$value[sl_id]‘ value=’$value[sl_creditcard]‘></td>
<td><input name=’giftcard-$value[sl_id]‘ value=’$value[sl_giftcard]‘></td>
<td><input name=’image-$value[sl_id]‘ value=’$value[sl_image]‘></td>”;

Then on lines 217 to 219 find:

<td>$value[sl_hours]</td>
<td>$value[sl_phone]</td>
<td>$value[sl_image]</td>”;

And do the following:

<td>$value[sl_hours]</td>
<td>$value[sl_phone]</td>
<td>$value[sl_creditcard]</td>
<td>$value[sl_giftcard]</td>
<td>$value[sl_image]</td>”;

Whew! Feel free to upload the files you just worked on. You can view the fruits of your labor by going to your WordPress Dashboard and clicking “Manage Locations” or “Add Locations” under the “Store Locator” menu. Your custom fields should show up like this:

Above: Result of adding code to add-locations.php

Above: Result of adding code to view-locations.php

Step 3: Modify generate-xml.php and store-locator.js

We need to modify these two files so our custom info shows up on the front end when the user interacts with the actual “store locator.”

Modifying generate-xml.php is a bit more tricky than duplicating HTML (like we did previously) because we must add our custom fields (sl_creditcard and sl_giftcard) to a SQL query. But follow along closely and everything should turn out well!

Open generate-xml.php and on line 43 find:

$query = sprintf(”SELECT sl_address, sl_store, sl_city, sl_state, sl_zip, sl_latitude, sl_longitude, sl_description, sl_url, sl_hours, sl_phone, sl_image,( $multiplier * acos( cos( radians(’%s’) ) * cos( radians( sl_latitude ) ) * cos( radians( sl_longitude ) - radians(’%s’) ) + sin( radians(’%s’) ) * sin( radians( sl_latitude ) ) ) ) AS sl_distance FROM “.$wpdb->prefix.”store_locator HAVING sl_distance < ‘%s’ ORDER BY sl_distance”,

And do the following:

$query = sprintf(”SELECT sl_address, sl_store, sl_city, sl_state, sl_zip, sl_latitude, sl_longitude, sl_description, sl_url, sl_hours, sl_phone, sl_image, sl_creditcard, sl_giftcard,( $multiplier * acos( cos( radians(’%s’) ) * cos( radians( sl_latitude ) ) * cos( radians( sl_longitude ) - radians(’%s’) ) + sin( radians(’%s’) ) * sin( radians( sl_latitude ) ) ) ) AS sl_distance FROM “.$wpdb->prefix.”store_locator HAVING sl_distance < ‘%s’ ORDER BY sl_distance”,

Then, on line 69 to 72 find:

echo ‘hours=”‘ . parseToXML($row['sl_hours']) . ‘” ‘;
echo ‘phone=”‘ . $row['sl_phone'] . ‘” ‘;
echo ‘image=”‘ . $row['sl_image'] . ‘” ‘;
echo “/>\n”;

And do the following:

echo ‘hours=”‘ . parseToXML($row['sl_hours']) . ‘” ‘;
echo ‘phone=”‘ . $row['sl_phone'] . ‘” ‘;
echo ‘image=”‘ . $row['sl_image'] . ‘” ‘;
echo ‘creditcard=”‘ . $row['sl_creditcard'] . ‘” ‘;
echo ‘giftcard=”‘ . $row['sl_giftcard'] . ‘” ‘;
echo “/>\n”;

Okay, we’re almost there! All that’s left is store-locator.js…

Open store-locator.js and on lines 61 to 63 find:

var hours = markers[i].getAttribute(’hours’);
var phone = markers[i].getAttribute(’phone’);
var image = markers[i].getAttribute(’image’);

And do the following:

var hours = markers[i].getAttribute(’hours’);
var phone = markers[i].getAttribute(’phone’);
var creditcard = markers[i].getAttribute(’creditcard‘);
var giftcard = markers[i].getAttribute(’giftcard‘);
var image = markers[i].getAttribute(’image’);

Then, on line 66 find:

var marker = createMarker(point, name, address, “”, description, url, hours, phone, image);

And do the following:

var marker = createMarker(point, name, address, “”, description, url, hours, phone, creditcard, giftcard, image);

Then, on lines 139 to 141 find:

var hours = markers[i].getAttribute(’hours’);
var phone = markers[i].getAttribute(’phone’);
var image = markers[i].getAttribute(’image’);

And do the following:

var hours = markers[i].getAttribute(’hours’);
var phone = markers[i].getAttribute(’phone’);
var creditcard = markers[i].getAttribute(’creditcard‘);
var giftcard = markers[i].getAttribute(’giftcard‘);
var image = markers[i].getAttribute(’image’);

Then, on lines 143 find:

var marker = createMarker(point, name, address, homeAddress, description, url, hours, phone, image);

And do the following:

var marker = createMarker(point, name, address, homeAddress, description, url, hours, phone, creditcard, giftcard, image);

Then, on lines 145 find:

var sidebarEntry = createSidebarEntry(marker, name, address, distance, homeAddress, url);

And do the following:

var sidebarEntry = createSidebarEntry(marker, name, address, distance, homeAddress, url, creditcard, giftcard);

Then, on lines 154 find:

function createMarker(point, name, address, homeAddress, description, url, hours, phone, image) {

And do the following:

function createMarker(point, name, address, homeAddress, description, url, hours, phone, creditcard, giftcard, image) {

Then, on lines 163 to 164 find:

if (hours!=”") {more_html+=”<br/><b>Hours:</b> “+hours;} else {hours=”"}
if (phone!=”") {more_html+=”<br/><b>Phone:</b> “+phone;} else {phone=”"}

And do the following:

if (hours!=”") {more_html+=”<br/><b>Hours:</b> “+hours;} else {hours=”"}
if (phone!=”") {more_html+=”<br/><b>Phone:</b> “+phone;} else {phone=”"}
if (creditcard!=”") {more_html+=”<br/><b>Credit Card:</b> “+creditcard;} else {creditcard=”"}
if (giftcard!=”") {more_html+=”<br/><b>Gift Card:</b> “+giftcard;} else {giftcard=”"}

Then, on line 188 find:

function createSidebarEntry(marker, name, address, distance, homeAddress, url) {

And do the following:

function createSidebarEntry(marker, name, address, distance, homeAddress, url, creditcard, giftcard) {

Then, on line 197 find:

var html = ‘<center><table width=”96%” cellpadding=”4px” cellspacing=”0″ class=”searchResultsTable”><tr><td width=”30%” style=”padding-right:4px” valign=”top”><b>’ + name + ‘</b><br>’ + distance.toFixed(1) + ‘ ‘ + sl_distance_unit + ‘</td><td width=”40%” valign=”top”>’ + street + ‘<br/>’ + city + state_zip +’ </td><td width=”30%” valign=”top” style=”text-align:right”>’ + link + ‘<a href=”http://’ + sl_google_map_domain + ‘/maps?saddr=’ + homeAddress + ‘&daddr=’ + address + ‘” target=”_blank” class=”storelocatorlink”>Directions</a></td></tr></table></center>’;

And do the following:

var html = ‘<center><table width=”96%” cellpadding=”4px” cellspacing=”0″ class=”searchResultsTable”><tr><td width=”30%” style=”padding-right:4px” valign=”top”><b>’ + name + ‘</b><br>’ + distance.toFixed(1) + ‘ ‘ + sl_distance_unit + ‘<br>Credit Card: ‘ + creditcard + ‘<br>Gift Card: ‘ + giftcard + ‘</td><td width=”40%” valign=”top”>’ + street + ‘<br/>’ + city + state_zip +’ </td><td width=”30%” valign=”top” style=”text-align:right”>’ + link + ‘<a href=”http://’ + sl_google_map_domain + ‘/maps?saddr=’ + homeAddress + ‘&daddr=’ + address + ‘” target=”_blank” class=”storelocatorlink”>Directions</a></td></tr></table></center>’;

Congratulations, if you’ve followed the steps correctly your custom fields should be showing up on the front end like this:

Above: Our custom fields on the front end!

Many of my students are stumped when they come across applying perspective to a simple vector object in Adobe Illustrator (in this case, CS3).  Using the “Free Distort” filter seems to be the solution that many use.  However, those of you who have tried this solution before know that it takes a lot of trial and error.  It can also produce unwanted results.  The simple, yet unfamiliar, answer is using the Free Transform tool (E).

Free Transform Tool (E)

The reason that so many designers do not know how to use the Free Transform tool is because of the extra keys that are used with the tool.  The option, command, and shift keys are needed to use the Free Transform tool correctly. Below is a step by step tutorial on how to apply perspective on a logo:

1. Select your vector logo with the Selection tool (V).
**If you are using type, it will need to be outlined  (shift + command + o).

Below are more examples of using perspective.

Thanks!  I hope this helps fellow designers!

Useful Links:
More on the Free Transform Tool
Warped Perspective
Drawing Perspective
Vectorizing

in the Chicagoland area. We have been in business for over 3 years and the growth that we have seen has been amazing. and we are very greatful to our clients for giving us the oppertunity to assist them with their businesses.

View the Demo
Get the Source Code

Design a Unique Grungy Website Layout
The web is filled with grunge web tutorials well here’s one. We like this not so much for the overall result but it is a good tutorial that can be used in many different ways.

Real-time Face Detection in Flash 
Now this is just cool. The future is here. 

View the demo
Grab the source here

43 Creative Examples Of High Quality Free Icon Sets

Other Great Articles:
11 Non-Traditional Uses of WordPress 
Avoid the Apple Tax – Cash in on the value of Windows 
Using CSS Zen Garden As A Teaching Tool For New Web Designers
Blog comments design considerations
App Review: Amplitude — Your iPhone as a Covert Surveillance Tool
101 Design resource sites

Words cannot express our loss from this last weekend of coworker and great friend, Phil Ryan. An energetic presence and a positive individual who not only gave his all but cared about doing things as well as anyone possibly could. As part of our Blueprint family, his desire, dedication, and passion for enjoying the moment will not be forgotten, as were his choice of words at times. Discovering his zest for life, we are certainly humbled to be part of his last two months and to have provided a working environment that he could call home. Our thoughts and prayers go out to Phil’s family and friends.

Rest in Peace, Phil. It’s been a pleasure, Bro, and you will sorely be missed. We’re stepping up, and will do our best.

Oil Paint

Retro Brushes

Line Brushes

Light Blurs

The only link you need for more:
Top 50 Free Photoshop Brushes Resource Sites - This is a great huge list that cover most free sites for brushes.

The restaurant stimulus package will help restaurant owners to discover ways to increase sales, learn cost control and bring you up to date with the latest trends. Restaurant owners, managers, executive chefs, floor managers, decision makers, food purchasers and general managers will get a peek into the deals from the Sysco Truckload Sale and rake in savings from the Warehouse Clearance Center. As well as being able to sit in on multiple stimulating seminars.

Blueprint Design Studio helps restaurants to become more profitable with effective menu designs, or by creating a website design to increase exposure online with proper marketing being implemented.

The show will be held at:

Wisconsin Exposition Center at State Fair Park
8200 W. Greenfield Ave.
West Allis, WI 53214

10:00 am – 5:00 pm

Blueprint Design Studio will be at booth 1402

Recent Resource Links:
Restaurant Stimulus Packages…
Cobra
Stimulus Plan Update
CA Restaurant & Bar Owners (not drinkers) Will Feel the Pinch of Nickel Tax
We’ve Got A Sweet Deal For You!

Site Support

All of Norway is against IE6
No More ie6
Get rid of the flicker
“let IE6 die”
No More ie6 Support
Done

Genuine Microsoft Internet Explorer 4.0 by jankoraseta

Photo Support

Death of IE6 by Able Net Design

Last.fm in IE6 - No message to upgrade just a broken site.

Truth by adurdin

.Mac Web Galleries != IE6 by andrew*

That Voodoo E by CannedTuna

Internet Explorer plush voodoo by *chisa

F*ck Off IE6 by Emily Lewis

Related:

Internet Explorer 8.0 will support microformats
How to Deal with it
ie8 gets you where you want to go quickly
FIRST LOOK AT IE8 ACTIVITIES AND WEBSLICES

Do you still use IE6? Enjoy browsing!