Dernières réalisations

Site web

site web Le Coin Créatif

Joomla!

Le référencement et Joomla!

Développement

Dictionary, composant pour Joomla!

Installation

First of all, open the backend of your Joomla! and navigate to "Extensions - Manage".

If you've downloaded "Dictionary" from www.web-eau.net then click on the tab "Upload Package File". Of course, you can choose the tab "Install from the web". In this case, use the search engine tool with "Dictionary" as keyword.

Locate the ZIP archive of "Dictionary" on your computer, select it and click on "Upload and Install" button to lauch the installation process.

Few seconds later, a message confirm you that the process of installation is successfuly completed.

Now, "Dictionary" is available from the menu "Components"

First steps

Let's start !

The first thing to do is to add the letters in the component. You don't need to add all the letters of your alphabet, just the ones you'll need. Navigate to "Components - Dictionary - Letters".

Click on "New" and add your first letter. Let's start with A.

You can add your others letters while clicking each time on "Save and new". Otherwise, click on "Save and close".

Now, we'll add our first word in the glossary. Navigate to "Components - Dictionary - Definition" or simply click on "Definition" in the left menu.

In the field "word", indicate the word. In this example, the word is "Alphabet".
In the description field, write the definition of your word. Here, you can use HTML tags if you want to customize the display on frontend.

In this example, the text editor is disabled

Once you've finished, click on "Save and close" button.
As you can see on this screen, your word and his definition are listed. You can control that your definition also contains your possible customisations.

Repeat this step for each word you want to display in your glossary.

The display

Now, you've finished to enter all the letters and all the words (with their definition) in the component.

Let's display the glossary in frontend.
Navigate to "Menu" and select the menu where you want to display your glossary.
Click on "New" to create a new item in your menu.

Fill the fields required.
Then, click on "Select" to select the menu type item.
In the popup window, click first on "Dictionary" then click on "Definition".

Once it's done, click on "Save and close".

Everything is done in the backend, let's have a look at the frontend.

The menu item created at the previous step appears.

Click on the title of your menu item to access to your glossary.

Now, simply click on the word you want to read his definition.

Definition are provided by our friend, Wikipedia

Note: you can open and read several definitions in the same time.
Just click again on the word to hide his definition.

As you've noticed, the structure of the markup will display the columns according to the place allowed to the component in the page. So, you don't have to manage this point ;)

Useful tips

Here are some useful tips for a better use of your component. It's only advices based on my experience and on the users feedbacks ;)

Images: if you want to display images in your definition, it's possible. Be careful not to use too large files, in this case. Think to your users first.

Definition are provided by our friend, Wikipedia

Pre-text: to display a pre-text (and/or a post-text) to your glossary, use a custom HTML module and publish it above the main content position of your template.

Limitation ?: there are no limitation about the words and definitions you can add in your glossary.

2 different glossaries ?: Unfortunately, it's not possible to display 2 different glossaries on the same website.

Text editor: If you're familar with code, I advise you to work using CodeMirror instead of TimyMCE or any other text editor. Because it's more flexible to stilish your definitions (adding pics, videos, links, etc) but it's not a mandatory.

Social channels

@web_eau_net

Newsletter

web-eau.net is not affiliated with or endorsed by the Joomla! Project or Open Source Matters. The Joomla! name and logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and
other countries.