Unleash the Full Potential of Your PrestaShop Store

Welcome to MyPresta.eu – Your reliable partner in the e-commerce world. Find innovative modules that will take your business to a new level.

Secured SSL logo for prestashop

 

Today i want to show you how to create secured SSL logo in the bottom right corner. It's a nice gadget for your website and you can create it for free with our html block   free prestashop module. What i mean by SSL logo? Just check the image below or scroll this page down :) We added "Secured SSL" corner logo here.

 

What is SSL? It is possible to use it in PrestaShop?

SSL is a "Secure Sockets Layer". Is a part of security technology for encrypting the connection between website and a browser (customer browsing your website). It mean that hackers haven't got an access to the data trasfer between browser and prestashop store. Of course it is possible to use SSL certifacates in PrestaShop. SSL is today a most important part of e-commerce.

 

 

Logo of the SSL certificate in the right bottom corner

SSL security nice logo in the corner

As i said, the same logo is attached on this page, just scroll window down. You will see it above the zopim chat.

 

Creating own corner logo

In this case you have to download or free module for adding content to prestashop . Download this addon and install it in your store. You can also download this image:

 

secured badge free png presta

 

download url

 

http://i.imgur.com/PMKPlec.png

 

Now go to your back office, open the html block module configuration page. On the left hand side you've got list of available "hooks" for which you can add own content. Select any hook you want and insert there this code:

 

<div style="z-index:99999999999999999999; display: block; width: 132px; height: 130px; position: fixed; bottom: 0px; right: 0px; background: url('http://i.imgur.com/PMKPlec.png') no-repeat bottom right;"> 
</div>

What code above mean?

  1. z-index:99999999999999999999; moving the ssl badge to the front (It overlapping all content)
  2. display:block; defines the kind of the <div> element - its a block with defined width and height
  3. position:fixed; defines the kind of the <div> element position - it is fixed in the bottom right corner
  4. url(' http://i.imgur.com/PMKPlec.png')  it's a definition of the image displayed in the div block - in this case it is a badge, you can of course use own image.

 

 

 

 

 

 

Zdjęcie autora: Milosz Myszczuk

Artykuł napisany przez Milosza Myszczuka, eksperta PrestaShop i oficjalnego moderatora społeczności PrestaShop. CEO i założyciel agencji interaktywnej VEKIA. Dowiedz się więcej.

If you like this article, support our work!

Comments