How to Display Content on the PrestaShop Contact Page

In this blog, we are about to learn, how to Display Content on the PrestaShop Contact Page. So, we will define some of PrestaShop’s native hooks.

Personalizing the contact page in PrestaShop can be essential for making progress in client inclusion and giving productive information to your clients.

This blog will show up you how to appear custom substance on both the cleared-out and right columns of the PrestaShop contact page utilizing a custom module.

Let’s start:

1- Understanding Hooks in PrestaShop

We will use hooks like displayContactLeftColumn and displayContactRightColumn to include content within the left and right columns and displayContactContent to include content below contact form.

2- Displaying Content Using a Custom Module

In this example, we’ll create a custom module to display content in the left, right, and center columns of the contact page.

Step 1: Create the Custom Module

Create a new folder in the /modules/directory, for example, /modules/wktestmodule/. Inside this folder, create a PHP file named wktestmodule.php.

Here is the structure of the custom module:

<?php
if (!defined('_PS_VERSION_')) {
    exit;
}

class WkTestModule extends Module
{
    public function __construct()
    {
        $this->name = 'wktestmodule';
        $this->tab = 'front_office_features';
        $this->version = '1.0.0';
        $this->author = 'Webkul';
        $this->need_instance = 0;

        parent::__construct();

        $this->displayName = $this->l('Wk Test Module');
        $this->description = $this->l('Adds custom content to the contact page.');
    }

    public function install()
    {
        return parent::install()
&& $this->registerHook('displayContactLeftColumn') 
&& $this->registerHook('displayContactRightColumn') 
&& $this->registerHook('displayContactContent');
    }

    public function hookDisplayContactLeftColumn($params)
    {
        return '<div class="custom-left-column-content">This is custom text in the left column of the contact page.</div>';
    }

    public function hookDisplayContactRightColumn($params)
    {
        return '<div class="custom-right-column-content">This is custom text in the right column of the contact page.</div>';
    }

    public function hookDisplayContactContent($params)
    {
        return '<div class="custom-center-column-content">This is custom text in the center column of the contact page.</div>';
    }
}

Step 2: Install and Enable the Module

• Zip the wktestmodule folder.
• Go to the PrestaShop back office, navigate to Modules > Module Manager, and click on Upload a module.
• Upload the zipped file and install the module.

Step 3: Verify the Content Display

After installing and enabling the module, visit your store’s contact page. You should see custom text displayed in the left, right, and center columns.

3- Result

Here’s what the contact page looks like with the custom content added:

• Left Column: Displays the text “This is custom text in the left column of the page.”
• Right Column: Displays the text “This is custom text in the right column of the page.”
• Center Column: Displays the text “This is custom text in the center column of the page.”

Here’s an image that represents, how the custom content is displayed across the left, right, and center columns on the contact page.

Adding custom content to the left, right, and center columns of your PrestaShop contact page allows for a fully customized layout that can enhance the user experience.

By creating a custom module and using hooks, you can easily manage and display content across different parts of the page, tailoring the information to your store’s needs.

Note: Hook displayContactLeftColumn, displayContactRightColumn, and displayContactContent can be used only in the PrestaShop Version starting from V8.1.0

That’s all about this blog.

If any issues or doubts with the above step, please feel free to let us know in the comment section.

We would be happy to help.

You can also learn How to add an email layout and variables in a theme from a module

You can also explore our PrestaShop Development Services and a large range of quality PrestaShop Modules.

For any doubt contact us at [email protected].