DJ-PreSchool. Installation from scratch
Contents:
- What's in the package?
- What item do you need to download separately?
- Do we recommend any other components to use?
- How to install everything from scratch?
- - Step #1 Joomla installation
- - Step #2 Initial configuration
- - - Yootheme PRO
- - - DJ-Accessibility
- - - DJ-AudioList
- - - DJ-PupUp
- - - DJ-ContentFilters
- - Step #4 Yootheme Builder
- - - Images
- - - Child Theme
- - - Default template
- - - Basic builder configuration
- - - Base style
- - - Recover template settings
- - - Child Theme
- - - Set up the menu
- - - Loading layouts
- - - Set up pages
- - - Set up shop page
- - - Modules
What is the djuniversity-en-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](/templates/yootheme/cache/2f/preschool_t_01-2f21f234.png)
![package included](/templates/yootheme/cache/75/preschool_t_02-7540cd54.png)
What item do you need to download separately?
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?
How to install everything from scratch?
Step #1 Joomla installation
Install Joomla! 5.x or 4.x downloaded from https://downloads.joomla.org/. If you already have your installation working, you can skip this step.
If you are using Joomla version 5.x, make sure the backward compatibility plugin is activated. If not turn it on. To do this, go to plugins, find the backward compatibility plugin and enable it.
![](/templates/yootheme/cache/ad/install_for_j5_01-ad169c3a.png)
Step #2 Initial configuration
![](/templates/yootheme/cache/a4/joomla_config_1-a4a472ca.jpeg)
2. Other settings according to your needs
Step #3 Installation and configuration of extensions
1. Yootheme PRO:
Download from https://yootheme.com/page-builder and install like a regular extension. 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/joomla/introduction. You can handle this web builder.
2. DJ-Accessibility:
![](/templates/yootheme/cache/99/djaccess-module-990b619b.jpeg)
3. DJ-Audiolist:
Install the DJ-Audiolist plugin downloaded from https://dj-extensions.com/my-account/downloads/DJ-AudioList-Joomla and activate it.
4. DJ-Popup:
Install the DJ-Popup plugin downloaded from https://dj-extensions.com/my-account/downloads/DJ-AudioList-Joomla and activate it.
5. DJ-ContentFilters:
Install the DJ-ContentFilters plugin downloaded from https://dj-extensions.com/my-account/downloads/DJ-ContentFilters and activate it.
Step #4 Yootheme Builder Configuration
1. Images:
2. Child Theme:
3. Default template:
Set Yootheme as your default template.
Go to the System tab and select Site Template Styles from the Templates section
![](/templates/yootheme/cache/b2/template_step_4-b2facb56.jpeg)
Then set Yootheme as the default template
![](/templates/yootheme/cache/56/template_step_5-568eb882.jpeg)
4. Basic builder configuration
![](/templates/yootheme/cache/e6/dj-preschool_06-e6dc9ed8.png)
5. Base style
![](/templates/yootheme/cache/30/preschool_t_03-3030ac5d.png)
6. Recover template settings from a JSON file:
![](/templates/yootheme/cache/ef/preschool_t_04-efc066c3.png)
7. Child Theme:
![](/templates/yootheme/cache/5c/preschool_t_06-5ca35f9a.png)
8. Set up the menu:
![](/templates/yootheme/cache/62/single_article-62e4a316.jpeg)
![](/templates/yootheme/cache/df/preschool_t_07-df9c9189.png)
![](/templates/yootheme/cache/d5/preschool_t_08-d5c62da6.png)
9. Loading layouts:
Go to Yootheme Pages. Then to Builder
![](/templates/yootheme/cache/cd/yt42_pages-cd360583.png)
![](/templates/yootheme/cache/e4/yt42_builder-e45907fe.png)
![](/templates/yootheme/cache/3c/preschool_t_09-3c61cf24.png)
![](/templates/yootheme/cache/d2/preschool_t_10-d27352c2.png)
10. Set up pages:
![](/templates/yootheme/cache/1a/preschool_t_11-1aa646f7.png)
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 and DJ-Catalog2 Integrator documentation will be helpful in this.
Let's try to add the "Songs" subpage
Go to menu. Then Main menu and add a new menu item
![](/templates/yootheme/cache/5d/yt42_menus-5db061ac.png)
![](/templates/yootheme/cache/00/yt42_mainmenu-0043a258.png)
![](/templates/yootheme/cache/d4/yt42_new_menu-d4dba4e5.png)
Then add a new menu item and name it "Songs". Select articles/single article as the menu item type
![](/templates/yootheme/cache/ee/preschool_t_12-ee3b5380.png)
![](/templates/yootheme/cache/97/preschool_t_13-97a9eb2f.png)
From this position you can immediately create an article and associate it with a menu item
![](/templates/yootheme/cache/83/preschool_t_14-83ea960e.png)
So create it and save it
![](/templates/yootheme/cache/08/preschool_t_15-08a82ff5.png)
Now save your menu item and close dialog window
![](/templates/yootheme/cache/98/preschool_s_16-989d3ceb.png)
This way you have added an item to the main menu without leaving the webbuilder. Now click on this item.
Go back to pages/builder and click the library button
![](/templates/yootheme/cache/b9/preschool_t_17-b9fca58f.png)
Select the "songs" page from your library
![](/templates/yootheme/cache/a0/preschool_t_18-a00586ed.png)
Advice
It is a good practice to have a complete quickstart copy somewhere else, allowing you to see the different settings used there.