Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Interestingly enough, I was searching exactly NOT for a question like yours, but while reading I realized that your question is one that I had been through quite some time ago</p> <p>It was basically a system to parse a dictionary and spits augmented HTML.</p> <p>My suggestion would include instead:</p> <ol> <li>Use database if you want, but a cached generated CSV file could be faster to use as dictionary</li> <li>Use a hook in your rendering system to parse the actual content within this dictionary</li> <li>caching of the page could be useful too</li> </ol> <p><a href="http://renoirboulanger.com/blog/2010/02/plugin-modx-pour-generer-automatiquement-les-balises-abbr-et-autres-pour-chaque-page/#stackoverflow" rel="nofollow noreferrer">I elaborated a solution on my blog</a> (in French, sorry for that). But it outlines basically something that you can actually use to do that.</p> <p>I called it "<a href="http://renoirboulanger.com/wp-content/uploads/2010/02/ContentAbbrGenerator/ContentAbbrGenerator.txt" rel="nofollow noreferrer">ContentAbbrGenerator</a>" as a MODx plugin. But the raw of the plugin can be applied outside of the established structure.</p> <p>Anyway you can download the zip file and get the RegExes and find a way around it.</p> <p><strong>My objective</strong></p> <ol> <li>Use one file that is read to get the kind of html decoration.</li> <li>Generate html from within author entered content that doesnt know about accessibility and tags (dfn and or abbr)</li> <li>Make it re-usable.</li> <li>Make it i18n-izable. That is, in french, we use the english definition but the adaptative technology reads the english word in french and sounds weird. So we had to use the lang="" attribute to make it clear.</li> </ol> <p><strong>What I did</strong></p> <p>Is basically that the text you give, gets more semantic.</p> <p>Imagine the following dictionary:</p> <pre><code>en;abbr;HTML;Hyper Text Markup Language;es en;abbr;abbr;Abbreviation </code></pre> <p>Then, the content entered by the CMS could spit a text like this:</p> <pre><code>&lt;p&gt;Have you ever wanted to do not hassle with HTML abbr tags but was too lazy to hand-code them all!? That is my solution :)&lt;/p&gt; </code></pre> <p>That gets translated into:</p> <pre><code> &lt;p&gt;Have you ever wanted to do not hassle with &lt;abbr title="Hyper Text Markup Language" lang="es"&gt;HTML&lt;/abbr&gt; &lt;abbr title="Abbreviation"&gt;abbr&lt;/abbr&gt; tags but was too lazy to hand-code them all!? That is my solution :)&lt;/p&gt; </code></pre> <p>All depends from one CSV file that you can generate from your database.</p> <p><strong>The conventions I used</strong></p> <ol> <li>The file /abbreviations.txt is publicly available on the server (that could be generated) is a dictionary, one definition per accronym</li> <li>An implementation has only to read the file and apply it BEFORE sending it to the client</li> </ol> <p><strong>The tooltips</strong></p> <p>I strongly recommend you use the tooltip tool that even Twitter Bootstrap implements. It basically reads the title of any marked up tags you want.</p> <p>Have a look there: <a href="http://twitter.github.com/bootstrap/javascript.html#tooltips" rel="nofollow noreferrer">Bootstrap from Twitter with Toolip helper</a>.</p> <p>PS: I'm very sold to the use of the patterns Twitter put forward with this Bootstrap project, it's worth a look!!</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload