Code by Day | Explore By Weekend

Divi Handmade Child Theme by Pee-Aye Creative

Home » Docs » Divi Handmade

Documentation & Support

Divi Handmade

Installation Instructions

Preparation

Before you begin, make sure you have the Divi Theme by Elegant Themes installed and active. This is necessary since our product is based on Divi. After that, go ahead install your new child theme. Disclosure: The link to Elegant Themes is an “affiliate link” which means if you click on the link and purchase Divi, we will receive a commission.

Download

After purchase, download the .zip file from your My Account page at https://www.peeayecreative.com/my-account/ or click the download link in your purchase confirmation email and save the file to your computer.

NOTE: If you purchased this product from a 3rd party marketplace such as the official Divi Marketplace, Divi Cake, or Elegant Marketplace, the process of downloading the file may vary slightly. You will always be able to download the file from your account, no matter where you made the purchase.

Child Theme Installation

A child theme is installed just like any other WordPress theme. From your WordPress Dashboard, go to Appearance>Themes>Add New and click on Upload Theme. Locate the .zip file on your computer and click Install Now.

Once the file upload is finished, you can click on Activate. You will then see Divi Handmade as the active theme in your theme panel.

Import The Demo Content

Demo Content Import Process

After you install and activate the child theme, you will see a new menu item on the left-hand side of your WordPress Dashboard called Divi Handmade. Hover over this and click Easy Demo Import.

Next, you will see a list of options that are checked by default. Theses items will import and be assigned during the demo import process.

Pee Aye Creative Divi Handmade Child Theme Demo Import Options

New Websites

For a new website installation, we recommend keeping everything selected. This will enable you to instantly have a site that is structured and set up just like the demo site. After reviewing the settings, you can click Import Demo Content.

Existing Websites

If you already have content, pages, menus, etc. on your site, you will want to proceed with caution. This will not override any existing pages, but it could affect things like the menus. To avoid any issues, simply deselect any items that you don’t want to import or assign. After reviewing the settings you want, you can click Import Demo Content.

At this point, it is recommended to go to “Settings>Permalinks” and click “Save.”

Your site should now look very similar to the demo at https://demos.peeayecreative.com/divi-handmade.

Photos & Resources

Photos

Our demo uses some stock photos, but it would be illegal for us to include those or give them to you as part of this product. Instead, we have replaced those stock photos with placeholder images. Actually, we do not recommend using stock photos on your site. Instead, you should take and use original photos anyhow, since it has been proven that stock photos are not considered trustworthy or helpful for brand. Your customers want to see your own photos.

However, we like to go the extra mile, so if there are some photos you like on our demo that you want to use, you can still do that by using the links below in the toggle. We tried to use either free or inexpensive stock photos for your convenience.

Free Style Guide

We also include a complimentary style guide for the template. This simply shows some of the color scheme, fonts, and styles used in the demo. Existing customers can download the style guide here.

Customizing The Site

The only thing left to do is replace the text with your own and the placeholder images with your own images. You may now customize anything on the site including the logo, images, color schemes, fonts, layout, etc. Divi makes it super easy to do all of this, but some the styling you see is from the CSS file.

Change Highlighted Menu Link

A few people asked for this, so we decided to post it here. If you want to change the highlighted menu item to the active menu item instead of the contact button, you can remove lines 131-148 in the style.css file of the child theme and replace it with the following snippet.

/*add a different color to the menu button*/

.pa-header-menu .et_pb_menu__menu>nav>ul>li:last-child>a {
   color: #ffffff!important;
}

.pa-header-menu .et_pb_menu__menu>nav>ul>li:last-child {
   border-left: none;
   background: #a78254;
}


/*hover color of the menu button*/

.pa-header-menu .et_pb_menu__menu>nav>ul>li:last-child:hover {
   background: #7ea391!important;
   transition: all .5s ease;
} 

Remove Or Replace The Leaf Images

The images in the top corners are easy to remove or place. You can access those by going to the Divi>Theme Builder header template. Then open the settings for the blue section, go to the Advanced tab, and in the Custom CSS you will find some code in the Before and After code boxes. Those have a URL to the image that is located in the WordPress media library. So first upload your image, then copy the URL from the media library and replace it there in the code. Or of course if you want to remove the images you can remove the code completely.

Divi Handmade child theme top left corner leaves
Divi Handmade child theme top right corner leaves

More Customization

If you want us to customize the site to match your branding, content, colors, and niche, please contact us for our current rates and we would be happy to help.

Changelog

1.0.2 - 2/4/21
-updated gallery lightbox hex colors
-fixed gallery lightbox image padding issue

1.0.1 - 1/27/21
-fixed issue with project page titles position
-fixed WooCommerce shop pagination stacking on mobile
-fixed WooCommerce shop product overlay from being on top of sales badge
-fixed issue due to Divi update where WooCommerce shop product columns changed to 2 columns on mobile

1.0
-initial release 

Last updated Feb 8, 2021 @ 3:57 pm

Get Support

Something not going well? We are happy to help!

All we ask is that you browse our documentation first before contacting us. We add anwers to every question we receive.

Is the question or issue related to WordPress?

If yes, please contact your hosting provider for help.

Is the question or issue related to Divi?

If yes, please be sure read the Divi documentation or contact Elegant Themes support.

Is the question or issue related to our product?

If you think the answer is yes, then please fill out the form and we will be happy to help get this resolved!

Context is essential for us to help you, so please review the suggestions in our Product Support Policy about how to ask for help and what information to provide to us.

Pin It on Pinterest

0

Your Cart