Today I want to show you how to create customer login block. In this tutorial I will use free html block module for PrestaShop. What i mean by customer login block? Let me explain. By default prestashop dosn't allow to create block like this, you as a customer can only go to the authentication page, fill the form with your email and password and click login. So, the customer login block is a place in one of the column where yout customers can insert own credentials and hit "login" button. Exactly as i show on image below. You can also check demo of this code here: customer login block demo.
Prestashop Customer Login Block example

As I said - to achieve this it is necessary to use free module: html block. So, download this addon and install it in your prestashop back office. Then go to the module configuration page. From the available hooks on the left hand side - select the "left column" hook (if you want to display customer login block there) if you want to display block in the right column - select right column. You can also select other hooks like footer, header or top.
Okay, so now it's time to create own login block code. We want to create Dark Gray header "Login" and to create two fields: Email Address and Password. Of course "login" button is also necessary. Paste this code to the "content" box and save the changes. That's all - Here is the code:
<div class="block">
<form action="index.php?controller=authentication&back=my-account" method="post" id="login_form" class="std">
<p class="title_block" style="margin-bottom: 10px;">Login</p>
<div class="form_content clearfix">
<p class="text">
<label for="email">Email address</label>
<span><input type="text" id="email" name="email" value="" class="account_input" style="width: 192px;" /></span>
</p>
<p class="text">
<label for="passwd">Password</label>
<span><input type="password" id="passwd" name="passwd" value="" class="account_input" style="width: 192px;" /></span>
</p>
<p class="submit">
<input type="hidden" class="hidden" name="back" value="my-account" /> <input type="submit" id="SubmitLogin" name="SubmitLogin" class="button" value="Log in" />
</p>
</div>
</form>
</div>
After save you can go to your shop front-end and refresh it - you will see login block in the hook you selected. If it doesn't work - make sure that you use correct authentication page in the <form> definition in the code above. By default it looks like: index.php?controller=authentication&back=my-account
You can read also how to disable customer login block when user is logged in. if you've got any questions related to this topic - feel free to post your question below.
PopUp Login Block
Article written byMilosz Myszczuk, PrestaShop expert. CEO and founder of the VEKIA interactive agency. Learn more.
If you like this article, support our work!

Keep “Add to cart” visible on long product pages! Sticky Cart Bar FREE shows a slim, sticky stri...

Omnibus Directive Pro module for PrestaShop. It records price history and displays the lowest 30-day...
39.99 €

Free PrestaShop addon for EU Omnibus compliance. It automatically records price history and shows th...

Free Shipping Progress Bar is a free PrestaShop module: show shoppers how much is left for free deli...