Selling WordPress Themes on ThemeForest: What to Include in the Production Pack
As a WordPress theme author there are many ways you can organize your production theme pack, but ThemeForest reviewers strictly observe theme submission requirements and unwritten recommendations. In this post I will explain how to prepare your production theme demo pack; what you should include, and what you should avoid.
WordPress Theme Submission Requirements
Feel free to browse the extensive theme submission requirements, but you won’t find descriptions of what exactly you should put in the production pack of your theme. Instead, we’re going to get the information we need from the ThemeForest item upload dashboard.
Choose WordPress in the category dropdown; you’ll be taken to an upload UI. Skip the Name & Description panel for now, and turn your attention to the Files panel.
First you’ll be asked for the 80x80px Thumbnail file. This can be PNG or JPG, it is up to you, but I prefer PNG format.
Next up is the Theme Preview image. Here you should be very careful about file sizing and naming. This image will be visible on the product page and in the search results page. Make it exactly 590×300 pixels and name it in the following way: 01_<filename>.jpg. If you want to include more preview images, create them with the same image aspect ratio as the main preview image, make sure your files are a maximum of 900px both in width and height. And the naming should be similar to the first file 02_<filename>.jpg , 03_<filename>.jpg. Your preview files should be added to a separate zip archive file, even if you have only one preview file. Name the preview archive preview.zip.
The next section is for Main File(s). Here you should include all the required files for the end user, excluding the thumbnail and preview files.
And the last thing is the uploadable theme zip file itself. This is the file that users can upload to WordPress to start using your theme.
My Personal Approach
Generally, what we’ve covered so far is all you’ll find from official sources on theme production file packing–the rest comes down to best practises and recommendations. I will share my own approach which you’re welcome to extend; suggest your own ideas in the comments.
I use a work folder with all my projects. First I create a separate folder Uploads. If you create multiple product types for multiple platforms (for example, both plugins and themes for WordPress, Joomla, Drupal and so on) create separate folders in the Upload folder for each platform and for each project type, like so
Uploads
├── WordPress
├── Themes
└── Plugins
└── Drupal
├── Themes
└── PluginsThen create a folder in the Uploads/WordPress/Themes folder with the theme name and _pack prefix, like this themename_pack. Inside that folder create several subfolders folders:
Uploads
└── WordPress
└── Themes
└── themename_pack
├── Demos
├── Snippets
├── Additional
├── Plugins
└── Final-filesThere are a couple more files and folders we’ll include in the themename_pack folder, but for now let’s now look into the folders listed above.
Demos
No matter if your theme has multiple demos or just one demo, you need to include your demo files in your download pack, even if you have a “one-click demo import� feature, or ready-to-use template blocks directly from your theme. There will be situations when users will need a manual demo import.
If your theme has multiple demos, create each demo folder inside the main Demos folder separately. Include all necessary files with each demo. For example, I include:
- separate XML files: all.xml, posts.xml, pages.xml, and so on.
- widgets.wie: the widget import file generated with the Widget Importer & Exporter plugin.
- options.json: the theme option panel settings import file. I use reduxframework to create the theme option panel–if you use any other option panel framework it should have some sort of import/export functionality.
- slider1/2/3.zip: the slider revolution ZIP file. I use revolution slider to create slides for my themes, so I include all the sliders that I created with the theme in the demos.
Snippets
All theme authors have their own hacks and shortcuts to make it easier and more productive for clients to use their themes. For example, sometimes a user will need to enable shortcode rendering in the text widget, or enable SVG upload to use a custom icon font or an SVG logo file, or they’ll need to make HTML5 video cross-browser compatible–all these tasks can be done with ready-to-use small code blocks or WordPress actions and filters. I include a TXT file for each “life-hack� in the snippets folder, with instructions given in the help file.
Additional
Here you can include all the additional resources that you want to include with your theme. These could be custom theme-specific icon fonts, or stock photos and videos that you’ve purchased for the theme demo and have the correct license to include in your commercial product. You are not limited here, as long as you don’t breach theme submission requirements regarding file licensing.
Plugins
If your theme includes premium plugins and you have what’s known as an “In-Stock Usage License�, you should include the plugin ZIP files here. For example, I habitually include Slider Revolution and WPBakery Page Builder.
Extra Files and Folders
Having covered the fundamentals, let’s have a look at what else needs to be included. In the themename_pack folder add the following:
- Theme core folder with all files
- Theme child theme core folder with all files
- Manual in PDF or HTML format
- Changelog.txt
Child Theme
ThemeForest submission requirements do not make including a child theme mandatory, but it is highly recommended. If you include a child theme, it should logically be coded with the required standards. For example, it should be named yourthemename-child, the included files should at least comprise a functions.php file, a screenshot.png, and the style.css file. Even if your child theme is empty, these files are enough to help your buyers get started.Â
If your child theme extends the main theme, the functions.php file should at least include the following:
<?php
function yourthemeprefix_yourthemename_child_enqueue_styles() {
$parent_style = 'yourthemeprefix-yourthemename-parent-style';
wp_enqueue_style( $parent_style, get_parent_theme_file_uri('/style.css'));
}
add_action( 'wp_enqueue_scripts', 'yourthemeprefix_yourthemename_child_enqueue_styles' );
?>And the style.css file should at least include these header details:
/* Theme Name: Yourthemename Child Theme URI: https://yourtheme.com Description: Child theme description here Author: Author name here Author URI: Version: 1.0 Template: yourthemename */ /* =Theme customization starts here -------------------------------------------------------------- */
Manual
Theme authors are no longer required to include offline documentation in the theme–it’s recommended you host your own online, make it publicly accessible, and place a link to it in the item description–but you are still allowed to include offline documentation if you choose. This is a matter of preference rather than a strict rule, I prefer to include a PDF manual.
Changelog.txt
Changelog files are an important way of making the development of your theme totally transparent. List all your changes and bug fixes in this document. Organize it with versions and dates, like so:
08,07,2018 - Version 1.1.5 - Updated packed Visual Composer - Corrected minor styling issues - Fixed Sticky header jump on mobile devices
Reject (Non-Production)
This is one more folder I include in my own theme pack (though not the production version, because it’s for my eyes only). I highly recommend collecting all the rejection issues that your theme gets after submission. Collecting a rejection history for each theme is good practice and will help improve all future projects.
The Final Folder Structure
Let’s take a final look at the files and folders we’ve included in the themefolder_pack:
Uploads
└── WordPress
└── Themes
└── themename_pack
├── Demos
├── Snippets
├── Additional
├── Plugins
├── Reject
├── Themefolder
├── Child themefolder
├── Manual pdf, html
├── Changelog.txt
└── Final-filesFinal-files
It’s time to create the final files to upload to ThemeForest.
- Select your Themefolder and create a ZIP from it with the same name.
- Select all folders and files, except
RejectandFinal-files, and compress into themename_pack.zip - Copy these two zip files and move to
Final-filesfolder. - Open the Final-files folder and add a
Previewfolder in it. - Add to this all the preview files that we discussed earlier.
- Create the preview.zip file from that folder.
- And also put the thumbnail.png/jpg file in the
Final-filesfolder. - You now have all the necessary files to upload to ThemeForest: yourtheme.zip, yourtheme_pack.zip, the preview.zip, and the thumbnail.png/jpg.
Conclusion
In this article I included a mix of recommendations and requirements for submitting final WordPress theme files to ThemeForest. Your theme may still experience rejection in some form, but by including all the necessary files in the correct way you’ll be making the review process a little bit smoother.
If you have any suggestions or questions, feel free to add a comment below. In the next post we will learn how to make the most of your WordPress theme’s demos.
Lastly, thanks go to ThemeForest reviewers Rich Tabor and Scott Parry for fact-checking!