Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

How to ensure your images have valid filenames.


spooks

Recommended Posts

Image Filenames

 

When you save your images on your server you must ensure you don't use any reserved characters, for best practice do not put any of: $&+,/:;=?@<>#%{}|^~[]` or any spaces or any quotes, breaking these rules is likely to cause failure in one browser or another.

 

Additionally it is advisable to use all lower case, as using upper case, or mixture can cause issues in some circumstance.

 

You may wish to break these rules for convenience (ie matching image to product/model etc.) but that's always a bad idea, as your convenience may cause your visitors to not see what you want them to see.

 

If you use Photoshop its 'Save For Web' option will ensure you use valid filenames.

 

A problem can arise in that your clients may be un-aware, or forget these rules, this simple mod will ensure your pictures will always be saved with valid filenames.

 

open admin/includes/classes/upload.php

 

find (120):

 

$this->filename = $filename;

 

replace with:

 

 $this->filename = strtolower(preg_replace(array('/[^\w\(\).-]/i','/(_)\1+/'),'_',$filename)); 

 

What that does is replace any characters 'not allowed' with a underscore (_) it also ensures you wont get repeated underscores as a result, it also converts all uppercase chars to lowercase.

 

That filename will be used for the save to your server & will be saved to your dBase entry, but does mean uploaded image filenames may vary from the original on your PC.

 

Additional Common Issue:

 

This comes up very often, so I`ll repeat it here too.

 

JPEG Files (.jpg/.jpeg) can be saved in an number of colour space modes:

 

RGB (separate RGB channels)

CMYK (Cyan Magenta Yellow Black)

YCbCr (three channel component)

YCbCrK (four channel component)

 

The three latter are all derivative of the original RGB mode (ie anyone tells you Component is better than RGB they are talking bunkum).

 

Internet Explorer (IE) can only display images saved with a RGB colour space mode, so if you have the issue:

 

My images (pictures) are not appearing in IE although they are displayed fine in Firefox, its quite possible you have this problem.

 

 

I hope this is helpful to some smile.gif

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

Uploading via FTP:

 

Perhaps I should have said, the above code change only applies for images uploaded through admin when editing products or categories etc, if you upload via ftp you bypass all that. wink.gif

 

 

Whilst on that subject, its important you always use the correct transfer mode when uploading via ftp.

 

When uploading images you must use the binary mode, whereas when uploading php/css/html files you must use ASCII, if you use the wrong mode you will corrupt the file then start scraching your head wondering whats wrong.

 

The best method is to always leave your ftp transfer mode set to automatic, then you don't have to worry.

 

 

 

Further info:

 

All files containing only ASCII formatted text such as php, css, html, plain text, asp, vbs, js (javascript) must be uloaded in ASCII transfer mode or automatic.

 

Any file containing binary data such as pictures, audio, video, pdf, word docs etc must all be uloaded in binary transfer mode or automatic.

 

 

I hope that resolves issues for some. smile.gif

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

.zip, .tgz, .rar, .gz files and other compressed formats (such as for digital downloads) are binary files and must be uploaded in binary/automatic format.

 

Note that sometimes "automatic" mode selection guesses wrong (e.g., might happen to see a CR-LF in a binary file and assume that it's ASCII) and uploads in the wrong mode. Especially with binary files, you should check what mode was used. It's rare, but it's been known to happen from time to time, so "automatic" mode selection is not foolproof.

 

Some rarely-used picture/image formats may be ASCII (text), but the most common ones (.gif, .jpg, .bmp, and .png) are definitely always binary.

Link to comment
Share on other sites

Additionally it is advisable to use all lower case, as using upper case, or mixture can cause issues in some circumstance.

It is quite safe to use all UPPER CASE or Mixed Case. The only time you will run into problems is if you are not consistent in your capitalization. Windows is case-insensitive: if you upload a file as MyCat.JPEG, you may refer to it as mycat.jpeg, or any other combination of upper and lower case. On the other hand, Linux (and other Unix-family operating systems, such as Mac OS/X) is case-sensitive: MyCat.JPEG and mycat.jpeg are considered to be different files (you could actually have two different images by those two names). If you uploaded a file as MyCat.JPEG and in HTML refer to it as mycat.jpeg, your browser will complain that it can't find the file. The name given in the page (HTML) must be MyCat.JPEG in order to match the file on the server.

 

If you have problems remembering what name (capitalization) you upload files under, and are constantly messing up by giving a file one name and referring to it by another, you may want to simplify your life by adopting a consistent rule such as "always lower case". It's irrelevant on a Windows server, but may save your skin on a Linux server. And even if you're on a Windows server, you never know when you may decide to transfer your site to a Linux server, so it's good to get into the habit of being consistent in file name capitalization. That will save you a lot of work in going through your files and database to clean up file names.

 

Using all UPPER CASE does have one drawback: it makes you look like an idiot who hasn't graduated from MS-DOS kindergarten. You look like the morons who SHOUT IN THEIR POSTS.

Link to comment
Share on other sites

When you save your images on your server you must ensure you don't use any reserved characters, for best practice do not put any of: $&+,/:;=?@<>#%{}|^~[]` or any spaces or any quotes, breaking these rules is likely to cause failure in one browser or another.

Note that many Microsoft programs (photo editors and text editors) encourage you to put spaces/blanks and all manner of punctuation in file names (e.g., Our Thanksgiving Visit to Grandmother's House.JPEG). When you upload these files to a Linux (or Unix-family) server, they can cause all sorts of problems, even if your HTML code references match exactly. Linux doesn't like spaces and much punctuation in file names. Try to rename files to server-safe versions (Our_Thanksgiving_Visit_to_Grandmothers_House.JPEG) before uploading, so that you don't run into problems working with such files on the server.

 

Before anyone starts crowing that "this proves the superiority of Windows", keep in mind that even in Windows, scripts and programs using such badly named files need to wrap them in quotation marks " before most commands will properly handle them. Try in a "command window" copy Our Thanksgiving Visit to Grandmother's House.JPEG some_other_name.jpg and see what happens. GUIs and "drop and drag" interfaces can handle such names, but real code can't.

Link to comment
Share on other sites

.zip, .tgz, .rar, .gz files and other compressed formats (such as for digital downloads) are binary files and must be uploaded in binary/automatic format.

 

Note that sometimes "automatic" mode selection guesses wrong (e.g., might happen to see a CR-LF in a binary file and assume that it's ASCII) and uploads in the wrong mode. Especially with binary files, you should check what mode was used. It's rare, but it's been known to happen from time to time, so "automatic" mode selection is not foolproof.

 

Some rarely-used picture/image formats may be ASCII (text), but the most common ones (.gif, .jpg, .bmp, and .png) are definitely always binary.

 

 

Well I certainly concur with all that. wink.gif

 

Some ftp programs are better than others & yes they can get it wrong, its the old adage, never assume, always check. Un-fortunately checking is the absolute last thing some do!! ohmy.gif

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

It is quite safe to use all UPPER CASE or Mixed Case.

 

 

I did say ' in some circumstance', and I have seen it cause problems, so yes in many cases caps is fine, but my recommendation is to stick to lower, then you can't have an issue arise that you might struggle to find cause as you forgot this. cool.gif

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

Am I right in saying that this will replace the format of all existing images also?

 

Does this code put an underscore in replacement of spaces?

 

$this->filename = strtolower(preg_replace(array('/[^\w\(\).-]/i','/(_)\1+/'),'_',$filename)); 

Link to comment
Share on other sites

Am I right in saying that this will replace the format of all existing images also?

 

 

 

No, any existing images or dBase entries are un-altered

 

 

Does this code put an underscore in replacement of spaces?

 

Yes

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

No, any existing images or dBase entries are un-altered

 

 

Does this code put an underscore in replacement of spaces?

 

Yes

 

Could that help with people finding the site you think? As currently all pictures have spaces between the words and there is no traffic at all other than bots.

Link to comment
Share on other sites

Could that help with people finding the site you think? As currently all pictures have spaces between the words and there is no traffic at all other than bots.

 

 

no, its for functionality not seo purposes, but remember, when any links are created any spaces will become %20 , not good!!

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

Would you suggest re-uploading all the pics then?

 

 

If you have any possibily invalid filenames then yes I would advise replacing to ensure you dont have any issues that you may be un-aware of.

 

You may find Remove Unused Images http://addons.oscommerce.com/info/6346 http://www.oscommerce.com/forums/index.php?showtopic=343935 useful after, though that struggles with invalid filenames too.

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

If you have any possibily invalid filenames then yes I would advise replacing to ensure you dont have any issues that you may be un-aware of.

 

You may find Remove Unused Images http://addons.oscommerce.com/info/6346 http://www.oscommerce.com/forums/index.php?showtopic=343935 useful after, though that struggles with invalid filenames too.

 

I've started my trek on updating every image already. Gonna take weeks! :D Thanks for the link. I have just installed a add-on to find missing images on products, but am finding it hard to find that work with More Pics, so I will get that sorted first off.

Link to comment
Share on other sites

  • 4 weeks later...

Do these filename issues apply anywhere else in osCommerce, ie is there any restriction on what I can name a product?

 

 

Er, yes & no!! It depends on what your putting & what your doing with the data.

 

Product names, like the description can be html, so have almost anything, BUT if that data is used for anything other than just the default you must consider that too.

 

IE if you use the product name for the alt tag for the product image, the alt tag will show the tags within the name, that can be circumvented with strip_tags()

 

But if you use a seo url package which usually use the product name to form the url you must ensure the name does'nt contains any 'special' chars that cannot be part of a url, unless your seo package takes care to remove all such.

 

 

Sorry its not a more definative answer biggrin.gif

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

As far as updating image file names to "Web safe" goes, that could be done with a shell script on your server. It would go into the images directory and grab each name as a string, and then replace all spaces with underscores and remove all other unsafe punctuation. It would then rename ("mv" in Linux) the file to the Web safe name.

 

It's trickier to rename references to a file, when you change file names. You could write a PHP script to troll through the product information table(s) that include the image file names, and change the names there in the same manner as in the first paragraph. You might even do your renaming at that point (PHP rename() function, IIRC). This would mean that file references and names are out of synch only for a split second, and for only one image at a time. Sounds like a useful utility for someone to write and provide to the community!

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...