Hello, I’m trying to install the “language-selector” with difficulties, here:
-the plugin has been unzipped and renamed language-selector in /user/plugins
I’ve added a line to the stylesheets block in /templates/partials/base:
{% do assets.addCss(‘theme://css/language.selector.css’) %}
and also a line in the javascript block of /templates/partials/base:
{% do assets.addJs(‘theme://js/language.selector.js’) %}
the /user/config/system.yaml has been modified to support -fr and -en languages
I’ve also installed two files, banner.en.md and banner.fr.md in my /01.home/_banner, to test when it works.
I’m trying to install the language-selector on the “banner” modular page of the “Mache” theme, so by pasting the line {% include ‘partials/language-selector.html.twig’ %}
here or there on the banner.html.twig, all I get is a little white rectangle, I guess I forgot something!
I haven’t found much info on this plugin (I mean other than the ones specified on the Grav site, or Github), I’ve managed with greater ease to test the other plugin (langswitcher) but here … I’m stuck.
Thanks in advance to Pamtbaau, and i salute him , who I hope will be able to point me in the right direction where I’ve lost my way.
I think it is not necessary to load js and css resources from the selector plugin in your base.html.twig, because they are already loaded by the plugin itself (see language-selector.php):
// Manage Assets
$this->grav['assets']->add('plugin://language-selector/js/language-selector.js');
if ($this->config->get('plugins.language-selector.built_in_css')) {
$this->grav['assets']->add('plugin://language-selector/css/language-selector.css');
}
In the case of CSS you must have the built_in_css variable set to true
On the other hand, could you indicate a link to the page from which you are trying this?. Maybe this way we could do some type of debugging from the browser itself, to see if the assets are loading properly and other types of problems.
Also keep in mind that this plugin has not received any updates for more than years. Maybe LangSwitcher is more suitable. Check out how Langswitcher works in the Editorial theme demo (the privacy page is the only one translated):
The README doesn’t say anything about copying the assets, so don’t…
You cannot add the language selector inside the template of a child module (eg. banner), because it will then redirect to the url of the child module itself, instead of the parent modular.
You should probably add the language selector inside base.html.twig, somewhere near where the navigation is created.
And lastly, positioning the language selector correctly (in Mache) isn’t that easy. At least, in the amount of time I was willing to give it, I didn’t succeed to get a proper positioning…
Apart from the above, the language selector itself works as expected.
Hi Pmoreno, I can confirm that "built_in_css "is set to “true” in the “language-selector.yaml” page, and regarding your question about whether the assets load or not, I don’t know how to tell you, as I don’t know enough about it.
What I can tell you is that I’ve been experimenting for quite some time in order to build a site, and so I do things, I take things away, I keep things, but it’s not all done in a conventional way like a professional would do.
For example, I no longer make progress using the site’s admin console (because I’m not good at memorizing instructions and applying them!), but I do closely observe how themes or skeletons are built (in their interactions between the constituent elements) using the Atom software and the browser inspector, then I test, copy, paste and delete until I get it right.
This may sound ridiculous to some, but I’m more comfortable this way, and it avoids cluttering up the forum with help requests that are often confusing for Grav IT professionals.
So with my unorthodox methods I don’t know how to inform you about debugging in the browser to find out if the assets are loading.
I’ll continue my tests today to give more details on the difficulties I’m encountering, thanks for your help.
Have a nice day.
The error invoked each time and for several places where I want to paste the line {% include…} on /templates/partial/base, refers to the Twig.php file:
/var/www/onze/system/src/grav/common/twig/twig.php
and in particular line 361 throw new RuntimeException ($error_msg, 400, $e);
I guess it’s impossible to paste it on the basic twig according to the settings already entered in the twig.php system?
Here’s what I found in grav.log about my last attempt; a line to say that the plugin exists but it’s not found, with a hint to clean the cache (which I did just before!) and a line that I can’t interpret, here it is:[2023-09-14 11:11:17] grav.CRITICAL: Template "error.ico.twig" is not defined. - Trace: #0 /var/www/onze/system/src/Grav/Common/Service/OutputServiceProvider.php(27): Grav\Common\Twig\Twig->processSite('ico') #1 /var/www/onze/vendor/pimple/pimple/src/Pimple/Container.php(118): Grav\Common\Service\OutputServiceProvider->Grav\Common\Service\{closure}(Object(Grav\Common\Grav)) #2 /var/www/onze/system/src/Grav/Common/Processors/RenderProcessor.php(19): Pimple\Container->offsetGet('output') #3 /var/www/onze/system/src/Grav/Common/Grav.php(132): Grav\Common\Processors\RenderProcessor->process() #4 /var/www/onze/system/src/Grav/Common/Grav.php(374): Grav\Common\Grav->Grav\Common\{closure}() #5 [internal function]: Grav\Common\Grav::Grav\Common\{closure}('render', 'Render', Object(Closure)) #6 /var/www/onze/system/src/Grav/Common/Grav.php(350): call_user_func_array(Object(Closure), Array) #7 /var/www/onze/system/src/Grav/Common/Grav.php(133): Grav\Common\Grav->__call('measureTime', Array) #8 /var/www/onze/index.php(52): Grav\Common\Grav->process() #9 {main} [] []
(there may be another way to paste text from grav.log, on the forum, please let me know for next time.)
Do you have the error.ico.twig file somewhere?. It seems that part of the error refers to that file. error.ico.twig does not appear to be a valid file in Grav. Could it be error.html.twig or ico.html.twig?
In order to paste the code correctly in this forum you must wrap it in three backticks (like this ` ), before the first line and after the last one . For example:
This is code wrapped in
```code here```
You can use Google Chrome’s developer tools to be able to debug a website and see if assets are loading correctly or if they are failing somewhere.
Copy the language-selector.html.twig from plugin/partials folder to your child theme templates/partials folder. In this file select all code and paste the following:
<li>
<a class="btn" role="button" data-dropdown="langSelectorList">
{% if language_display.button == 'default' or language_display.button == 'flag' %}
<img alt="{{ native_name(language_selector.current)|capitalize }}" src="{{ path_flags ~ language_selector.current }}.png" />
{% endif %}
{% if language_display.button == 'default' or language_display.button == 'name' %}
{{ native_name(language_selector.current)|capitalize }}
{% endif %}
<i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu" id="langSelectorList">
{% for language in language_selector.languages %}
{% set show_language = true %}
{% if language == language_selector.current %}
{% set lang_url = page.url %}
{% else %}
{% set base_lang_url = base_url_simple ~ grav.language.getLanguageURLPrefix(language) %}
{% set lang_url = base_lang_url ~ language_selector.page_route ~ page.urlExtension %}
{% set untranslated_pages_behavior = grav.config.plugins.language_selector.untranslated_pages_behavior %}
{% if untranslated_pages_behavior != 'none' %}
{% set translated_page = language_selector.translated_pages[language] %}
{% if (not translated_page) or (not translated_page.published) %}
{% if untranslated_pages_behavior == 'redirect' %}
{% set lang_url = base_lang_url ~ '/' %}
{% elseif untranslated_pages_behavior == 'hide' %}
{% set show_language = false %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% if show_language %}
<li>
<a href="{{ lang_url ~ uri.params }}">
{% if language_display.select == 'default' or language_display.select == 'flag' %}
<img alt="{{ native_name(language)|capitalize }}" src="{{ path_flags ~ language }}.png" />
{% endif %}
{% if language_display.select == 'default' or language_display.select == 'name' %}
{{ native_name(language)|capitalize }}
{% endif %}
</a>
</li>
{% endif %}
{% endfor %}
</ul>
</li>
Copy the navigation.html.twig from your Mache theme (parent) to your child folder (template/partials). In this file select all code and paste the following:
<ul>
{% if page.template == 'modular' %}
{% for module in page.collection() if module.header.menu %}
<li class="menu-item{% if loop.index == 1 %} active{% endif %}">
<a href="#{{ module.folder|trim('_') }}" data-scroll>{{ module.header.menu }}</a>
</li>
{% endfor %}
{% include 'partials/language-selector.html.twig' %}
{% else %}
{% for p in pages.children.visible %}
{% set current_page = (p.active or p.activeChild) ? ' active' : '' %}
<li class="menu-item{{ current_page }}">
<a href="{{ p.url }}">{{ p.menu }}</a>
</li>
{% endfor %}
{% include 'partials/language-selector.html.twig' %}
{% endif %}
</ul>
The plugin’s built-in variable must be set to false.
This would be enough for the plugin to work, in the navigation bar, but for my taste, there are some styles to improve to adapt it well to this theme, but I have to leave that in your hands.
About error.ico.twig; I have the impression that it is generated for the “log” folder (a non-specialist’s assumption), I can only find it in this folder in any case!
Thanks for the code tip on the forum (Pamtbaau must have explained it to me a long time ago and I didn’t look hard enough to find it).
Thank you also and especially for your work, I will test this in the evening or tomorrow morning and would tell you. Have a nice evening.