The pre-requisites are:
A. Download Cvespresso Lite for free here. You will receive your download link by email.
B. A zip file will be downloaded. Please be aware that this zip file is NOT the file you should install.
C. Unzip your download file. A folder will be created. Inside this folder you will see several folders/files.
A. In the WordPress Admin, go to Divi > Divi Library, then click on the “Import/Export” button at the top left of the page.
B. In the opening popup, click on the Import tab, then click on Choose file. In the window that opens, locate the theme options file in your downloaded package, by going to Import > 01. Layouts, select the file and click Open. Next, click on Import Divi Builder Layout and wait for the import to complete. This might take some time, depending on your webhost.
C. Open the page you want to install the layout on, let’s say “Home” or just create a new page. If you use an existing page, please be aware that loading this layout will wipe out the current content of the page!
D. Once inside the page click on “Use the Divi Builder” if it is not yet enabled. Once enabled, click on the “Load from Library” tab, then in the opening popup, click on the “Add from Library” tab and select the Layout you’ve just imported in step B.
E. If you don’t want the main navigation of your page to appear, do not forget to select “Blank Page” in the Page Attributes (box located on the right hand-side of the page).
E. Hit Publish or Preview
Voilà! But we are not one yet, because if you look at your page now, you will notice that it doesn’t quite look like in the demo. Read on to fix that.
A. Locate the CSS file in your downloaded package, by going to Import > 02. Css, select the css file and Open it with your favorite text editor. Please make sure you don’t open it with an application that will add some styling to it. The default text editors on Mac / PC / Linux should work fine.
B. Copy all the code inside the file.
C. Now in the WordPress Admin, go back to the page where you’ve imported Cvespresso Lite layout, and click on the Portability Options icon at the top right corner of the Divi builder (the icon with 3 horizontal lines).
D. In the opening popup, paste the Css code you’ve copied from step B into the Custom Css field, then hit Save.
E. Publish or Update the page.
- For the most part, styling can be done the usual way inside the modules of the Divi Builder. There are however styles that are set in the CSS file. Cvespresso Lite being a free Divi Child Theme, we will not give support on how to style it. However, it should be fairly easy for you to change the colors / fonts / sizes inside the CSS if you ever needed to, even if you have limited knowledge.
- The picture used for the portrait has to be square (i.e. with equal width and height dimensions) for the image to be rendered as a circle. If you you a rectangular image it will be rendered oval.
- The Social Icons use the Elegant Themes icon font. Therefore, in order to edit it, you need to click on the Text tab, once inside the text module in the Divi Builder.
- If you want to remove a social icon select the relevant line from the opening <li> to the closing </li> and delete it. I strongly advise you to Preview your page before updating / publishing, in case you are not sure you did it right.
- If you want to change a link, just change the link inside the href=”…” and replace the 3 dots in the example given here by your social url.