This document covers the installation, set up, and use of this theme and provides answers and solutions to common problems. We encourage you to first read this document thoroughly if you are experiencing any difficulties before contacting our support team.
If you have any questions that are beyond the scope of this document, feel free to ask us via our dedicated help center.
After downloading the theme package open the folder named “essay-package”, un-zip the folder if it is not already so. Inside the theme package folder you will find the following files:
To upload through your Dashboard, select “Appearance” and then “Themes”. Next, select the “Install Themes” tab at the top of the page and then select the “Upload” link, right above the search field. Choose your file and select “Install Now”. Once the theme is fully uploaded and installed, click “Activate” to activate the WordPress theme.
The theme files will be stored on your server in the
When uploading your theme with the installer, please ensure you are uploading the theme .zip file, not the entire package you downloaded. In this case, you will be uploading essay.zip.
To manually upload your new WordPress theme, login with your credentials to your website and locate the wp-content folder in your WordPress install files. Upload the un-zipped Essay folder into the: wp-content/themes folder.
Once uploaded, activate the theme by heading to the “Themes” menu in the WordPress Dashboard. Locate the Essay theme and hit “Activate”.
Customizer Options Import
Located inside the
/customizer folder within the package contents, you'll find a essay-export.dat file. This file contains the live demo's Theme Customizer options.
To import, first install and activate the Customizer Export/Import WordPress plugin, which is available as a free download. After you're successfully running the plugin, head to your Theme Customizer and look for the Export/Import section. Import the
essay-export.dat file with the uploader within that section and hit "Import".
Find out more on installing and activating plugins.
Premium Theme Installation
If you're looking for WordPress theme installation and setup to look exactly like the live theme demo - then we're here to help. Fast & simple for only $49.
Our in-house team of professional developers will install the theme, upload the demo XML file, and setup your website exactly like the live demo. Frustration free. Complete your purchase of the Premium Installation service by clicking the link above and send us your deliverables.
- Domain name
- FTP information
- WordPress admin credentials
- Theme files or ThemeForest item purchase code
If you have a problem with the theme or found a bug, please let us know via our official Help Center. We take pride in our customer support and we will do what we can to assist you. If you are experiencing a theme issue, please first turn off all third party plugins to see if the problem persists.
We are happy to help with setup & bugs you may stumble upon though we cannot support CSS customizations.
Essay has the following templates built into the theme and can be applied by creating and saving a page in WordPress.
- Contact Template
- Default Template
- Archives Template
- Site Map Template
Essay includes support for page hero areas. You may elect to display fullscreen hero areas on your pages and posts via the Theme Customizer, or leave it off and opt-in on each individual page/post that you would like to utilize the feature on. Background images are added via the Featured Image meta module, located below the Publish and Page Attributes metaboxes, on the right side of your page editor.
Hero Area Effects
From within the Theme Customizer you may select to apply a genuine blurring effect to your hero areas, enable a parallax effect and add a title emphasis.
From within the Theme Options panel of the Customizer you'll find the Blogroll layout option. There are six default layout options that are applied to the blogroll, search and archivial pages. These layouts are basically different grid systems. Play around with them and choose the one that best suites you, then hit the "Save & Publish" above.
On the blog index views there are two different types of pagination options, infinite scrolling and the standard left/right navigational arrows. To activate infinite scrolling, simply install and activate the JetPack plugin, then enable the Infinite Scroll module from within the JetPack Settings.
Number of Posts
The number of posts setting is entered on the
WP Dashboard > Settings > Reading admin page. We strongly recommend entering an integer that looks great on your particular blog layout.
Essay sports both standard and video post formats. To change your post format, select your desired format from the Format metabox, located beneath the Publish metabox to the right of your post editor.
Once you've selected the video format, you'll find additional metaboxs appear below your post editor. Include the neccessary embed or direct .mp4 video URL meta for your post and hit "Publish".
Essay has a couple built-in compatibilties with some modules of the JetPack plugin. Once you've installed and signed in with a WordPress accout, you may turn on/off various elements.
Creating a Gallery
To create a gallery, click on the Add Media button above the page or post editor. Then click on Create Gallery, which is located at the top left. You may now select as many pictures as you'd like to be included in the tiled gallery.
Once you've selected your pictures, hit the Create a new gallery button on the bottom left. Lastly, modify the Gallery Settings on the right hand side of the modal. We suggest setting the "Link to" value to none and the "Type" to either tiled mosiac or square tiles. Now hit Insert Gallery.
To set up the Contact Template, simply create a page using the "Contact" template and publish it. Within the Customizer's Theme Options panel you'll find a Contact section. This is where you'll add your contact email address and customize the Contact Button if you wish.
- Flickr Photostream Widget
- Video Embed Widget
Bean Plugin Widgets
The following widgets are provided with our compatible array of free plugins.
- Bean Tweets Widget
- Bean Instagram Widget
- Bean Social Widget
- Bean Dribbble Widget
- Bean 500px Widget
Using the Widgets
To employ a widget, simply go to your Widgets editor (located in your WordPress Dashboard in the “Appearance” menu) and drag your widgets into the specified widget areas.
Accessing the Customizer
To access the live Customizer, you may select the Customize button in the admin bar dropdown or select
"Customize" from the Dashboard menu. Note that you must be logged in as a site administrator in order to access the controls.
Set your site title, logo and the site icon.
2. Theme Options
This section contains the options for the theme. The sections within this panel are General, Layout, Blog and Contact
Enable the jquery fullscreen hero area on posts and pages, the blur effect and hero parallax effect. Also decide if you'd like the page title highlight bars on the post and page hero areas.
Select one of six blogroll layout grid options and set the page widget area column width (singular or dual columns).
Enable drop caps on the single post pagesl, enable post categories and enable post tags.
Set your contact form email address and customize the form submit button.
Easily manipulate the theme accent color CSS elements throughout the theme with the color picker in this tab.
3. CSS3 Filter
Within the Colors section of the Customizer, you'll find a select field to set an optional CSS3 Filter value (Black & White and Sepia). If activated, your blogroll items will default with the selected filter active.
Please note that this only works in modern browsers and does not function when using blurring.
To install any of our free plugins, head over to our website and simply download the plugin files. Once you’ve successfully downloaded a zip file, head to your WordPress Dashboard and select “Plugins > Add New > Upload.” Add the zipped file in the field there and click “Upload.” Upon a successful upload, you’ll be prompted to activate the plugin.
Essay is compatible with many of our custom developed WordPress Plugins. Head over to our website and download our free plugins now →
- Bean Shortcodes
- Bean Tweets
- Bean Instagram
- Bean Social
- Bean 500px
- Bean Dribbble
- Bean Pricing Tables
- Bean Registry
Each graphical asset has an associated retina image that should be modified when customizing assets in this theme. You will find these retina assets in their respective image locations.
Additionally, if the image size has changed, the background-size property of the associated class in /style.css must be modified to reflect those changes. You can find this in the Retina CSS section at the very bottom of the main stylesheet.
HD Retina Assets
Essay has particular @3x CSS located in mobile.css, which utilizes the images appended with @3x ex: firstname.lastname@example.org within the
/assets/images/retina folder on HiDPI screens.
If you'd like to add more @3x assets, simple save your image at 300% (we use Photoshop) and add it to the
/assets/images/retina folder. Then look for the following CSS at the bottom of mobile.css and add your CSS element with a background image pointing to your new image:
You may need to add the
background-sizeattribute to the element if you have not already added it to the standard retina query.
Easily retina-fy your logo simply by uploading an image with "@2x" appened to the file name. For example, upload an image named email@example.com (that is twice the size you would like it to be on the site) and it'll automatically have it's width divided by two.
If you've requested and entered your theme license key, then you'll automatically be notified of any theme updates as we push them. This is the most effective method for getting updates pushed to you quickly and effienctly. Read more about theme licenses.
Check for Updates
To check your theme version, click the live changelog link below and check the version number at the top of the changelog.txt file:
Relay the changelog version at the top of that changelog.txt file with the version in your WordPress Dashboard > Appearance > Themes section to see if your theme files are up to date.
If you are in need of the update, download the current build from the location you purchased the theme from (either ThemeForest, Creative Market or via your account dashboard) to install the updated theme.
If you have an active license key applied to your theme, you will receive live update notifications to which allows one-click updates directly from your WordPress dashboard.
If you have not customized the original theme files then you may simply drop the updated theme folder contents into the theme folder on your server – which is located in wp-content/themes/essay.
If you wish to upload the entire updated theme as a separate theme, ensure you:
- Rename the updated theme’s folder (different from the current theme)
- Drop the renamed theme folder into wp-content/themes
- Switch to the new theme via your WordPress Dashboard
If you choose to upload the whole theme and switch to it, you may lose your Theme Customizer data and will have to add those back in.
FTP Selective Updating
On the other hand, if you have customized some files in the core theme contents, you should consider selective updating, which simply means updating only the files that are pointed out in the theme’s changelog.
There are a couple programs out there that will allow you to compare versions of files, in order to catch customizations you may not remember. Some recommended programs are WinMerge (Windows), Kaleidoscope (OSX), and handy GitHub (OSX) & (Windows).
Overall, the safest and cleanest way to update your theme is to leave your currently modified theme on your server/site as is, rename the folder of the newly updated theme, upload the new theme, and modify that to match your original custom work. In this way, if something has gone wrong with the new version, you’re just a few clicks away from getting things back to how they originally were.
Please note that ThemeBeans is not responsible for content loss, database errors and such, which may happen to your WordPress install upon an incorrectly applied theme update.
Locating your ThemeForest purchase code
First, you need to retrieve your theme purchase code from your ThemeForest license certificate. Refer to the image below to find your purchase code.
Request your theme license key
After locating your item purchase code from ThemeForest, complete the license request form. Once you’ve sent us your request, we’ll email you a license key for your verified theme purchase.
Please only submit one request per purchase code. It may take up to 24 hours to process your request and generate your license key.
Activating your license key
Once you've reccieved your license key you may enter the key on the "Theme License" dashboard widget, located on your
Once your license key is entered, hit the "Save License" button - then the "Activate" button that appears after the page refreshes. Upon a successful activation you’ll see a green “Active” tag next to the widget title.
What is the license key for?
It is important to keep your license up to date in order to continue getting updates for your ThemeBeans WordPress theme and support for any issues you may encounter. Renewing your license grants you access to support and updates for six months, including all updates for bug fixes and feature introductions.
Without a valid theme license, you will be unable to get support and auto-update notifications will not function.
If your key is not applied after hitting the Activate button, simply re-enter the key and try again. Sometimes it takes a few tries to properly establish a connection with the activation server.
What if my license key has expired?
After six months, license keys may be renewed at a 50% discount from the original purchase price. You will get a renewal notification in the Theme License dashboard if your license is about to expire, or has indeed expired.
If you'd like to add another menu location to use in the theme, search for the
bean_theme_setup function in your theme's functions.php file and copy that whole function to your child theme.
bean_theme_setup function you'll see the standard register_nav_menus function. Simply create another copy/paste another line with a unique location identifiers and name. The code below creates two separate menus locations that are selectable via the
WP Dashboard > Appearance > Menu page.
Adding your menu to the theme.
Now that you've created the menu, you can use it in your theme's files. As always, we suggest utilizing a child theme to make file modifications.
The code below is an example of the wp_nav_menu function that displays your created navigation window. There is quite a few parameters associated with this function, so take a look at it's official reference to see all that you can do.
Add Image Sizes
If you'd like to add another image size for your WordPress instance to automatically size for, search for the
bean_theme_setup function in your theme's functions.php file and copy that whole function to your child theme (if you have not already done so).
You'll want to look for
add_image_size within the
bean_theme_setup function and copy/paste a new line in. Below is an example of the
Note that the first numeral value is the image's width and the second is the height. Read more about the parameters of the
add_image_size function on the WordPress reference site.
Using image_size in your theme.
It's pretty simple to utilize your new image size within your theme templates. Here's an example using the above
Note that you will need to regenerate your images if you're trying to create an image size for images already uploaded to your WordPress Media Library.
Files & Sources
These are the primary CSS files used for general front-end styling. Use these to customize your theme even further.
- style.css primary stylesheet
- style-min.css minified primary stylesheet
- fitvids www.fitvidsjs.com
- photoswipe www.photoswipe.com
- vague www.gianlucaguarini.com
- nprogress www.ricostacruz.com/nprogress
Template PSDs and image asset source files are included within the theme's
/sources folder. These files contain the necessary elements for customizing Essay even further.
Our Focus is to design & craft the most proficient and trustworthy themes and plugins available in the WordPress eco-system.
Our Philisophy is that each product our team builds is thoughtfully executed with a simplistic and intuitive focus, down to the last line of code.
We strive to maintain a strong symbiotic relationship with the core WordPress CMS and our team diligently updates each theme and plugin to ensure seamless update transitions. All in all, we like to keep our products well oiled and running smoothly.
Our latest premium WordPress themes. Each theme in our collection is meticulously crafted to afford the best user experience possible, for novices & developers alike.