CodeCanyon: HTML5 Upload Instructions

1. Ensure You Are Using Acceptable Images/Extras:

   It is up to you to ensure that all images/assets in your project are cleared for use. If necessary, you should contact the creator of the asset and ask them.

   As an example, images from the stock photography site iStockPhoto are generally not usable in templates unless you have purchased an extended license for the item. In this instance you would report the extended license details in the comments section.

   Please review this article for more information on acceptable assets.

2. Follow These Guidelines:
   1. DO try to make your submission as cross-browser compatible as possible. However, we certainly understand that this simply isn’t possible across the board for an HTML5 category. Nonetheless, at least try to provide some level of support for older browsers, like Internet Explorer 8 and below.
   2. DO ensure that your submission uses HTML5 before submitting to this category. This will include using the new HTML5 elements, as well as any applicable JavaScript APIs. Otherwsise, your submission should be submitted to our “JavaScript” category instead.
   3. DO NOT copy and paste code from various tutorials around the web. You’re of course free to gain inspiration and to learn techniques, however, that’s the extent of what you should be using a tutorial demo for.
   4. DO validate your code, in order to catch any small mistakes in your mark-up. With that said, don’t worry about any CSS3/HTML5 related errors…because they aren’t errors! :)
   5. DO include as much documentation as is necessary for your item. Otherwise, you’ll pay the price when you receive countless support emails. Documentation is key.
   6. DO NOT specify that your HTML5 item works in a certain browser if it, in fact, does not.
   7. DO NOT assume that the buyer of your item has any significant level of coding knowledge. When preparing your documentation, treat the buyer like a three year old. They’ll thank you for it!
   8. DO specify in your live preview which browsers it is optimized for.
   9. DO code in a style that follows the latest best practices in the industry. Otherwise, your item will be rejected accordingly.
3. Create the Final Download File:

   You should create a single ZIP file that contains the final files for download, any documentation and any auxiliary files such as extra images. This is the file that a user will get when they buy your item. Make it as complete as possible, and organize your file structure into as many folders as is necessary. For example, you might have “Source,” “Demo,” and “Documentation” folders in your final zip file.

   All Files Must Contain a Help File: All items sold on CodeCanyon must contain documentation explaining how to customize, install and use the item. Especially for the components category, you must ensure that you’ve adequately detailed the necessary steps that need to be followed in order to implement your component into the buyer’s project.

4. Create a Preview Zip:

   Include several screenshots which illustrate the functionality of your component. It’s essential that you provide plenty of images if you choose to forgo a live preview. Screenshots should be JPGs, should be no larger than 1200px in width, but can be any height. You can have up to 10 screenshots of the item, and each screenshot may have a description attached. Here’s how you set up the file:

   1. Name each screenshot in sequence as number_Title.jpg. E.g. 1_Homepage.jpg, 2_Generalpage.jpg.
   2. Create a .TXT file containing a few lines of descriptive text, with the same name as the screenshot. E.g. 1_Homepage.txt, 2_Generalpage.txt.
   3. ZIP up the JPGs and TXTs together into a single ZIP file.
5. Create a JPEG Thumbnail:

   Finally create an 80px x 80px JPG thumbnail for your file. The thumbnail should represent your item in some way.

6. Create a 590px Wide Image Preview

   This will be the featured image, when a user visits your item page. This is the first thing they see, so make sure that it’s effective. If you’re not a designer, use these PSD image templates, and substitute your item’s information.

7. Upload your files to CodeCanyon!

Rate this Article (7 Ratings)

Help us improve the wiki Send Your Comments