Drupal9开发的网站后登陆时,白龙网发现,后台登陆界面非常难看,甚至样式都是错乱不堪的。要做好该界面的排版工作,着实要花点时间去捣鼓。实践中发现,使用gin_login模块就可以非常轻松的让登陆界面漂亮美观起来。
一、模块的使用
1.下载gin_login模块,并在线安装、启用;
2.在“管理->扩展->gin_login”中点击“configure”按钮,在弹出的界面可以自定义登陆界面的LOGO与侧边图片。
3.至此,一个漂亮的后台登陆界面就配置成功了,省去了重新写样式调试排版的问题。
二、按钮的修改
Drupal9中有3类不同的按钮:搜索按钮、在线留言提交按钮、后台登陆按钮等,实际上他们都是来自form表单submit类型的输入框input。因此,通过模板给任何一个submit类型的输入框input添加value值,那么导致的结果就会使站内所有“提交、登陆、搜索”按钮变成相同的内容,即value值。
例如,我们给input--submit.html.twig模板内submit类型的输入框input添加value值“搜索”,则在线留言按钮、后台登陆按钮都变成了“搜索”值。所以,需要单独的修改三种类型按钮的值,以达到有区别的打印输出不同的内容。搜索按钮与在线留言按钮值的修改方法在《》《》在已经分享过,今天重点来梳理下后台登陆界面中登陆按钮值的修改方法。
默认情况下,安装完gin_login模块后,登陆界面的登陆按钮值为“login”,如果我们想把”login”修改成“登陆”,需要怎么做呢?复杂的办法是把整个网站汉化了,那么“login”自然就变成了“登陆”,仅仅为了一个地方的修改,就汉化整个网站,似乎时间成本有些高,得不偿失。其实,我们只需要写一个JS放到指定的位置,即可修改“login”值。
打开\htdocs\modules\gin_login\templates\page--user--login.html.twig模块,在该代码后:
{{ page.content|without('claro_primary_local_tasks', 'gin_primary_local_tasks') }}
放上如下JS代码:
<script> var buttonlogin = document.getElementsByClassName('button-login'); buttonlogin[0].value = '登陆'; </script>
重建缓存后,再次到登陆界面,你会发现,“login”已经被成功修改为“登陆”了。需要说明的是,button-login是登陆提交按钮input的一个类名。使用该方法,我们可以修改任何你想修改,但是又找不到在什么地方修改的内容。
白龙网认为,有关登陆界面其它内容如用户名、密码、创建帐号、忘记密码等内容的修改,根据debug提示,找到相应模板修改即可。