Fix i18n examples

pages/11.i18n/docs.md

@@ -7,16 +7,13 @@ process:
 never_cache_twig: true
 ---
 
+{% do assets.addJs('https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/i18n/es.js', 90) %}
+
 ## Multiple languages (localization)
 
-Select2 supports displaying the messages in different languages, as well
-as providing your own
-<a href="options.html#language">custom messages</a>
-that can be displayed.
+Select2 can load message translations for different languages from language files.
 
-The language does not have to be defined when Select2 is being
-initialized, but instead can be defined in the <code>[lang]</code>
-attribute of any parent elements as <code>[lang="es"]</code>.
+The language does not have to be defined when Select2 is being initialized, but instead can be defined in the `[lang]` attribute of any parent elements as `[lang="es"]`.
 
 <div class="s2-example">
     <p>
@@ -31,11 +28,18 @@ $(".js-example-language").select2({
 });
 ```
 
+<script type="text/javascript">
+    $(".js-example-language").select2({
+      language: "es"
+    });
+</script>
+
+You may alternatively provide your own custom messages to be displayed.
+
+
 ## RTL support
 
-Select2 will work on RTL websites if the <code>dir</code> attribute is
-set on the <code>&lt;select&gt;</code> or any parents of it. You can also
-initialize Select2 with <code>dir: "rtl"</code> set.
+Select2 will work on RTL websites if the `dir` attribute is set on the `<select>` or any parents of it. You can also initialize Select2 with the `dir: "rtl"` configuration option.
 
 <div class="s2-example">
     <p>
@@ -49,11 +53,15 @@ $(".js-example-rtl").select2({
 });
 ```
 
+<script type="text/javascript">
+    $(".js-example-rtl").select2({
+      dir: "rtl"
+    });
+</script>
+
 ## Transliteration support (diacritics)
 
-Select2's default matcher will ignore diacritics, making it easier for
-users to filter results in international selects. Type "aero" into the
-select below.
+Select2's default matcher will transliterate diacritic-modified letters into their ASCII counterparts, making it easier for users to filter results in international selects. Type "aero" into the select below.
 
 <div class="s2-example">
   <p>
@@ -75,3 +83,7 @@ select below.
 ```
 $(".js-example-diacritics").select2();
 ```
+
+<script type="text/javascript">
+    $(".js-example-diacritics").select2();
+</script>

themes/site/templates/partials/base.html.twig

@@ -33,12 +33,12 @@
     {% block javascripts %}
         {% do assets.addJs('jquery',101) %}
         {% do assets.addJs('theme://js/modernizr.custom.71422.js',100) %}
+        {% do assets.addJs('https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.full.min.js', 100) %}
+        {% do assets.addJs('https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js', 100) %}
         {% do assets.addJs('theme://js/featherlight.min.js') %}
         {% do assets.addJs('theme://js/clipboard.min.js') %}
         {% do assets.addJs('theme://js/jquery.scrollbar.min.js') %}
         {% do assets.addJs('theme://js/learn.js') %}
-        {% do assets.addJs('https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.full.min.js') %}
-        {% do assets.addJs('https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js') %}
         {% do assets.addJs('theme://js/data-fill-from.js') %}
         {{ assets.js() }}