Open Sitez Documentation

Documentation main page

 

The imagemenu plugin in your CMS works by using a imagemenu definition file, which is typically named definition.osz. This file defines the different galleries that are available on your website.

The imagemenu definition file is divided into two sections:

• routes: This section defines the different imagemenu routes on your website. Each imagemenu route has an id: field, which is used to reference the imagemenu data in the data: section.
• data: This section defines the imagemenu data for each imagemenu. Each imagemenu has a unique id: field, which is referenced by the corresponding imagemenu route in the routes: section.

Example:

routes:
  demo:
    id: demo
    type: imagemenu

data:
  demo:
    noir:
      text: "Cafés Noirs"
      imagedir: images
      url: /selection/cafe/
      values:
        sicilia:
          text: "Siciliano"
          enabled: true
          image: cafe/siciliano.jpg
        bio:
          text: "Bio"
          enabled: true
          image: cafe/bio.jpg
        barista:
          text: Barista
          enabled: true
          image: cafe/RistettoBarista.jpg
    expresso:
      text: Espressos
      imagedir: images
      values:
        deca:
          text: 
              en: Decafeinated
              fr: Décaféiné
          image: expresso/EspressoDeca.jpg

In this example, the routes: section defines a imagemenu route with the id: demo. The data: section defines the imagemenu data for the demo imagemenu.

The values field in the demo imagemenu data contains a list of items. Each item has a text field, an enabled field, and an image field.

The text field contains the text that will be displayed for the item. The enabled field indicates whether the item is enabled. The image field contains the path to the image for the item.

The text field for the deca item contains two values, en: Decafeinated and fr: Décaféiné. This means that the text for the deca item will be displayed in English or French, depending on the language of the website visitor.

Gallery format

The imagemenu format in your CMS is defined in the data: section of the definition.osz file. Each imagemenu has a unique id: field, which is referenced by the corresponding imagemenu route in the routes: section.

The imagemenu data for each imagemenu contains a list of items. Each item has a text field, an enabled field, and an image field.

The text field contains the text that will be displayed for the item. The enabled field indicates whether the item is enabled. The image field contains the path to the image for the item.

The image field can be a relative path or an absolute path. If the image field is a relative path, it is relative to the basedir field for the imagemenu.

The basedir field specifies the directory where the images for the imagemenu are located. The basedir field is required for all galleries.

The following example shows the imagemenu format in your CMS:

data:
  demo:
    noir:
      text: "Cafés Noirs"
      imagedir: images
      url: /selection/cafe/
      values:
        sicilia:
          text: "Siciliano"
          enabled: true
          image: cafe/siciliano.jpg
        bio:
          text: "Bio"
          enabled: true
          image: cafe/bio.jpg
        barista:
          text: Barista
          enabled: true
          image: cafe/RistettoBarista.jpg
    expresso:
      text: Espressos
      imagedir: images
      values:
        deca:
          text: 
              en: Decafeinated
              fr: Décaféiné
          image: expresso/EspressoDeca.jpg

In this example, the noir and expresso galleries have the following basedir fields:

noir:
  imagedir: images
expresso:
  imagedir: images

This means that the images for the noir imagemenu are located in the /images directory, and the images for the expresso imagemenu are located in the /images directory.

The following example shows how to reference an image in the image field:

image: cafe/siciliano.jpg

In this example, the image cafe/siciliano.jpg is located in the /images directory.

I hope this explanation is helpful. Please let me know if you have any other questions.