Rise & Shine

Installation Guide

Thank you!

From all of us at Elegant Child Themes, thank you for purchasing Rise & Shine! This is by far our most aggressive child theme to date and we’ve spent a lot of time pushing the Divi envelope to deliver an awesome, feature packed design that you and/or your clients will love! Not to mention it will save you countless time and money in the process. Just follow the steps below to install Rise & Shine and if at any point you have any questions, just shoot us an email and we’ll be happy to help.

Before we go any further, please note that Rise & Shine was built specifically for use with Divi by Elegant Themes. In order to install this child theme, you must first purchase a membership to Elegant Themes and download the Divi theme package. If you’ve not yet purchased a membership, visit http://elegantthemes.com. Ok, let’s get started!

Installation Instructions

Step 1: Installing the child theme

Once you’ve downloaded the Divi theme package, login to your WordPress website and go to Appearance > Themes. Find and upload the Divi parent theme and activate it.

Just like you installed the Divi parent theme, install & activate the RiseandShineChildTheme.zip child theme located in your Rise & Shine download package.

Screen Shot 2015-12-11 at 1.37.28 PM


Step 2: Installing the plugins

Once you activate Rise & Shine, you should see a notification at the top of your screen prompting you to install 5 recommended plugin: Divi Login, Recipe Card, Restaurant Reservations, WooCommerce & WordPress Countdown Widget. Simply click the “Begin installing plugins” link to get started.

On the next screen, install & activate the necessary plugins. You may be prompted to setup WooCommerce if it’s not already installed. Just follow the prompts to complete the setup. Once all of your plugins have been installed and activated, you’re good to go!

Screen Shot 2015-12-11 at 1.26.29 PM

Step 3: Importing the sample content & library

From your WordPress admin panel, click the Tools > Import link in your WordPress Dashboard. This will bring you to a new page with a list of import types. Click the “WordPress” link to download and install the importer.

Once the importer plugin has been installed, click the Tools > Import > WordPress link again to open the importer. You will see an option to upload an XML file. Click the “Choose File” link and locate the riseandshine-content.xml file from the Import folder of your Rise & Shine download package. Complete the import dialog to finalize the import and add all pages, posts & content.

Before leaving the import page, you’ll want to import the Divi Library as well. Just as before, click the “Choose File” link and located the riseandshine-library.xml file and complete the import to add the items to your library.

Visit Pages or Posts to confirm that your sample content has been imported. Also visit the Divi > Divi Library page to confirm that your library items have been imported.


Step 4: Import the Customizer Settings

If you would like to match the look of the Rise & Shine demo, you’ll need to import the customizer settings. Located inside the Imports folder of your Rise & Shine download package, you’ll find a riseandshine-customizer.dat file. This file contains the theme’s live demo Customizer options.

To import these options and set up your Customizer like the demo, be sure that you’ve successfully installed and activated the Customizer Export/Import WordPress plugin (via Step 2). After installing and activating the plugin, go to Divi > Theme Customizer and look for the Export/Import section – typically located at the bottom of the screen.

Click to find the riseandshine-customizer.dat file and add that file into the uploader within the Export/Import section of the Theme Customizer and press the “Import” button.

Screen Shot 2015-12-11 at 1.51.54 PM


Customizing Rise & Shine

Split Columns

Our unique split column layout is featured on the Rise & Shine homepage and throughout the Menu page. Swapping out images and text is all done via the module settings. 

To replace the image, go to the row module settings > Advanced Design Settings and choose a new column background.

To replace the content, simply open up the text module and edit as needed.

Restaurant Menus

Screen Shot 2015-12-11 at 2.32.25 PMPerhaps the most unique and custom feature of Rise & Shine, the menu overlays are easy to update and customize. When you open up the Menu page you’ll see separate section blocks for each menu section.

The first row module is made up of the split column section, similar to the layout featured on the homepage.

To replace the image, go to the row module settings > Advanced Design Settings and choose a new column background.

To replace the content, simply open up the text module and edit as needed.

The next row module is a what we call, the “Flyover Menu”. This is an overlay screen that appears when you click the “View Menu” button in each menu section.

Divi shortcodes are used to display the menu in a 2-column layout. For a list of all shortcodes available, click here.

There are also several neat effects that you can achieve by altering the classes over the flyover menu. You can preview each effect by clicking the View Menu button on the different menus of the Rise & Shine demo. Below is a complete list of effects that can be achieved by adding it as a class in the flyover menu row module:


Be sure not to remove the fw-menu class as this will break the functionality of the menu overlay.

Screen Shot 2015-12-11 at 2.59.16 PM

Subscription Module

The custom single line Global Subscribe Module is featured at the bottom of every page throughout Flourish and is a great and subtle way to encourage your website visitors to subscribe to your newsletter. More information about configuring the Subscribe module can be found here: http://www.elegantthemes.com/gallery/divi/documentation/newsletter/

Restaurant Reservations

Rise & Shine integrates the popular (and free!) Restaurant Reservations plugin by NateWr. While we’ve overhauled the styling to seamlessly integrate with Rise & Shine, the functionality is the same. For instructions how to use this plugin, please visit: https://wordpress.org/plugins/restaurant-reservations/

Countdown Timer

While there is a countdown timer prepackaged with Divi, unfortunately at the time of the release, it is not currently available for use within the full-width modules. We wanted to make the event sliders a little more dynamic so we’ve featured the simple, but effective WordPress Countdown Widget by Metin Saylan. To implement a countdown within a slider or full-width module, simply use the following shortcode example:

Screen Shot 2015-12-11 at 2.10.11 PM

More information about the WordPress Countdown Widget plugin can be found here: https://wordpress.org/plugins/wordpress-countdown-widget/

Recipe Card

We decided to incorporate Recipe Card by Yumprint as a neat feature for restaurants, food critics or bloggers to use to interact with their customers. Add recipes with ease via a simple shortcode, easily generated from the Recipe Card icon in the WordPress editor toolbar.

More information and instructions for using Recipe Card can be found on their website at: https://wordpress.org/plugins/recipe-card/

WooCommerce Shopping Cart

Rise & Shine features a customized WooCommerce shopping cart experience. Starting from the custom shop page all the way through, every element has been tweaked to match the overall look & feel of Rise & Shine. More information and in-depth tutorials can be found at: http://www.woothemes.com/woocommerce/

Custom Login Screen

The custom login screen is made possible with the help of the Divi Login plugin by Stephen James of Divi.space. We have customized the look of the login screen to be cohesive with the look of Rise & Shine but you can easily update the background image and colors by going here:

Plugins > Editor > Select the Divi Login plugin > Select DiviLogin/login-styles.css

The logo used on the login screen is the same logo uploaded to Divi > Theme Options > Logo

To change the background image used, simply replace the image url for the .login class. 

If you would like to change the color from the Rise & Shine gold to your own color, simply find and replace all references to the hex code #dfa91f.

Once you’re finished editing or adding your styles, click Update File to save your changes.


Coming soon!

Terms & Conditions

Please note that many images and icons used in this theme are copyrighted and must be purchased prior to use. You can find most photos available at http://dollarphotoclub.com. The original homepage & inside PSD layouts are available for download free. Click here to download.

All designs are the intellectual property of Elegant Child Themes and may not be sold, redistributed or given away. We ask that you respect the hard work we’ve put into this custom design and not send this file to others. Due to the nature of this product, refunds are not available. If you have additional questions, please visit us at http://elegantchildthemes.com.

Disclaimer: Rise & Shine is a child theme created by Elegant Child Themes for Divi, created by Elegant ThemesRise & Shine is not a licensed product of Elegant Themes. Elegant Child Themes is not affiliated with or sponsored by Elegant Themes.