WordPress + Elementor Tidbits - You might find an answer to a ? that has stumped you

Mosaic: Install & Setup Elementor Styles & Templates

There is a video in below that will guide you through setting up the templates you purchased. Make sure to remember where you downloaded the ZIP file from your purchase. You will need to access to that file on your computer to complete the initial steps. View the video to get started or you can follow the written steps below (for those who like reading!)

  • There are a few things to do first before getting started:
    • Install the Page Builder Framework from the WordPress.org repository – https://wordpress.org/themes/page-builder-framework/. Activate it once you have installed it on your site. Some of the Elementor styles built into this kit are created for this theme specifically. **You can use any other theme you choose…you might just find a few settings need tweaking like the main Blog page (if you don’t use a built in template layout).
    • Install Elementor (FREE) and Elementor (PRO) – you will need to purchase the PRO version for the style kit, header & footer to function properly. If you have not already purchased, you can do so HERE.
    • Install Happy Add-Ons for Elementor (FREE) to gain access to some special icons and design elements for the pre-designed pages.
    • Make sure all plugins & WordPress are updated to the most recent version! This is important, because my kit is set up to work with the most recent version of the recommended plugins & theme – you want to do this to make sure everything works properly right from the start.

Once you go through the steps outlined in the video, your site should start to take shape with the new design. You will have a new header, footer and some page styling visible when you view the front-end of your site. Next step is to further customize areas of the site.

FIRST:

Unzip your Mosaic download file! The ZIP file you downloaded after purchase contains multiple files (Mosaic_Pages.zip, Mosaic_Styles.zip and Mosaic_Instructions.pdf). You will want to choose which files you plan to use before going further.

Mosaic_Pages.zip – this file contains the pre-designed pages of Home, About, Contact that come with the kit. If you do not want these page designs then you can skip using this file.

Mosaic_Styles.zip – this file contains the layout templates & all styles (fonts, colors, button styling, etc) that create Mosaic. This will you will want to definitely use this file, as it is what makes Mosaic so lovely!

Mosaic_Instructions.pdf – this is an instructions file that brought you here! Yay, we are thrilled you came.

SECOND:

Go to Elementor >> Tools, you want to click the green “Start Import” button.

A box opens up so you can navigate on your local computer to the folder where you saved your Mosaic ZIP file(s). It is best to start with Mosaic_Styles.zip file, since this contains all styles & templates that you will need as a foundation for your site’s new look.

After uploading this ZIP file, you will land on this page confirming what you have just uploaded:

Click screenshot to enlarge

THIRD:

Your site will start to take shape and the new header/footer will show. DO NOT worry if the colors & fonts are not showing properly, the next step will turn all of that on.

ADD YOUR LOGO – go into Appearance >> Customize so we can upload your logo into the theme. Click Header >> Logo to load up your logo file. Once your logo is uploaded, click PUBLISH to save your changes and then view the front-end of your website. You’ll see that the color, fonts and all other styling is in place.

FINALLY:

Go to Elementor >> Tools, you want to click the green “Start Import” button.

A box opens up so you can navigate on your local computer to the folder where you saved your Mosaic ZIP file(s). It is best to start with Mosaic_Styles.zip file, since this contains all styles & templates that you will need as a foundation for your site’s new look.

After uploading this ZIP file, you will land on this page confirming what you have just uploaded: