Installation Guide

Sunshine Vibes WordPress Theme

Thank you for your purchase of the Sunshine Vibes WordPress Theme!
Following is the installation guide to help you set up.


Once you’ve downloaded your purchase, you’ll find these files inside:

  • Elementor-Kit
  • Sunshine Vibes Canva Templates PDF

Edit the Canva Templates you received to have all your styled backgrounds and images ready to upload, when you go through editing the pages of the theme.

If you need to hide your site while you’re working on it, I recommend installing the “Coming Soon” plugin by SeedProd. You can set a coming soon page to show if anyone visits your site while you’re working on it.

Please follow the steps below to install the theme, as well as the instructions on how to edit all the different parts of the theme.

Steps To Follow
1. Install Elementor Pro
2. Import Theme
3. Set Your Home and Posts Pages
4. Set Your Logo
5. Organise Your Menus
6. Edit the Header Section
7. Edit the Footer Section
8. Add your Instagram Feed
9. Change Colors & Fonts
10. Edit Pages

1. Install Elementor and Elementor Pro

Firstly you will need to Install and Activate the regular Elementor plugin. From your WordPress Dashboard go to Plugins > Add New. Use the search bar to find Elementor. Install and activate.

For this theme to work, you will also need Elementor Pro. This is a yearly subscription to a Plugin that you will need to install to your WordPress site.

Once you have purchased Elementor Pro, they will provide you with a zip file and a license key.

In your WordPress Dashboard go to Plugins > Add New > Upload. Upload that zip file and Activate it.

2. Import Theme

Go to Elementor > Settings > Experiments Tab > Import Export Template Kit. Make sure that dropdown box is set to “Active” and click the blue Save Changes button at the bottom of the page.

Go to Elementor > Tools > Import Export Kit. Click on the green “Start Import”. Upload the file you received in your download from me.

They may show you plugins that are recommended to install with this theme. Click next.

Select all 3 options and click Next.

3. Set your home and posts pages

In your WordPress Dashboard go to Settings > Reading.

Make sure the Homepage is set to the Sunshine Vibes “Home” page, and the Posts page is set to the Sunshine Vibes “Blog” page.

4. Set Your Logo

In your WordPress Dashboard go to Appearance > Customize. Click on Site Identity and click “Change Logo”. Upload your logo image (ideally a PNG on a transparent background). Publish your site, and click the cross top left to go back to WordPress.

5. Organise Your Menus

There are 3 menus in the Sunshine Vibes theme, one at the top of the site and two at the bottom.

To edit these, go to Appearance > Menus. In the top drop down select which menu you want to edit.

To create a drop down, drag page links slightly to the right of the link above them.

6. Edit The Header Section

In your WordPress Dashboard go to Templates > Theme Builder. Click on the Header section and click Edit.

Ignore all the parts showing under the logo area (where it says drag widgets here, and Sunshine Vibes Header).

The only part of this section you should need to edit are the social media links.

7. Edit The Footer Section

In your WordPress Dashboard go to Templates > Theme Builder. Click on the Footer section and click Edit.

The first blank section is for your Instagram feed, see the next step for how to add that in!

8. Add your Instagram Feed

The Instagram Feed is made with a plugin called Smash Balloon Social Photo Feed.

Go to Plugins and if you don’t have that plugin installed, go to Add New > search for Smash Balloon > Install and Activate the Smash Balloon Social Photo Feed plugin.

Down the left side menu of your WordPress dashboard towards the bottom you will now see a link saying “Instagram Feed”. Click on that. Follow the directions to set up your Instagram feed.

You will need to have 6 columns and 1 row.

For the mobile layout I recommend 2 columns and 2 rows.

Click Save, and you need to get the Embed code.

Get the Shortcode that they provide, and go back to edit the Footer (as mentioned in step 7).

Add the Shortcode into the HTML widget you see at the top of the Footer section.

9. CHANGE Colors & Fonts

To edit colors and fonts, in your WordPress Dashboard click Pages and click the “edit with Elementor” link next to one of your pages (I recommend going through the Home page. The Elementor editor will open up.

Click the 3 menu lines in the top left corner, then click Site Settings.

You will see there is a tab for Global Colors, a tab for Global Fonts and a tab for Typography. This is where you change colors, fonts and heading sizes.

10. Edit Pages

To edit a page, always start from your WordPress Dashboard. Go to Pages and click the “Edit With Elementor” link next to the page you would like to edit.

More Tips

How to Add Custom Fonts:

In your WordPress Dashboard go to Elementor > Custom Fonts.

Click the Add New button and follow the prompts to upload your custom font.

Follow Step 9 above to go back into edit the Fonts of the theme, to choose which text you want in your custom font (eg. change the H3 (heading 3) text from the Rose All Day font to your own custom font).

If there is anything else you need to know about editing the theme, please reach out to me!