This theme features the latest improvements, implementing the Customizer API in the theme to enable backgrounds, colors and much more to be changed in the live previewer.
- Purchase and Download ShelleyPro and note the path to the shelleypro.zip file
- First go to Appearance -> Themes & click “Add New” then click “Add New” then “Upload New” and choose the zip file.
- Click Install (If you encounter an error message during install, please report it to our Support section)
- Once installed, click activate and the theme is now installed and running!
Setting up ShelleyPro
Once installed, your website should now display the default homepage already.
Before changing any of the Theme Customizer settings, there are a few general settings we recommend all users set up.(Optional)
- Go to “Appearance -> Menus” and set the desired menu to “Primary Menu” like so:
- Go to “Settings -> Reading” – The demo version uses “Your latest posts” as the frontpage display
- Go to “Settings -> Permalinks” and configure accordingly to your wishes. Press save even if you have changed nothing.
Okay, good job! Now that is fixed we can progress into customizing the colors, load orders and filling out all the data that you want.
With more than 100 different options, controls and settings for colors, sections, text and more it is possible to create virtually any type of site with ShelleyPro. Remember that it is not necessary to use the “Member Section” for members if you rather would wish to display other things relevant to your website instead, there is nothing stopping you from naming after your own schemes, but in this tutorial and for ease, we will refer to all sections by their given name in the customizer.
This is what you will be greeted with when opening ShelleyPro theme customizer options.
- Load Order
- Value Counter
- Call To Action
- Youtube Section
- WooCommerce Product Section
- Google Maps Section
- Footer (for disabling credit link)
Customizing Colors in ShelleyPro
This is a screenshot of the first few color options, these should be quite straight forward and self explanatory, remember than when customizing the colors, if you browse to the frontpage in the live view editor, you will see your changes happen instantly in the browser.
Note that if you choose both a background-color, and set a background image, that the image will take first priority
Customizing the Load Order of the frontpage in ShelleyPro
In this section you have the option of disabling/enabling each individual section displayed on the frontpage. Choose in what order they should be displayed, and see your changes live!
Do not be afraid when changing the load order, some of the backgrounds are not matching correctly anymore, this can be changed in the colors once you are done setting up the desired load order.
Customizing the Hero Section in ShelleyPro
Customizing the Intro Section in ShelleyPro
Customizing the Members Section in ShelleyPro
Customizing the Services Section in ShelleyPro
Customizing the Portfolio Section in ShelleyPro
Customizing the Testimonials Section in ShelleyPro
Customizing the Values Section in ShelleyPro
Customizing the CTA Section in ShelleyPro
Customizing the Youtube Section in ShelleyPro
Customizing the Products Section in ShelleyPro
Customizing the Maps Section in ShelleyPro
ShelleyPro is released by Purelythemes.com as a GNU GPLv2 compliant theme.
ShelleyPro uses the following 3rd party libraries:
- jQuery MIT License
- BootStrap MIT License
- FontAwesome License
- Roboto Font Apache License
- Slicknav MIT License
- Waypoints MIT License
- jQuery Counterup GNU GPL v2
- Queryloader2 MIT License
- jQuery Wow Animate MIT License