Eric Anderson: February 2008 Archives

In a ProStores store, a blank keyword search will return "All" products — If you have a large catalog, this is never a good thing. Expecting your users to view 2000 items 25 items at a time is just silly. Here is a quick, easy way to completely remove the possibility of a blank keyword search in your ProStores store.

In Page Template Manager, locate the opening of the default keyword search form found in the Header template source code. It should look something like this:

<form method="post" action="$storeVersion.searchResults"></form>

There is a DOM event called "onSubmit". Using this event, we can easily add a test to the form that will keep the form from being submitted if the keyword input is empty. Example:

onSubmit="if(document.searchForm.keyword.value == '') return false;"

Once you correctly add the event to the form element it should look like this:

<form method="post" action="$storeVersion.searchResults" onSubmit="if(document.searchForm.keyword.value == '') return false;"></form>

Now, with no complicated form validation or any other scripting, your keyword search form cannot be submitted unless the user enters a keyword. That makes sense, right? You're welcome.

If you are using a default ProStores template set (Store Version) and you want to change the font sizes this display will help. Your font size choices in the Design Settings are presented as keyword sizes: Very Small, Small, Medium Small, Medium, Medium Large, Large and Very Large. Here is a visual representation of each.

Very Small (10px)

Small (14px)

Medium Small (16px)

Medium (18px)

Medium Large (24px)

Large (32px)

Very Large (48px)

In CSS, there is a font size attribute called "Absolute-size" - also referred to as using a keyword to specify font size. Though similar, they are slightly different than the choices you have in ProStores. Here is a visual example of font sizes specified using keywords:

Absolute size - xx-small

Absolute size - x-small

Absolute size - small

Absolute size - medium

Absolute size - large

Absolute size - x-large

Absolute size - xx-large

In legacy styles used for HTML you will find yet another similarity, but still different.

Size 1

Size 2

Size 3

Size 4

Size 5

Size 6

Size 7

I sincerely appreciate Neoverve's efforts and support of my business. You are there for me every step of the way.

— Jeff Duben, La Costa Gourmet