Installation

Steps

1 / Adjust composer.json

Install the 0.1 Isotope Bundle by editing the file composer.json in the Contao root directory. Add the following lines at the end of the file (as in the example composer.json below). Replace the domain and the password.

,
"repositories": [
  {
    "type": "composer",
    "url": "https://[DOMAIN]:[PASSWORT]@packages.contao.store"
  }
]

Add the following line at the end of require. Don’t forget the comma in the second-to-last line.

"contao-themes-net/zero-one-isotope-bundle": "^1.0"

Example of what composer.json should look like for Contao 4.13:

{
    "type": "project",
    "require": {
        "contao/calendar-bundle": "^4.13",
        "contao/comments-bundle": "^4.13",
        "contao/conflicts": "*@dev",
        "contao/faq-bundle": "^4.13",
        "contao/listing-bundle": "^4.13",
        "contao/manager-bundle": "4.13.*",
        "contao/news-bundle": "^4.13",
        "contao/newsletter-bundle": "^4.13",
        "contao-themes-net/zero-one-isotope-bundle": "^1.0"
    },
    "extra": {
        "contao-component-dir": "assets"
    },
    "scripts": {
        "post-install-cmd": [
            "@php vendor/bin/contao-setup"
        ],
        "post-update-cmd": [
            "@php vendor/bin/contao-setup"
        ]
    },
    "repositories": [
        {
            "type": "composer",
            "url": "https://BENUTZERNAME:PASSWORT@packages.contao.store"
        }
    ]
}

2 / Run Composer update

Now open the Contao Manager and run the update by clicking the button Apply changes at the bottom.

3 / Update the database

Then open the install tool and update the database. In the install tool you also have to create an admin user account.

You reach the install tool in the Contao Manager via the menu item Tools or via the URL: www.your-domain.com/contao/install.

4 / Synchronize the theme files

Log in to the back end with the user account you created and select the menu item 0.1 Theme Setup under CONTAO-THEMES-NET in the left navigation. Then click the button Synchronize theme files. This creates all files in the file manager under the folder zeroOne and copies the SQL files for the database import into the templates folder.

5 / Synchronize the Isotope files

Select the menu item 0.1 Isotope Setup under CONTAO-THEMES-NET in the left navigation and click the button Synchronize files to create all product images and move the SQL files into the templates folder so that they can be imported.

6 / Empty the table ’tl_files'

Under the menu item 0.1 Theme Setup, empty the database table ’tl_files’ by clicking the button Empty table ’tl_files’. This step must be carried out before importing the database.

7 / Import the attributes

In the install tool, import the template named 0.1_isotope_attributes.sql. Make sure to tick Do not truncate tables.

Then clear the cache.

When you open the install tool again now, some new fields should be created. Update the database.

8 / Import the theme and Isotope demo data

Now import the template named 0.1_isotope_demo_contao_4.x.x.sql (depending on your Contao version) in the install tool. Make sure to tick Do not truncate tables.

For the import to work, Contao must be installed with the bundles for news, calendar, FAQ, newsletter, listing and comments.

If you don’t want to use these Contao bundles, you can uninstall them afterwards.

9 / Recreate the symlinks

Then switch back to the Contao back end, select the menu item System maintenance and recreate the symlinks by ticking Recreate the symlinks and then clicking the button Purge data.

10 / Settings

Under Advanced CSS settings, select the class set spectre.json.

In addition, Use folder URLs must be active. You find it in the settings under Front end settings (up to Contao 4.10) or in the site structure in the settings of the website root under URL settings (Contao 4.11 and later).

11 / Import the CSS

Add the following line to custom.scss (file manager, under zeroOne/scss) so that the styling is loaded:

@import '../../../public/bundles/contaothemesnetzerooneisotope/scss/isotope';

Also add the following line to activate the dark mode:

@import '../../../public/bundles/contaothemesnetzerooneisotope/scss/dark_mode';

12 / Further extensions

If users should not only be able to order as guests but also register, install the extension terminal42/contao-autoregistration. In the settings of the website root under Member registration, activate the three checkboxes so that users are logged in and activated right after registering.

Notes

Error: This page isn’t working / The page redirected you too many times

Edit the website root and set the protocol under URL settings to http:// or https://, depending on how your site should be accessed.