JTL-Shop 5 Footer
Payment methods and logos in your JTL-Shop 5 Footer
How to manage your JTL-Shop 5 footer and add, for example, payment methods and logos to it. We also show you how to manage the blocks for your footer layout. Follow our step-by-step guide in this article, as well as the video below.
Our JTL-Shop 5 Tutorials
Today we’re adding another piece to our series of JTL-Shop 5 articles and videos. The topic this time is the
Footer of your JTL-Shop 5. If you missed our previous videos you can get to the playlist by following this link.
Manage Footer Settings
The settings for your Footer can be found in your JTL-Shop 5 Backend, under Depiction and then Standard Elements -> Footer/Boxes. To edit your footer scroll down. Here you can see an already set box with the payment methods. To add another box select a type of box. In our example we select one with a heading apply it. Then you can set the sorting order. Because we’re already happy with its position we leave it as it is.
Payment Methods in your Footer
In general it all looks like this. It is recommended however, to put 10 spaces in between, since it allows you to add another box in those gaps if you wish. To edit this box, click on the edit symbol and adjust the content. We took for our example the Payment methods, which in most cases consist not only of texts but also of images. There are many mistakes we could make here.
Optimize your Logo images
If we upload high resolution images, we could have them adjusted thanks to the CSS code but as we already learned in previous videos this can affect your page speed significantly and in turn your SEO. If you missed that video you can catch up via the link on the top right of your screen. It’s recommended to create a file that is 90 to 50 px and with a white background which you can use as a template to adjust all of your logos. This way you maintain a small file size along with the correct file name and keep everything visually pleasing as well as optimized.
Finish your Footer & check it out
So we uploaded our logos by clicking on the image symbol and the searched for the appropriate images on our server. Additionally you can work with the Alternative text which is also relevant for your SEO. If you save everything as it is now your logos will be visible bit possibly connected to each other. That’s why we adjusted the source code to add gaps, with a Style flag. And this is the final result in our footer looks like. As you saw you have to go through it step by step in order to keep the result visually nice and also optimized.