arnold on Sep 17, 2018
Working With Themify Skins, Demos and Templates
So far you should have bought a url, set up your hosting, installed WordPress in your hosting and then installed the Themify Framework into your WordPress.
The next thing we want to do is to learn how to set up the built-in layouts in Themify so we can quickly and easily get a website set up with little to website design experience.
The first thing we want to do is find the main skins in the Themify section of your dashboard so we can play around with the skins.
On the left hand sidebar click on “Themify Ultra.” Then Click the Skins and Demo Tab.
You are going to see a few different skins. You can import any one of these templates to get started. To import a skin simply click on it and the click “import” and then “proceed import” and then “SAVE.”
You can play around with the other skins but the only caveat is that you need to “erase” the demo data before importing a new template. If your website gets messed up and you see a bunch of menus at the top of your website then you need to go back and click “Erase” from the skin’s you imported.
The only extra step that we have is that some of the demos require additional plug-ins. After you click “Proceed Import” and “Save” your skin will load but for full functionality you must upload the plugins. To install the plug-ins you will need to download them from Themify and then upload them to WordPress.
How To Upload Themify Plugins Into WordPress:
Make sure you are logged into your Themify account. You can access your Themify account at this link:
If it asks you to pay then you need to log in or if you are already logged in, hit refresh. In the picture below, when you click on “Builder Contact” it should open up a download box where you can download the file to your computer. To load the Restaurant theme you will also need “Builder Maps Pro” so make sure you download that as well.
Once they are downloaded you can upload your plugins in the plugin section of your WordPress dashboard. In the Dashboard on the left side find the Plugins tab and then select “Add New”
Then at the top you will select Upload Plugin
Select the zip file that you just download from Themify (builder-contact.zip) and then click Install Now:
And Don’t Forget to Activate it!
Once you are done with that, do the same thing and upload the Builder Maps Pro Plugin zip file.
Additionally…If you look at the top of WordPress Dashboard you also may see something like this:
This means you have a plugin you need to install to make the Themify skin function properly. If you click “Begin Installing Plugin” it will take you through the process to auto upload that plugin.
Now we are going to be using a lot of features of these templates throughout the semester so I need you to go ahead and load 5 more plugins:
Please upload and activate the following:
- Builder Image Pro
- Builder Pricing Table
- Builder Slider Pro
- Builder typewriter
- Builder Timeline
Also, you should spend some time playing around with some of the other skins. The more you play with this the more comfortable you will be.
Remember that it is important to erase the data when switching to new themes or else you will get double loaded websites which will look weird.
Working With Themify Layouts
Besides pre-made templates we also have one more way to get a premade page loaded on our websites. This way is called layouts. To access these you need to do the following.
Let’s first create a new page to load a template onto. Go to your dashboard and click PAGES then ADD NEW.
Then give your page a title and click PUBLISH
Now let’s take a look at the page. In the top right click VIEW PAGE
Your page should be pretty plain. A snapshot of what my page looks like is shown below. You can see there is some coding errors on the right hand sidebar. The reason I get these errors is because I just didn’t configure a few things yet. We’ll get to that later. But your page may look something like this (depending on which skin you loaded):
The next step is to turn on the Themify builder. To do this look at the top central of your screen and simply click “TURN ON BUILDER”
Now that we are in the Themify Builder we want to load a layout so we can easily get a page set up. To do this click on the little webpage icon shown in the image below and then click LOAD LAYOUT.
You are going to see all the predesigned layouts that you can load into your page (in the image below). You can search for a certain type of layout or you can scroll through. If you want to see a detailed rendition of what the theme would look like then you can hover over a layout and click the magnifying glass. This will load a full screen layout in a new tab for you to preview.
You can load multiple layouts to try them out. When you click on the layout you can either replace everything that is on the screen now. Or you can add it to the bottom of an existing page:
Go through the tabs and load a couple of the layouts that you like. The next tutorial is going to show how to make changes in the PROFILE layout which can be see in the image above. Go ahead and load that and move onto the next tutorial.
Your Page should look like this: