Entries Tagged as 'Web Design'

How to edit scanned photos quickly!

Photoshop scanned multiple images

Rather than scanning one photo at a time to create digital files of older photos, I scanned multiple photos at once.  The re

sult was a page of pictures in Photoshop linked as one file.  The dilema as to how to separate them individually to work with and save them, appeared to be a tedious chore of using the marqee tool to cut them out, creating

layers of various pictures….you get the idea!  Much to my joyous surprise, Photoshop has a very amazing tool under the File pull down menu.  Simply go to Automate then Crop and Straighten.  Make sure you are on the root layer containing all your pictures and Photoshop does the rest.  Each picture will be a separate file to work

After process to separate photos

with.  When scanning, make sure there is a space around each picture to make

it easier for Photoshop to differentiate the photos.  Once you have made your adjustments or manipulated your photos, do not forget to name and save your photo

before closing.  Now you are ready to archive all those older photographs and priceless memories!

Schema Data Structure Documentation in Drupal

I have been working on a project on the Drupal 6 platform that requires the web application to recognize dynamically created sub-domains so the functionality of the database can be adjusted according to what sub-domain is in the current URL.

To get Drupal 6 to do this, I am creating a custom module. One of the things I have learned about creating a custom module in Drupal 6 is the implementation of the module’s “install” file.

If you create a module named say,  my_module.module then the module’s install file name would be  my_module.install and will reside in the directory named my_module located at….

my_site/sites/all/modules/my_module

Drupal 6 Module Install File Documentation

The  .install file will be run by Drupal 6 the 1st time my_module has been enabled. The my_module.install file will then be used to run setup procedures as stipulated by your module. The most common task for the my_module.install file to perform is creating database tables and fields. There is no special syntax for the install file. It is simply a PHP file with a .install extension to properly identify it to the Drupal 6 platform.

There is special function used in the .install file called hook_schema(). Where hook would be replaced by the name of your module. For example, if  the module you create is named my_module, then you would create a PHP file and name it my_module.install. Inside that file you will create a function named  my_module_schema(). The my_module_schema() function is used to create arrays representingthe database tables you wish the module to create in the Drupal database. You can see how this works here.

Why do it this way?

Once you build the Drupal API Schema there is no more need for  separate CREATE TABLE or ALTER TABLE statements on each database. As a module developer, you only need to create a schema structure and/or use the Drupal Schema API functions, and Drupal takes care of the rest. This greatly simplifies  writing install and update functions.

This way of creating the module install files also allows for support in multiple database platforms.

According to Drupal’s Blog this also allows for “Several advanced capabilities, such as incremental database updates, a simple and consistent CRUD API, form scaffolding, simpler CCK and Views, schema and data validation, become much easier to implement in future enhancements.”

Schema Data Structure Documentation by Drupal

Wild Card Sub Domains

I am working on a web site that will be taking on many Individual Business Owners. The web site is designed to create sub domains created dynamically according to the input of users as they sign up for the service. Since the web site is expected to accommodate up to 30,000 users it would not be practical to edit the httpd.conf configuration file in Apache for each one. The file would simply grow to be enormous. The solution? Create wild-card sub domains.

Wild-card sub domains can be a great way to handle multiple sub domains that need to be created dynamically by making a simple edit to Apache via the terminal and some creative PHP programming.

The first step is alter Apache. There are a few ways to do this depending on how your server is set up.
Here are some links I have found on how to do this in various server environments;

NOTE: In the case of the project I am working on, we have a dedicated server by RackSpace. It was necessary to register the wild-card sub-domain ( *.you-domain.com ) with their name servers as well in order for this to work.

Step One: Set Up a Wild Card DNS Record

The first step is to create a wildcard DNS record. Your DNS server is already resolving visitors to domain.tld, but it doesn’t know where to resolve them to find subdomain1.domain.tld.

You’ll need to create what is called an “A record,” which is short for “address record.” As the name implies, “A records” tell what IP address a host is pointing to.

The way to do this will vary based on your DNS server and what control panel (or command line) you are using, most are somewhat similar. When you create a name record of type “A” pointing from *.domain.tld to your web server’s IP address.

If you are using a control panel, then likely you can set this using a web form. Sometimes have to get your web host to do this.

Your web server’s DNS service may need to be restarted. You can expext it to take a few hours or even up to a few days sometimes to propagate throughout the Internet.

Step Two: Set Up a Wild Card DNS Record

Test and make sure it working by typing in a random sub-domain url to your site ( ie. Http://random-name.your-domain.com  ). It should resolve to your site’s home.

Now that any sub-domain will point to your domain, you can use some PHP to determine what URL brought your user to your site. Once you have that knowledge you can manipulate the functionality of  your site accordingly. Pretty cool!

Recognize Which Sub Domain Brought Your Visitor With PHP

One way to “recognize” the subdomain from the URL that brought you visitor is to use the a supper global ( which means they are available in all scopes throughout a script. There is no need to do global $variable; to access them within functions or methods) server variable called $_SERVER['HTTP_HOST'].

This super global variable will return the host name.
ie.   sub-domain.your-domain.com
( if there is no sub- domain then it would just be the domain.com)

If you use PHP’s explode with “.” as the delimiter, you can isolate the sub-domain by separating out the first element of the resulting array of URL parts like this…

$url_sections = explode(”.”,$_SERVER['HTTP_HOST']);
$subdomain =$url_sections[0];

Knowing what sub-domain you’re dealing with gives you the PHP power to make you scripts act accordingly. In my case, I used the extracted information for the “virtual” sub-domain to query the MySQL database.

Wild card sub domains can useful for content management platforms like Drupal. With wild card sub domains and a little cleverness you can handle multiple sub domains within a single installation of Drupal.

A Special Note Regarding  SEO

It is very important that you do not have more than one URL (including the sub domain) point to identical content. Google penalizes for “duplicate content” so be sure not to carelessly point various unknown sub domains at your sites home page. With wild card sub domains, if a user makes a mistake and types in a misspelling then use PHP to redirect their page in some way that corrects them and then points them to the right page.

If you are dealing with this already and have any comments or suggestions or corrections feel free to post a comment.

Creating Virtual Hosts ON Your MAC for MAMP

Open up the terminal.
1)    Web-Two:~ webtwo$  cd /etc <–change directory to the etc directory

2)    Web-Two:etc webtwo$ sudo nano hosts <–super user do (does not stay logged in),  editor, file=hosts

3)    Password: *******  <– enter password

4)   Editor opens up. You will see something like this…

#
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1       localhost
255.255.255.255 broadcasthost
::1             localhost
fe80::1%lo0     localhost

5)  Type in the local IP followed by the name of the site you wish to make a virtual host for:
ie. 127.0.0.1 yoursite.you <– replace this with your name
You should do this for each site you wish to make a virtual host for , line by line.
Your /etc/hosts   file should now look more like this:
#
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1       localhost
255.255.255.255 broadcasthost
::1             localhost
fe80::1%lo0     localhost
127.0.0.1 yoursite.you

127.0.0.1 anothersite.you
127.0.0.1 yetanothersite.you

6)  Exit your editor, in this example I used, nano. Note: Be sure to SAVE the file.

7)  OK, now navigate to the file:    Applications/MAMP/conf/apache/httpd.conf  and open it in a text only editor ( like BBedit or Smultron or something )

8)  Scroll to the bottom of the httpd.conf file. For each site type in the following:

<VirtualHost *>
DocumentRoot “/Users/yourusername/Sites/site-folder-name”  <– replace with your own appropriate info
ServerName  localsite.you
<– replace with your own appropriate info
ServerAlias localsite.you <– replace with your own appropriate info
<Directory “/Applications/MAMP/htdocs”> <– do NOT change for MAMP
AllowOverride all  <– this allows the htacces file to work properly
</Directory>
</VirtualHost>

9) Save the Applications/MAMP/conf/apache/httpd.conf    file and RESTART your MAMP server.

Now, when you type in the  site   www.localsite.you  followed by your MAMP port (usually 8888) like this:

http://www.localsite.you:8888 your site will come up!

Hope this helps!

Viewing the Websites You Are Developing Locally on Your Computer Using MAMP

Normally, when using MAMP ( I am presently using the FREE version of MAMP) you view the site you are working on in a couple of ways.

Put your web site in the    /Applications/MAMP/htdocs/     folder and point your browser to   http://locahost:8888/

or (This is what I like to do for multiple site management)

Put your sites in appropriately named folders under the “Sites” folder.
Click on MAMP Preferences and select the “Apache” tab. Then click the “Select” button and browse to the “Sites” folder.

That way, you can easily get to any of the folders by typing in the URL http://localhost:8888/. You will be presented with a list of folders (as links). These folders are the sites you are developing under the Sites directory. Just click the folder (link) you wish to view and you’re there.

Hope this helps!

Screen shot of the up and comming CPI Data Panel

I havn’t posted in few weeks because I have been very busy with several projects. One of the projects I am particularly excited about the CPI panel. The Cpi panel is new “back end” for LoveFineArt.com. IT used to be that each and every product would take about 20 minuets to enter. With this new panel (incorperating secure AJAX), The products can be entered as fast as the site owner can type!

Here is a screen shot of the new back end.

Screen shot of the up and comming CPI Data Panel

I have also been busy learning the Drupal platform. AS I become more knowledgeable there will be posts and perhaps a special section on this blog devoted to cool new drupalistic methods and problem solving.

AS always, I invite you to leave a coment or sugestion or critisizm.

Hack for IE7 with 'Leak' in Select Multi

Select element set to multi leaks in ie.

I do not often have a use for the select element in front end web design. In this case, however, I was creating a user interface for a back end product control panel. It needed to be very compact with a lot of options packed into a small place. I ran into a problem when I needed to group four select elements together. The select elements all needed to be set to multi. Everything was fine with the exception of Internet Explorer 7 (big surprise!). IE would “leak” the contents of the select element outside of the element spilling into the surrounding div whenever it was floated in a div. I have not yet discover the exact conditions under which this happens as I was in a time crunch.

No more leak from the select element!
No more leak from the select element!

I spent about 20 minuets searching the Internet for someone who had come across the same problem but found nothing. So I thought I had better post how I decided to deal with this. Before I go on, I would like to mention that I did find a very good post by Nicholas Rougeux, called “Check it. Don’t select it“  . It is worth a look as it may be a better alternative in your case.

Cutting through all the “chase”, it boiled down to a rather simple fix. The only thing I could do was to encase the select multi in a div that had overflow:hidden. Note that this is not the setting of overflow:hidden on the select element set with multi. The overflow:hidden setting is on the div that immediately surrounds the select element set to multi. In this way, the garbage data that ie was leaking out from the element would be hidden away from view.

So, for what it’s worth, I hope this little post will help someone out there who is suffering from the woes of Internet Explore. Oh, and if you have any answers or better solutions, by all means contact me. I’m happy to share and be enlightened.

View Local Developement Sites with Parallels and MAMP on a Mac

How’s that for a long title? I just wanted to make sure that the desperate souls in need would be able to find what they are looking for. If you are a web developer, you must deal with Internet Explorer. If you’re developing on a Mac, that can be even more of a pain the the already agonizing ordeal. Here is a little something to make it easier, thanks to MAMP.

MAMP is a program that helps you run a server on your MAC. “But, I already can run a server on my MAC!”, you exclaim. True, but there are some really nice organizational features about MAMP (even the FREE version) that makes it worth checking into. That is another post. For now, I’m going to tell you a simple way to get IE as viewed from Parallels to “see” your local web site(s) you may be developing. This makes trouble shooting, especially where CSS is concerned, much faster and easier. Hey, I’m all for anything that makes dealing with IE easier.

For this post, I assume you have decided to install MAMP and have successfully done so (It’s easy, by the way) and you have also decided to use Parallels and have it installed.

Take a Look at your MAMP console. Do you see where it says “Preferences” ?

Press the preferences button on the MAMP console.

Press the preferences button on the MAMP console.

After clicking on the “preferences” button, you will then click on the “ports” button. It should look like this.

Notice the port number of MAMP

Notice the port number of MAMP

Notice what the port number is where it says “Apache Port”. You will use this in you URL in IE. The port number is almost always going to be 8888 unless you have changed it for some reason.

OK, now go to you MAC’s “System Preferences”. Not to insult your intelligence, but, in case your a newbie or just a bit flustered at the moment, you get there by clicking on the little apple in the far upper left corner of your screen. The resulting pane should look like this.

Notice your local IP address

Notice your local IP address

Do you see the IP Adress in the middle of this pane?

After opening Internet Explorer in Parallels, type the following address.

address to type in Internet Explorer

address to type in Internet Explorer

Did you notice that it is a combination of your local IP and the MAMP port separated by a colon? If everything else is working as it should, then this will show you your local site from within the “Sites” folder just under your “Home” on your MAC.

In another post coming soon, I will tell you how to set up multiple sites with the free version of MAMP. Its easy and makes for a much smoother transition between projects.

I hope this post was helpful and easy to understand. Feel free to let me know your thoughts. I’m grateful for any friendly criticism or “how to” contributions.

Learn To Guide Web User’s with Precedence

In web design, it is important to guide the user’s eye. Without a sense of “flow” a feeling of frustration takes over creating a negative experience. The art of subtly, and sometimes not so subtly, guiding the viewer’s attention is referred to as Precedence.

Since web pages are, for the most part, about the users getting information, how the information is presented is of great importance. There are several ways to do this, namely, [Read more →]

Adjust Your Design with a Fresh Look in the Mirror

If you have ever spent a long time working on a design, you have probably noticed that after a while you may feel there is something “not quite right” about what you are working on but you just can’t seem to put your thumb on it. In most cases, this is because you “intuitively” know that something is wrong. But the image of what you are working on is “burned” into your retina. The image that is before you has become more dominant than that of your mind’s creative eye. I have discovered a little trick from my days as a fine artist to solve this problem. [Read more →]

View Paul Leasure's profile on LinkedIn