fb pixel
Skip to main content
Login
New to DJ-Extensions?
Create an account

DJ-PreSchool WordPress. Installation from scratch

What is the djuniversity-wp-elements-*.zip package?

It is a set of files that allows you to install a website based on the DJ-University template from scratch or install it on an existing website

What's in the package?

package included
DJ University- Settings.json: A special .json file containing all settings for Yootheme Pro along with main styles. 
DJ University- Layouts,json: A special .json file for Yootheme Builder contains the most essential views (layouts) used on our demo site
uploads.zip:   contains all the illustrations used to build our demo site
yootheme_child.zip: This is a child template for Yootheme containing specific CSS styles, overrides, YOOtheme elements.
DJ-Fashionstore - Leyouts,json: A special .json file for Yootheme Builder contains the most essential views (layouts) used on our demo site
plg_yoothemedjsectiontab_1.1.zip: This is a Yootheme plugin designed by us. It allows you to display a section as a tab or accordion. It only comes with the template.

What item do you need to download separately?

DJ-Accesibility PRO: DJ-Accessibility is a plugin that provides elements that improve the website experience. WCAG and ADA.
Download the latest version from https://dj-extensions.com/yootheme/dj-accessibility
DJ-Popup
Popup and Modal Boxes that will boost your conversion rates on pages build on YOOtheme PRO. Download the latest version from https://dj-extensions.com/yootheme/dj-popup 
DJ-AudioList Create your lists of playable audio files. Download the latest version from https://dj-extensions.com/yootheme/dj-audiolist 
Yootheme Pro: This is a third-party extension. Download them from https://yootheme.com/page-builder

Attention!

Yootheme Page Builder is required for proper system operation, which must be purchased and downloaded from https://yootheme.com/page-builder. Yootheme Page Builder is a commercial component from a third party and cannot be bundled with our extensions due to proprietary rights.

Do we recommend any other components to use?

Yes. Of course, we have our favourite must-have kit from a third party. Consider installing these additional components:
Zoolander's Essential for Yootheme Pro:  https://www.zoolanders.com/essentials-for-yootheme-pro

How to install everything from scratch?

Step #1 WordPress installation

Install WordPress downloaded from https://wordpress.org/download/. If you already have your installation working, you can skip this step.

Step #2 Installation and configuration of plugins

1. Yootheme PRO:
Download from https://yootheme.com/page-builder and install like a regular theme. Remember that this is an add-on from a third party, and you need to buy a license from them. There is a wealth of documentation available for Yootheme PRO on their website - https://yootheme.com/support/yootheme-pro/wordpress/introduction. You can handle this web builder.

Go to Apperance / Themes

Then Add new

Upload the Yootheme Builder and install it
The next step is activation
2. DJ-Accesibility:

Go to Plugins / Add New and install wp_djaccessibility_*.zip as standard plugin

Then configure the plugin according to your needs. In our demo we have a toolbar.

The effect on the page will be as follows:

Step #3 Yootheme Builder Configuration

1. Images:
If you like pictures from our quickstart, extract the images.zip archive and add them to your media library
2. Child Theme:

Unpack the 'yootheme_child.zip' file and transfer the whole folder via FTP to the '/wp-content/themes folder in your WordPress Installation.  You can learn more about child themes from the Yootheme documentation https://yootheme.com/support/yootheme-pro/wordpress/developers-child-themes

3. Home Page:
Configure your start page. Go to Pages, add a new one and name it like "home"
Then go to Apperance / Customize
Go to homepage setings and set your homepage
Install N Woo 12
Install N Woo 13
3. Default theme:

Set Child Theme as your default theme.
Go to Apperance / Themes and and activate the child theme

4. Basic builder configuration

Now start to configure your theme. Just click the yootheme button in your dashboard

5 Recover template settings from a JSON file:
Go to "Settings" / "Advanced", then scroll the Yootheme toolbar to the bottom and select "Import Settings"
Click and select - DJ-PreSchool - Settings.json from the disk on your computer 
Publish your changes
Once the settings are loaded, save them. The builder sometimes needs to refresh its cache, close it and reopen it.
6. Then go to pages
Then to the builder
select my leyouts and then upload layout 

Then select DJ-Preschool - Layouts.json from your computer. After doing this, you will see a list of available layouts that we use in our demo

7. Set up page:

Try to set up your home page now. Select the appropriate layout - "DJ-University Homepage" and click.
Now you have a start page, just like in our demo (of course, if you added our pictures. If not, you can use your own. Complete them on each element in the web builder)

Then load images from your media library. You will find them in the provided uplods.zip file

8. Set up next page:

Go to Apperance / Menus

And add your Contact page to the menu and save it

Go back to pages. Select the contact page and start editing it in Yootheme Builder

Select Library and then My Layouts. Choose DJ University - Contact

The layout will be loaded

Then load images from your media library. You will find them in the provided uplods.zip file

Save layout.

Using ready-made layouts, you will build other subpages. Of course, you can modify the views as you wish. You can create layouts on regular articles or page templates depending on the context you are in at the moment. Yootheme documentation will be helpful in this.

Advice

It is a good practice to have a complete quickstart copy somewhere else, allowing you to see the different settings used there.