Modificar longitud de nombre de usario en header

[Pedro.O]

Hola a todos.

Quiero modificar el header de la plantilla Classic, Prestashop 8.1.7

Lo que quiero es acortar a 10 caracteres el nombre que aparece en el Header cuando el usuario esta logueado.

(adjunto imagen)

Como puedo hacerlo?

desde ya muchas gracias.

[WebDesk Solution]

@Pedro.O

To modify the username length displayed in the header in the PrestaShop 8 Classic theme, follow these steps:

Step 1: 
Open (or create) a custom JavaScript file to add the custom code. The file is typically located at
File Path: themes/classic/assets/js/custom.js

Step 2:
Paste the following code into the custom.js file

document.addEventListener("DOMContentLoaded", function() {
    // Select the username element in the header
    const userInfo = document.querySelector('#_desktop_user_info .user-info .account');

    if (userInfo) {
        // Clean up whitespace and special characters
        let username = userInfo.textContent.trim().replace(/\n/g, '').replace(//g, '').trim();
          
        userInfo.setAttribute("title", username)
          
        // Trim the username to 10 characters and add "..."
        if (username.length > 10) {
            username = username.substring(0, 10) + '...';
        }

        // Update the displayed username
        userInfo.textContent = username;
    }
})

Step 3:
In your PrestaShop admin panel, go to Advanced Parameters > Performance, and click Clear Cache.

Step 4:
Visit the frontend to confirm that the username length is updated in the header. Review the screenshot for reference if needed.

We hope this solution works for you!

[Pedro.O]

Gracias por la respuesta, he seguido al pie de la letra los 4 pasos indicados en sus instrucciones, pero no dio resultado.

 

Adjunto captura de pantalla despues de haber aplicado los 4 pasos.

Alguna otra idea?

Saludos Cordiales.

 

[WebDesk Solution]

@Pedro.O

Thank you for your response. To fulfill your requirement, please follow these steps:

Go to your theme directory and locate the ps_customersignin. The tpl file is in this path: themes/classic/modules/ps_customersignin/.

Open the file, and find the following code:

<span class="hidden-sm-down">{$customerName}</span>

Replace it with this updated code:

<span class="hidden-sm-down">{$customerName|truncate:10:"":true}</span>

After making this change, clear the cache and check the front end. This should resolve your issue.

 

[Pedro.O]

6 hours ago, WebDesk Solution said:

@Pedro.O

Thank you for your response. To fulfill your requirement, please follow these steps:

Go to your theme directory and locate the ps_customersignin. The tpl file is in this path: themes/classic/modules/ps_customersignin/.

Open the file, and find the following code:

<span class="hidden-sm-down">{$customerName}</span>

Replace it with this updated code:

<span class="hidden-sm-down">{$customerName|truncate:10:"":true}</span>

After making this change, clear the cache and check the front end. This should resolve your issue.

 

Genial, despues de hacer esta modificacion, tal cual indica, he podido solucionar el tema y quedo muy bien.

 

Gracias WebDesk Solution.

Saludos Cordiales.