How to Install Mocha into Weebly

Mocha needs to be installed over a current Weebly website. If you already have a Weebly website, you'll be installing Mocha over that website. If you don't already have a Weebly website, you'll need to create a new one. These steps go over both scenarios.

Step 1: Download Pristine

(You may have already done this) Simply download the theme via the download link on your purchase confirmation page, or through the email you received. Save this file somewhere on your computer.

Step 2: Extract The Downloaded File

Open up the downloaded .zip (called either "Mocha-Standard.zip" or "Mocha-Developer.zip" and extract its contents.

You should see a few PDF's and a folder that says "upload what's inside" (this is where the actual theme file is, the one that you will be uploading into Weebly).

Step 3: Do you have a current site? If not, create one.

To install Mocha, you will need to install it as a theme on top of an existing Weebly website. If you have one, great! If not, simply create a Weebly site with any default Weebly theme and continue on to step 4. It doesn't matter which default theme you choose, just choose any.

Step 4: Click on "Theme" and "Change Theme"

In the Weebly editor for your Weebly website, click on the "theme" tab. Then, click on the "Change Theme" button in the left sidebar. This will take you to a screen with all the themes.

Step 5: Click on "Import Theme"

In the theme gallery, click on the "import theme" button in the upper righthand corner of your screen.

Step 6: Upload The .Zip File That Is Located Within The "Upload What's Inside" Folder.

After clicking on Import Theme, you will see a pop-up appear asking you to select a file for upload.

Open the "Upload What's Inside" folder and upload "mocha-theme-1.zip". ‍

Do not upload the entire Mocha folder you downloaded (with the instructions and license PDF's), as this will yield a "Missing HTML" error. Only upload the mocha-theme-1.zip file within the "Upload What's Inside" folder.

Users often mistakenly upload their entire downloaded theme folder. Don't do this--it will generate an upload error. Instead, be sure to navigate to the downloaded folder, open up the "upload what's inside" folder, and upload the .zip file that's within this folder.

Step 7: Give It a Few Moments

After you select the theme for upload, it will seem like nothing is happening. Give Weebly a minute or two, as the theme is uploading in the background. Upon successful upload, the popup will disappear and you'll be taken to the "custom themes" page.

Step 8: Locate and Select Mocha

After the theme is done uploading, you will be taken to the "custom themes" page where you should see the Mocha theme. Click on the blue "choose" button. That's it! From now on, your Mocha theme will live here, in the custom themes section of your theme library. You will be taken to your Weebly website with Mocha applied. But we're not done yet--continue reading below.

Be Advised: After Installation, We Recommend Refreshing Your Browser.

Step 9: Mocha is Now Installed!

You site should now look like the image on top. Mocha is now installed! Mocha won't look like the demo right away, you'll need to add your own content and images, and customize the settings. The next tutorial will focus on what to do next.

Why Doesn't My Theme Look Like The Mocha Demo?
After you install Mocha, you may notice that your Weebly site looks different from the Mocha demo. This is because unfortunately Weebly does not allow theme providers to sell themes with pre-existing content.Our Mocha Demo runs on the same exact Mocha theme, but with content and images added. As you add content to your website, it will look closer and closer to the demo.If you want your website to look just like the demo, with placeholder text and images, we offer a service called Demo Content Creation. Through this service, one of our designers will remotely login in to your site and manually build all the demo content onto your site within 24 hours.

What To Do After You've Installed Mocha On Your Website

After you've installed Mocha on your Weebly website, there are still a few things you should do to make sure you have a smooth building experience.

Refresh Your Browser

Be sure to refresh your website browser, this will clear any temporary artifacts from the previous theme.

If You Created A New Weebly Website...

If you created a new Weebly website and chose a default Weebly theme right before you installed Mocha, you may have a bunch of placeholder content from the previous default Weebly theme present in Mocha.

If so, the quickest simplest solution is to simply delete the pages with the content from the old theme. Then, create a new page with your desired header type, and you'll have a fresh new page without any existing content from the old theme.

If You Installed Mocha Over Your Existing Weebly Website...

If you installed Mocha over your already-existing Weebly website, your content most likely transferred through.

If you click on a page and you don't see your content: be sure to set its header type to "Header." You can change the header type of a page by going into "Pages" and clicking on the relevant page.

By setting the header type to "Header" you'll be able to see all of your previous content.

‍