FLEXIcontent allows you to create custom fields for each type of content you want to use. This allows to force the user to enter different information in very specific areas that I can post later as I see fit. I can also turn these fields into search criteria or filter ... So with a little imagination, you can quickly make all templates that you want and once again open doors that close left Joomla.

The field types available are: checkbox, checkbox image, date, email, file, image, radio buttons, radio buttons picture, select, multiple select, text, textarea and weblink. Suffice to say that it lacks little to make you happy.

In addition to custom fields, FLEXIcontent also gives you access to additional features for each content:
- Version management
- An integrated system of voting
- Power stored favorites
- A hit counter
- Management of keywords
- Assigning multiple categories to a single content

All its features, that appear as fields, are automatically assigned to a content type when created and the database fields (title, description, author, creation date, modification date, publication status)

I will continue creating my template by configuring some typical fields and adding custom fields. This example is of course nothing concrete, he just intended to illustrate the various features.

Summary of tutorial:

• General information fields FLEXIcontent
• The typical fields
• Custom fields and the use of plugins
• Create your own field type
  
• Position fields in the template

General information fields FLEXIcontent

FLEXIcontent in, you can associate a field with one or more types of content. Each has its own custom fields options. In fact the field types (textarea, checkbox, list ...) are generated through a specific plugin, so if you want nothing prevents you to create your own field type.
For each field types, there are some options that are common:

• Label: what is the name that will appear (or not) in front of your fields in the template. Beware if you want to change the label of the description field and want to differentiate according to the type of content, it is preferable at this time to change this value directly in settings where such an option is provided for this purpose.
• Name: the name used to identify your fields, it is important to use only the characters AZ, az and 0-9 without spaces because it is the name that will allow us to reference our field in the template. By default when you create a field, called the FLEXIcontent "fieldxx" I urge you to change to get your bearings thereafter.
• Posted: enables or not a field. Some fields (title, description, created, created by, last modified, revised by) can not be dépubliés because they are necessary for the proper versioning. However there is a trick if you do not want them to appear when creating new content, just do not affect the fields to the content type in question and our problem is solved.
• Search: Indicates whether the contents of the fields will be indexed for a search or not.
• Advanced Search: This function will be used from version 1.7 FLEXIcontent which is scheduled for the end of March.
• Filter: Indicates whether the fields will be displayed as a filter in the display mode content category. If you want to use this feature you must initially set the value to yes on the fields that you will filter. Caution! only the fields with predefined values ​​(Checkbox, Checkbox image, Select, Select Multiple, Radio, Radio Image) can be used as a filter. Then do not forget to activate the filters within the parameters of the category and select from the list the appropriate fields.
• Access Level: The level of access to fields, basic levels related to the Joomla ACL.
• Order: Determines the display order of fields when entering content.
• Description: Specifies the user instructions for entering the field. In the same way as for the label, if you want to learn different descriptions for the "description" field, you will learn in the type parameters.
• Type: Select here the types you want associated with your field (press Ctrl to select multiple types)
• Show Label: Allows you to enter a parameter that can be used in the template to determine whether or not it displays the field label.
• Prefix and suffix: Available in most fields (but not all). These two parameters allow you the ability to add value before and after the contents of your fields. You can add for example the € symbol suffix if you want to display a currency field. They can be used also to add html code or even use them to implement a plugin (to see the last part of this tutorial)
• Specific plugins: This list shows all content plugins installed on your Joomla site, you can choose specific plugins in the list or leave blank to make the content compatible with any plugin. This feature is useful in some cases to avoid conflicts, multiple displays or reduce load. Keep in mind that when the plugin is used on a field, will automatically run on all fields in the loop.

The typical fields

Some fields are automatically assigned when creating a new type, these are the types of fields FLEXIcontent.

Some are directly related to the Joomla core:

• Title: The title of your content
• Description: What is the content of your article in Joomla. If you want to make compatibility with Joomla content plugins, it will not take you forget to check in the settings of this box the option "Execute content plugins".
• * Created: Date the content.
• Created by: Author content.
• Last modified *: Date of last modification of the content.
• Revised by: Name of user who last modified the content.
• Hits: Number of times the content has been posted. (By default it has a suffix of information: "views")
• Document type: The type of content.
• Version: The version of the content.
• State: The state of publishing content.

* For the date fields, it is possible to change the display format in the settings of the field through a list of predetermined values ​​or create a custom display format using the settings of PHP strftime ( http :/ / php.net / manual / en / function.strftime.php ).

Other fields correspond to very specific features of FLEXIcontent:

• Voting: Functionality to evaluate from January to May content. Voting is symbolized by an image 25 × 75 (com_flexicontent / assets / images / star.gif) divided into three sub-images representing the Shares: No selected, selected, and hover. You can create your own image, then change the path in the settings fields to point the path to your file. So I realize my little picture with balloons, it's more fun to assess stages. You can also change the display size of the image defaults to 16 pixels.
• Favourites: Allows a registered user to rank this page in his favorites.
• Categories: Stores the categories in which the content is classified. An option to select the separator that will be shown later in frontend (vertical bar, line break, comma, space)
• Tags: Stores tags in which the contents are classified. An option to select the separator that will be shown later in frontend (vertical bar, line break, comma, space)

Custom Fields

As I stated previously FLEXIcontent offers us many possibilities to customize the entry display their content but also through custom fields. I will now, while resuming my example of creating a template to present the stages of French football, you have different types of custom fields. I would not use the fields for each set of parameters available, but through the entire tutorial I will cover all the features available.
Remember for each field to select the types affected in our type "Stadium".

• Text:

I'll start by adding my first custom field, I want to display the address of the stadium. But that's not all I'm going to enjoy using the address you entered to display the location of my stage GoogleMap.
First of all I have installed and activated the latest version of the plugin GoogleMap ( http://www.kksou.com/php-gtk2/Joomla-Gadgets/googleMaps-plugin.php # download ).
I add my fields with the following values:

I called the label and the field name "address", then I select my field type: "Text". I complete my description telling the user how it should inform the content "Enter the address of the stadium with the following format: 'street number' 'street name', 'city'."
I want to run the GoogleMap plugin on that field, so I change the value of "Execute content plugins" indicating the value "yes".
I take my prefix in the beginning of the tag of my GoogleMap plugin: {addr = googleMaps "
Then the suffix I close my beacon and I add some plugin specific parameters: "width = 100 height = 190% = lang = en maptype G_HYBRID_MAP}
The address that I can enter later will be integrated directly as a parameter for my plugin.
Important! So far it is not possible to use a plugin that uses the pipe character "|" in the settings because it generates a bug.

• Textarea

I will now add an area that will allow me to enter additional address with the following values:

I decide not to activate the HTML editor and I reduce the area to five lines in order not to overload my entry page. (The area "Height of the publisher" only corresponds to the pixel height of the HTML editor)

• Date

I will now add the field to record the date of inauguration of the stadium. This field will allow me to choose a date through a calendar that is displayed beside my fields dynamically.

I want a display format that does not exist in the list, so I select "Custom Size" and I take my format: "% d /% m /% Y" to display a date which will look like this' 14 / 07/1979 '. I also disables multiple values.

• E-mail

I'll add a zome email that I can understand the different contact addresses.
I called my field "contact", I indicate instructions entered in the description. I will allow multiple values ​​with a maximum of 5 contacts. I also decided to display the values ​​in my template, separating by a comma.
Beware, there is no format control when entering values, the user can enter what they want (ie something other than email address). In the template, FLEXIcontent will simply add a "mailto:".

• Weblink

I want to display for each of my stage name and the official club website playing on the lawn.

I called my field "site_stade" and I said in the description should not enter the "http://" in my address. (Although we will see later that automatically manages the FLEXIcontent) I enlarged a bit the size of my field as a web address will take a little more room.
I also use the title of my link, instead of displaying the website address. This will allow me to show the name of the club rather than the name of its site.
Finally I do not want the user leaves my site if they click on link, so I sent in a new window.

• Image

I will now add an image field in order to view a picture of my internship. I take the following parameters:

I called my field "image_stade" I then informs the description by saying that I only allow jpg and png files. I decide not to display the field label, as for an image that is supposed illustrated my page I do not see the point.
I shows the types allowed extensions, beware it is important to enter the extension in lowercase and uppercase. I limit my maximum file size to 500KB (500,000 bytes).
Thumbnail quality is the rate of compression, not working on a large amount of image I prefer to maintain a good quality (possible value 1 -> 100)
I change the path to thumbnails directory to centralize all my images later in the same directory for FLEXIcontent, I can specify images / FLEXIcontent / thumbnails
We have the ability to manage a watermark (image embedded in the original image to ensure the rights of use), so I will exploit it. I leave the opacity to 100% because I will directly manage the transparency in my image file. I position my watermark in the bottom right.
FLEXIcontent will automatically generate three types of thumbnails when uploading our image. We can then use later in our templates different image sizes and therefore optimize load times.
For each size I set my maximum width and height. For large and medium-miniature, I let the image scale and I decided to embed my own watermarks that I store at the following location: images / FLEXIcontent / core / watermark.png.
For my little miniature I would not use the watermark to the small size of my image.
Finally it is also possible to automatically link my Mini with my original image via a popup will appear automatically in my template. You can choose between the effect Rockbox or multibox.

• Queue

I now want to add an area where I could make available various resources on the stage: plan forums, available services, brochures ... so I add my zone type "file" which I call "resources".

This area will allow me to add multiple files automatically. Choose the type of separator between different files.
"Use MIME icon 'allows you to display on the frontend a small icon in front of the filename which depend directly on the MIME type of your file.
"Use a download button", this allows you to display a "Download" button rather than a link to the file. The concern is that if I activate this feature, I could not manage a file so it does not interest me.

• Select

For each stage I want to associate the music played during the entrance of the players on the pitch. I will use a list that will directly depend FLEXIcontent files. Beforehand, I make some changes in the general settings of FLEXIcontent, I authorize the upload mp3 files and then I change the upload path "images / FLEXIcontent / files /". Can I install the plugin JosDewPlayer that will allow me to read the mp3 files correctly.
I called my field "anthem". I activate the plugin execution on the content and I select only josdewplayer to optimize the operation.
I also enable the removal of spaces in names to avoid errors in the file address.
To set up reading my file, I prefix information: {play} images / FLEXIcontent / files /, then suffix {/ play}
I want to use SQL to inform my list directly from files FLEXIcontent. I fill my sql query:

  A
 2
 3

  value , filename AS text SELECT value AS filename, filename text AS
 FROM AS fi # __flexicontent_files
 ext = "mp3" AND fi . published = 1 WHERE fi. Ext = "mp3" AND fi. Published = 1 

Must perform a query with two fields to display that must necessarily associate the alias "value" and "text" which of course corresponds to the value and the text of the list. Be aware that the default value that will be returned when viewing the template will be "text". I filter the files by selecting only the mp3 that are published.

• Select multiple

I wish to associate and display the various partners of the club. I set up a "multiple select" to be associated with the component of banners in Joomla so you can select multiple partners. I called my field "partners"
I will use a plugin to display my banner, I do not forget to run even the content plugins and I select my plugin " Mos Banner 0.4 "previously installed. I delete the spaces. I take my tags prefix "mosbanner {: id =" then my suffix "}".
I will link the list to the list of Joomla banner published, so I turn and I go on my SQL query:

  A
 2
 3
 4

  value , name AS text SELECT BID AS value, name AS text
 AS FROM # __banner ba
 showBanner = 1 WHERE ba. ShowBanner = 1
 name ORDER BY ba. Name 

Finally I select comma-separated values ​​because it is the character used by my plugin.
We will see later that the result is not really one you want, and I have to create my own field type (see next section)

• Checkbox, Checkbox picture, radio buttons and radio buttons picture
  

These fields are managed in the same way apart from the fact that in some we may add images.
I will select the "Checkbox picture" and learn the elements in the format
"Value label :: :: image%%", my values, "drink :: Drinks :: wc :: boissons.gif%%%% wc.gif Toilets :: restaurant :: Restaurants ::%% resto.gif Parking Parking parking.gif :: ::%% :: smoking :: Smoking Ban fumer.gif "
Do not put the double percentage at the end of the list.
I then modified the path to my images "images / FLEXIcontent / core /". It is also possible to check the default values, using the default. It suffices to capture the "values", separated by commas.

My custom fields are now complete.

Create your own field type

FLEXIcontent allows you to create your own field types, we can imagine doing such a field with an incremental counter (+, -) or even a scroll to determine values. I'll just present the possibilities for me because I'll just make a copy of "select multiple" to transform the rendering which is currently in this form: In this new format ... I want: [prefixe_plugin] [value1] [separator] [value2] [separator] ... [suffixe_plugin]

A field type in FLEXIcontent is actually a plugin, plugins are automatically installed in the plugins / flexicontent_fields / and consist of two files [nom_plugin]. Xml [nom_plugin]. Php and language files associated.

The XML file

I then made a copy of the original selectmultiple.xml I renames selectmultiple.php. This file is a standard Joomla installation, there is first the legal and description, I just amends the name of my plugin to distinguish the original plugin, I added at the author and I will update the version:

  A
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11

  encoding = "utf-8" ?> <? Xml version = "1.0" encoding = "utf-8"?>
 type = "plugin" group = "flexicontent_fields" method = "upgrade" > <install "1.5" version = type = group = "plugin" "flexicontent_fields" "upgrade" method =>
  <name> Select Multiple Advanced </ name>
  <author> Emmanuel Danan, Maxime update Danjou (NetAssoPro) </ author>
  <creationDate> March 2009 </ creationDate>
  <copyright> Copyright (C) 2009 Emmanuel Danan </ copyright>
  <license> GNU / GPL v2 </ license>
  <authorEmail> emmanuel@vistamedia.fr </ authorEmail>
  <authorUrl> www.vistamedia.fr </ authorUrl>
  <version> 1.1 </ version>
  <description> FLEXI_FIELD_SELECTMULTIPLE </ description> 

I indicates the file name of my plugin:

  12
 13
 14

  <Files>
  > selectmultiplead.php </filename > <filename "selectmultiplead" plugin => selectmultiplead.php </ filename>
 </ Files> 

We then find the plugin parameters. I add two parameters, the first I call "postext_mode" that will allow me to say if we use the prefix and suffix of each value, or only the beginning and end of all values. My second parameter "value_mode" determines whether I will display my values ​​or my labels.

  15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57

Dans la dernière partie du fichier xml, je charge mes fichiers langues (qui ne sont également qu'une copie des originaux), je rajoute dans chacun de mes fichiers les variables suivantes : FLEXI_FIELD_VALUE_MODE, FLEXI_FIELD_VALUE_MODE_DESC, FLEXI_FIELD_VALUE, FLEXI_FIELD_POSTEXT_MODE, FLEXI_FIELD_POSTEXT_MODE_DESC.

  58
 59
 60
 61
 62

 <languages >
 <language tag = "en-GB" > en-GB.plg_flexicontent_fields_selectmultiplead.ini </language >
 <language tag = "fr-FR" > fr-FR.plg_flexicontent_fields_selectmultiplead.ini </language >
 </languages >
</install > 

Le fichier PHP

Le fichier est une classe composé de 5 événements :

• onDisplayField : Affichage du champ dans la saisie du contenu
• onDisplayFieldValue : Affichage du champ formaté pour le frontend
• onBeforeSaveField : Formate la valeur du champ avant qu'elle soit enregistré
• onAfterSaveField : N'est pas encore utilisé pour le moment, mais dans un futur proche il permettra d'effectuer des interactions avec les autres composants.
• onDisplayFilter : Affiche les filtres dans la vue du template catégorie. Par défaut c'est des listes.

Je vais pour ma part uniquement modifier l'événement onDisplayFieldValue pour rajouter les conditions qui dépendent de mes 2 nouveaux paramètres.
Je commence par modifier le nom de ma classe et mon constructeur que je nomme : plgFlexicontent_fieldsSelectmultiplead.
Puis ensuite dans la première ligne de chaque événement, je modifie le code de la manière suivante :

  A

 if ( $field -> field_type != 'selectmultiplead' ) return ; 

Je rajoute donc les conditions dans mon code et j'enlève également les   dans mes séparateurs afin de ne pas créer de bug avec mon plugin.

  A
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
 100
 101
 102
 103
 104
 105
 106
 107
 108
 109
 110

 function onDisplayFieldValue ( & $field , $item , $values = null , $prop = 'display' )
  {
  // execute the code only if the field type match the plugin type
  if ( $field -> field_type != 'selectmultiplead' ) return ;
  $values = $values ? $values : $field -> value ;
  // some parameter shortcuts
  $remove_space = $field -> parameters -> get ( 'remove_space' , 0 ) ;
  $pretext = $field -> parameters -> get ( 'pretext' , '' ) ;
  $posttext = $field -> parameters -> get ( 'posttext' , '' ) ;
  $field_elements = $field -> parameters -> get ( 'field_elements' , '' ) ;
  $sql_mode = $field -> parameters -> get ( 'sql_mode' , 0 ) ;
  $separatorf = $field -> parameters -> get ( 'separatorf' ) ;
  $opentag = $field -> parameters -> get ( 'opentag' , '' ) ;
  $closetag = $field -> parameters -> get ( 'closetag' , '' ) ;

  // j'ajoute mes deux nouveaux paramètres
  $value_mode = $field -> parameters -> get ( 'value_mode' , '' ) ;
  $postext_mode = $field -> parameters -> get ( 'postext_mode' , '' ) ;

  // je retire dans les séparateurs le  
  switch ( $separatorf ) {
   case 0 :
    $separatorf = ' ' ;
    break ;
   case 1 :
    $separatorf = '<br />' ;
    break ;
   case 2 :
    $separatorf = '|' ;
    break ;
   case 3 :
    $separatorf = ',' ;
    break ;
   case 4 :
    $separatorf = $closetag . $opentag ;
    break ;
  default :
   $separatorf = '&nbsp;' ;
   break ;
  }
  if ( $pretext ) {
   $pretext = $remove_space ? $pretext : $pretext . ' ' ;
  }
  if ( $posttext ) {
   $posttext = $remove_space ? $posttext : ' ' . $posttext ;
  }
  if ( $sql_mode ) { // SQL mode
   $db = & JFactory :: getDBO ( ) ;

   $query = preg_match ( '#^select#i' , $field_elements ) ? $field_elements : '' ;
   $db -> setQuery ( $query ) ;
   $results = $db -> loadObjectList ( ) ;

   if ( ! $results ) {
    $field -> { $prop } = '' ;
   } else {
    $display = array ( ) ;
    foreach ( $results as $result ) {
     for ( $n = 0 , $c = count ( $values ) ; $n < $c ; $n ++ ) {
      if ( $result -> value == $values [ $n ] ) {
       // selon qu'on décide d'afficher la valeur ou l'étiquette
       if ( $value_mode == 0 ) {
        $thevalue = $result -> text ;
       } else {
        $thevalue = $result -> value ;
       }
       // selon qu'on décide d'utiliser le plugin pour toutes les valeurs ou pour l'ensemble des valeurs
       if ( $postext_mode == 0 ) {
        $display [ ] = $pretext . $thevalue . $posttext ;
       } else {
        $display [ ] = $thevalue ;
       }
      }
     }
    }
   }
  } else { // Elements mode
   // initialise property
   $listelements = explode ( " %% " , $field_elements ) ;
   $listarrays = array ( ) ;
   foreach ( $listelements as $listelement ) {
    $listarrays [ ] = explode ( "::" , $listelement ) ;
   }
   $display = array ( ) ;
   foreach ( $listarrays as $listarray ) {
    for ( $n = 0 , $c = count ( $values ) ; $n < $c ; $n ++ ) {
     if ( $values [ $n ] == $listarray [ 0 ] ) {
      // selon qu'on décide d'afficher la valeur ou l'étiquette
      if ( $value_mode == 0 ) {
       $thevalue = $listarray [ 1 ] ;
      } else {
       $thevalue = $listarray [ 0 ] ;
      }
      // selon qu'on décide d'utiliser le plugin pour toutes les valeurs ou pour l'ensemble des valeurs
      if ( $postext_mode == 0 ) {
       $display [ ] = $pretext . $thevalue . $posttext ;
      } else {
       $display [ ] = $thevalue ;
      }
     }
    }
   }
  }
  $field -> { $prop } = implode ( $separatorf , $display ) ;
  // selon qu'on décide d'utiliser le plugin pour toutes les valeurs ou pour l'ensemble des valeurs
  if ( $postext_mode == 1 ) {
   $field -> { $prop } = $pretext . $field -> { $prop } . $posttext ;
  }
  $field -> { $prop } = $opentag . $field -> { $prop } . $closetag ;
 } 

Une fois toutes mes modifications effectuées je n'ai plus qu'à créer mon fichier zip afin de réaliser le package de mon plugin que je pourrais installer via Joomla.
Vous pouvez télécharger l'exemple que j'ai réalisé ici : plg_flexicontent_selectmultiplead .

Je vais donc changer maintenant mon type de champ pour mon champ « partenaires » afin de lui affecter mon nouveau type : « Select Multiple Advanced ». Au niveau des options pour « Type d'information à afficher (frontend) », je sélectionne « valeur », puis pour « Multi Suffixe, préfixe » je le laisse sur « non ».

Positionner les champs dans le template

Dans ce dernier chapitre de la 2ème partie du tutoriel de la créations de template sous FLEXIcontent, je vais vous montrer comment positionner ses champs dans son propre template via l'interface du back office.

Je me rends dans la section Template de FLEXIcontent puis au niveau de la ligne de mon template « Stade » je clique sur l'icône associé à la Vie Item.

Le positionnement des champs se fait alors par un simple glisser/déposer. Je met en place mes champs de la manière suivante :

Dans une prochaine version de FLEXIcontent il sera également possible de créer ses propres zones directement via l'interface graphique… plutôt intéressant.

Je vous montrerez également dans la quatrième partie de ce tutoriel comment insérer des champs fixes directement dans le template.

That's all for this time in the next part I will touch on the part of the creation of content through our custom type . This will allow you to preview the layout of different fields and their entry mode.