Magento 2 : Invalid Key. Please Refresh The Page as we create / login to account

I have installed LAMP (Stack) to my Ubuntu laptop and successfully installed Magento 2.x

So the problem occurred when I need to log in with the customer account at the front-site

I have error message “Magento 2 : Invalid Key. Please Refresh The Page”

so here is the solution I’ve done before

  1. Edit my php.ini files and increase php_value_max_input_vars to 75000 or higher.
  2. Restart my apache server
  3. Clear browse cache
  4. Try to login/create account again

Magento 2 Translation Templates Override/Replace

Create Custom Theme based on parent theme

Let’s say we will create a custom theme based on Magento/luma as parent. We have to create three required files to add custom theme in magento 2 under directory apps/design/frontend/Silumansupra/default

  • theme.xml
  • registration.php
  • composer.json

Magento 2 Custom Theme Configuration - SilumanSupra.com

So your app/design/frontend/Silumansupra/default/theme.xml

file should look something like this:

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../lib/internal/Magento/Framework/Config/etc/theme.xsd">
  <title>Custom Silumansupra</title>
  <parent>Magento/luma</parent>
</theme>

Next, we have to create registration.php

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
     <title>SilumanSupra Custom Theme</title> <!-- your theme's name -->
     <parent>Magento/luma</parent> <!-- the parent theme, in case your theme inherits from an existing theme -->
 </theme>

And now we create composer.json file

{
    "name": "silumansupra/custom",
    "description": "N/A",
    "require": {
        "php": "~5.5.0|~5.6.0|~7.0.0",
        "magento/theme-frontend-blank": "*",
        "magento/framework": "*"
    },
    "type": "magento2-theme",
    "version": "100.0.1",
    "license": [
        "OSL-3.0",
        "AFL-3.0"
    ],
    "autoload": {
        "files": [
            "registration.php"
        ]
    }
}
Change Configuration Theme on backoffice

Login to your backoffice/admin page and change theme configuration at Content – Configuration.

Magento 2 Custom Theme Configuration - SilumanSupra.com

Create transaction file

As we will override/replace string in Customer Login page, we have to create translation file under apps/design/frontend/Silumansupra/default/i18n

Create file en_US.csv under directory structure above.  We can create (or you can just copy paste from magento 2 default theme files). Here we will use en_US.csv file in vendor/magento/theme-frontend-luma/i18n/en_US.csv and replace some strings with our own.

For example, we will change String “Customer Login” to “Customer Login Custom” in login page.

"Customer Login","Customer Login Custom"

Magento 2 Custom Theme Configuration - SilumanSupra.com

You can cache:flushafter save and change translation files in editor and then refresh the page.

Reference:

  • https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/translations/theme_dictionary.html
  • https://www.mageplaza.com/devdocs/how-to-create-magento-2-theme.html