Fix PrestaShop backoffice connection bug under Google Chrome

Tutorial to explain how to fix the bug on Prestashop with the Google Chrome browser and its version 99

Here is some day that the version 99 of the Google Chrome browser has arrived on the market and is distributed on the computers of users of this browser.

I'll spare you my opinion and the many "improvements" brought by this new version of this browser, but I draw your attention to a bug that appeared on Prestashop for users of this browser.

The community noticed this bug 4 days ago and a solution was brought yesterday to correct it.

It is during this kind of event that open source takes all its sense with a pooling of skills to quickly overcome the problems that can appear on a project.

The bug

The display of the backoffice connection form is disturbed on the processing of some CSS formatting classes as shown in the image below.

PrestaShop 1.6 and PrestaShop 1.7 fixes

You must correct the connection template as follows:

Open the file votre-dossier-admin/themes/default/template/controllers/login/content.tpl

Replace the lines

<div class="form-group">
 <div id="remind-me" class="checkbox pull-left">

By

<div class="form-group row">
 <div id="remind-me" class="checkbox col-xs-6">

Then replace the line

<a href="#" id="forgot-password-link" class="show-forgot-password pull-right" >

By

<a href="#" id="forgot-password-link" class="show-forgot-password col-xs-6 text-right">

Result

Conclusion

This bug is not blocking, so there is no urgency to fix it, especially if you have the good idea to prefer the FireFox browser.

Nevertheless, Google's attitude towards the respect of the W3C standards can push to make the standard evolve towards this treatment and thus bring the other browsers to conform to it, obliging you to make this correction so that it is taken into account on all the browsers.

Comments