MLOD4CON - Making Multilingual Linked Open Data Sources Accessible for Content Architects & Content Creators

Overview

MLOD4CON (for "Multilingual Linked Open Data for Content Enrichment") is a JavaScript library that assists in enriching HTML5-based content - thus, increasing the content's value.

MLOD4CON is open source and developed on GitHub.

MLOD4CON is customizable.

MLOD4CON operates as follows:

• It scans the HTML5 content for so-called entity identifiers
• It sends a query to a so-called Linked Data source (such as DBpedia)
• It builds markup (defined by templates in the format of RDFa, Microdata or JSON-LD) from the results of the query

One example usage of MLOD4CON is the generation of so-called schema.org markup that is an important ingredient to Search Engine Optimization (SEO).

Example usages

Basic usage

In order to use MLOD4CON without customization, you simply need to attach the run() method to an element

Welcome to Berlin, the home of Marlene Dietrich!

Source code:

<span
 its-ta-ident-ref="http://dbpedia.org/resource/Berlin"
 onclick="$.mlod4con.run(this);">Berlin</span>

<span
 its-ta-ident-ref="http://dbpedia.org/resource/Marlene_Dietrich"
 onclick="$.mlod4con.run(this);">Marlene Dietrich</span>

Advanced usage I: Richer markup templates

In order to generally customize the annotation that is generated, you use the setMarkupTemplates method. The order of templates given as an option is significant. The first template that completely matches to the query will be used. Example:

Welcome to Berlin, the home of Marlene Dietrich!

Source code:

<span
 its-ta-ident-ref="http://dbpedia.org/resource/Berlin"
 onclick="
  $.mlod4con.setMarkupTemplates('Place-specific,Place-general');
  $.mlod4con.run(this);">Berlin</span>

<span
 its-ta-ident-ref="http://dbpedia.org/resource/Marlene_Dietrich"
 onclick="
  $.mlod4con.setMarkupTemplates('Person-specific,Person-general');
  $.mlod4con.run(this);">Marlene_Dietrich</span>

The setParameters option allows to pass arbitrary parameters to a query. Example:

A query of Marlene Dietrich!

The parameter somePredicate is replaced in the SPAQRL query string with the value
http://dbpedia.org/property/birthPlace. A list of parameters can be separated via |.

Source code:

<span its-ta-ident-ref="http://dbpedia.org/resource/Marlene_Dietrich" onclick="
 $.mlod4con.setQuery('dbpedia-person-query-with-parameters');
 $.mlod4con.setParameters('somePredicate=http://dbpedia.org/property/birthPlace');
 $.mlod4con.run(this);">Marlene Dietrich</span>

Advanced usage II: Multilingual templates and different output formats

In order to customize the annotation that is generated with regards to language, you use the setLanguage method to set language tag tests in queries and to set language specific templates.

In order to customize the annotation that is generated with regards to format, you use the setOutputMarkupType method.

Three output formats are supported

• Microdata ('0'),
• RDFa 1.1 Lite ('1')
• JSON-LD ('2' but not yet implemented)

Example:

Willkommen in Berlin, der Heimat von Marlene Dietrich!

Source code:

<span
 its-ta-ident-ref="http://dbpedia.org/resource/Berlin"
 onclick="
  $.mlod4con.setLanguage('de');
  $.mlod4con.setMarkupTemplates('Place-specific,Place-general');
  $.mlod4con.setOutputMarkupType('1');
  $.mlod4con.run(this);">Berlin</span>

<span
 its-ta-ident-ref="http://dbpedia.org/resource/Marlene_Dietrich"
 onclick="
  $.mlod4con.setLanguage('de');
  $.mlod4con.setMarkupTemplates('Person-specific,Person-general');
  $.mlod4con.setOutputMarkupType('1');
  $.mlod4con.run(this);">Marlene Dietrich</span>

Installation

Download the MLOD4CON files and add the following to your HTML document:

<script src="jquery-1.11.1.min.js"></script>
<script src="mlod4consettings.json"></script>
<script src="mlod4con.js"></script>

If you simply want to create a page for demonstration purposes, also add the following textarea element. The generated markup will appear here:

<textarea name="myfield" id="myfield" rows="20" cols="40">
 Generated markup will appear here.</textarea>

Add entity identifiers as values for the its-ta-ident-ref attribute (see simple usage). The attribute is quite interesting (see details).

For all annotated entities, click on the highlighted words to generate the markup.

Configuration

The queries and the markup templates are configured in mlod4consettings.json. Click here to generate an HTML table (at the bottom of this page) that lists all options. Click here to generate XML (in the textarea to the right) that lists all options.

Anatomy of a query:

• name, e.g. dbpedia-query
• SPARQL endpoint, e.g.
  http://dbpedia.org/sparql?
• actual query string. During processing, the placeholder @@@entity@@@ is filled with the entity given via the its-ta-ident-ref attribute.
  The query string must contain a type variable. This is used to match the markup template type. It can also contain other variables that are taken up in the markup templates.
  The query may also contain language tags. These are expressed with the placeholder @@@language@@@.
• reference to one or more markup templates. The order is significant: the first template matched will be used for generating markup.

Anatomy of a markup template:

• type, e.g. person-general
• language. BCP 47 lookup is used to match the user language preference (given via the setLanguage method) to the language. If no language is given the default is used.
• mappings. Here one or more types are given. The output of the query, i.e. the value of the type variable, is used for matching the type.
• output in RDFa and Microdata (JSON-LD will follow). The output contains placeholders to be filled by variables, e.g. ##X##wikiPage##Y## to be filled by value of the wikiPage variable. A template is only used if all variables can be filled.

Additional Hints

Setting options values without JavaScript

All options for calling MLOD4CON can be set without JavaScript. The content author can also add a data-mlod4con attribute. It holds the options separated by semicolon. Example:

Willkommen in Berlin, der Heimat von Marlene Dietrich!

Source code:

<span
 its-ta-ident-ref="http://dbpedia.org/resource/Berlin"
 data-mlod4con=
  "language='de';
  markupTemplates='Place-specific,Place-general';
  outputMarkupType='1';">Berlin</span>

<span
 its-ta-ident-ref="http://dbpedia.org/resource/Marlene_Dietrich"
 data-mlod4con=
  "language='de';
  markupTemplates='Person-specific,Person-general';
  outputMarkupType='1';">Marlene Dietrich</span>

Getting identifiers for entities

The getEntityID method can be used generate identifiers. It takes an element as input and generates markup for its content. Example:

Welcome to Berlin, the home of Marlene Dietrich!

Source code:

<span
 onclick="$.mlod4con.getEntityID(this);">Berlin</span>
<span
 onclick="$.mlod4con.getEntityID(this);">Marlene Dietrich</span>

A form can be used to enter a string and look up the entity + generate markup. Example:

Type some stuff and then click here!:

Source code:

<span
 onclick="
 $.mlod4con.form2Markup($('#inputtext'));">click here</span> ...
 <input id="inputtext">...

Development Roadmap

This is the first version of MLOD4CON. It provides only a small set of templates and relies on DBpedia as sole SPARQL endpoint. Future versions of MLOD4CON may include:

• More multilingual queries by default
• More endpoints
• More markup templates
• Whatever you and other enthusiasts will help to brainstorm and implement :-)

Acknowledgements

MLOD4CON is being developed with support from the LIDER project. A special thanks goes to Christian Lieske (SAP SE) for commenting on early prototypes.

---

Contact

For questions, comments etc. contact Felix Sasaki (Felix AT sasakiatcf.com).