User Tools

Site Tools


folder_structure

Folder Structure

There are different types of extensions. Depending on what of extension you're creating, the folder structure may differ. The following files are always present, regardless of what type of extension you're creating:

Base Structure

  • splash.html
  • splash.jpg
  • thumbnail.jpg
  • translations/

params.json

The purpose of this file is to tell Mobirise what the name of the extension is, the description, the version of the extension and what logo to use. If you want to know more about this file, check out the params.json page.

splash.html

This file contains the contents of what a user sees when the extension has been installed succesfully.

splash.jpg

In most cases, the splash.html file contains an img-tag that points to an image. This image is displayed when the extension has been installed succesfully. The name of said image does not have to be splash.jpg, but it's very common to do so. It may as well be named extension.png. As you can see, it may as well be a PNG file.

thumbnail.jpg

Just like the splash.jpg file, the thumbnail.jpg does not have to be named this way. You can call it whatever you like, as long as you're referring to this file through the params.json file.

translations

Any extension can come with its own translations. Translations are not required, but are very user friendly if you incorporate them into your extensions. Each language can have its own language file that contains all phrases and their translations.

App Extensions

An App Extension has all the files as described above, plus:

app.js

The app.js file contains all the code required for that extension.

core.js

An App Extension sometimes come with a core.js file. It's unclear when you would need a core.js file.

Component Extensions

A Componend Extension comes with one or more components. In most cases these are additional blocks a user can drag onto his website. The file and folder structure looks like this:

component_directory

This is a directory that holds all component files. You can name this directory however you like, as long as it's referred to by the params.json file.

component.js

A component.js file contains all the code that's required for the component to work. It also contains all the parameters a user can set through the gear icon of a block. If you wish to know more about this file, check out the component.js page.

template.html

The template.html file contains all the HTML to display the block inside Mobirise, but also when the website is previewed/published.

thumb.png

The thumb.png file is the image that's used in the blocks sidebar, from where you drag blocks onto your website.

Themes

Themes are a different kind of extension. They provide an entire theme on which you can base your website and offer several blocks to get you started. Older M3 themes came with Component Extensions in them, but nowadays that isn't the case anymore. Themes often come with:

  • fonts/
  • components/
  • plugins/

fonts

Most themes come with their own fonts to give them that more unique look and feel. Fonts are stored inside this directory.

components

This directory contains all the blocks of said theme. These are the blocks that get displayed on the sidebar which ou can drag onto your website.

plugins

All plugins and (Javascript) libraries a theme uses are stored in this directory.

folder_structure.txt · Last modified: 2024/09/01 14:30 by 127.0.0.1

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki