• Priority: 0
  • Status: Closed
  • Theme: Alysum
  • Assigned To: Fred
  • Private: No
  • Open Date: 29.07.22, 20:37
  • Opened by: Eric Notarianni
  • Closed by: Anonymous Submitter
  • Closed on:
  • Reason: Not a bug

Ticket #23619 - menu images problem

hello Fred,

in our menu on boutique.idms.fr

we have the option boutique idms, i have images of different categories in this option , but the images charged of these catagories are very heavy, how to modify the menu for having images categories less heavy for example to have the medium default of the categories or small defaut , please , because the images taken are very loud, i think it takes category default images

thanks to let me know

Comments

Fred 30 Jul 2022, 10:22

Hi, Eric.
For some reason I’m not even able to enter your back office, it just show the maintenance page.
Could you please add my IP to let me see your website - 95.172.173.216

Eric Notarianni 30 Jul 2022, 13:03

sorry , i have forget to update the url to go to administration, now you have the good one to enter in the administration i have updated the links in the profile here
try again please with the good url

Eric Notarianni 30 Jul 2022, 15:09

now it is good !

Fred 30 Jul 2022, 20:35

Do you mean the problem is resolved? Because I see menu images now

Eric Notarianni 30 Jul 2022, 21:55

no Fred it is not solved
the problem comes of the image of each category, in the menu it takes the full image more than 300K
for each images, i will like to have in the menu the image of category the thumb image , of the medium-default category image or small dfault category image.
actually each image has more than 300k and the page now has 6mb weight !!
i want for this 9 images the version of small image in kb, do you understand me ?
the menu takes the cover of each category not the small versions, how to do that in css perhaps

Eric Notarianni 02 Aug 2022, 13:47

in prestashop category , i see that i can a miniature for menu, but it depands of the menu of thetheme to be taken.

i have made a try but it seems that the menu of the theme don’t take the miniature of your menu, always i have the cover image of the category

Fred 03 Aug 2022, 13:43

There are two option for the category image
1. Display the main image as you have now.
2. Display “thumb” image that you can also define in the category settings.
To have the second option you have to open the file

/modules/pk_menu/pk_menu.php

find the line

if (file_exists(_PS_CAT_IMG_DIR_.$category->id_category.'-category_default.jpg')) {

and replace it with

if (file_exists(_PS_CAT_IMG_DIR_.$category->id_category.'_thumb.jpg')) {
Eric Notarianni 04 Aug 2022, 16:52

hello fred
i have update the file with the line
if (file_exists(_PS_CAT_IMG_DIR_.$category→id_category.’_thumb.jpg’)) {

but the images are always image default of the category
i have made this here see the file in the attached file
let me know what to do in more ?

Attachments:

unnamed.png (39.2 KiB)
Eric Notarianni 04 Aug 2022, 18:32

i see the source file html and i see always that the images are taken in the default of the categorie in the menu

<div class="pk-sub-menu menu-dropdown dd_view col-xs-12 col-md-9 col-lg-8 owl-sub-auto collapse" id="top_sub_menu_25866">
																							<div class="pk-menu-row row VIDEOSURVEILLANCE">
																														<div class="pk-menu-col col-xs-12 col-sm-4 col-lg-3 ">
																									<ul class="ul-column">
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/11-videosurveillance">
																	<img src="https://boutique.idms.fr/c/11-category_default/videosurveillance.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/11-videosurveillance">Vidéosurveillance</a>
																																													</li>
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/25-destockage">
																	<img src="https://boutique.idms.fr/c/25-category_default/destockage.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/25-destockage">Destockage</a>
																																													</li>
																										</ul>
																							</div>
																					<div class="pk-menu-col col-xs-12 col-sm-4 col-lg-25 ">
																									<ul class="ul-column">
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/20-controle-d-acces">
																	<img src="https://boutique.idms.fr/c/20-category_default/controle-d-acces.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/20-controle-d-acces">Contrôle d&#039;accès</a>
																																													</li>
																											<li class="menu-item  item-line">
																																																															<a href="https://boutique.idms.fr/170-portiques-et-barrieres">Portiques et Barrières</a>
																																													</li>
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/22-affichage">
																	<img src="https://boutique.idms.fr/c/22-category_default/affichage.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/22-affichage">Affichage</a>
																																													</li>
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/340-produits-factices">
																	<img src="https://boutique.idms.fr/c/340-category_default/produits-factices.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/340-produits-factices">Produits factices</a>
																																													</li>
																										</ul>
																							</div>
																					<div class="pk-menu-col col-xs-12 col-sm-4 col-lg-25 ">
																									<ul class="ul-column">
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/19-alarme">
																	<img src="https://boutique.idms.fr/c/19-category_default/alarme.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/19-alarme">Alarme</a>
																																													</li>
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/23-cables-et-connectiques">
																	<img src="https://boutique.idms.fr/c/23-category_default/cables-et-connectiques.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/23-cables-et-connectiques">Câbles et connectiques</a>
																																													</li>
																										</ul>
																							</div>
																					<div class="pk-menu-col col-xs-12 col-sm-4 col-lg-3 ">
																									<ul class="ul-column">
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/21-interphonie">
																	<img src="https://boutique.idms.fr/c/21-category_default/interphonie.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/21-interphonie">Interphonie</a>
																																													</li>
																											<li class="menu-item  item-header">
																																																															<a href="https://boutique.idms.fr/24-baies-et-accessoires">
																	<img src="https://boutique.idms.fr/c/24-category_default/baies-et-accessoires.jpg" alt="" class="menu_cat_preview" width="300" height="100">
																</a>
																																																																<a href="https://boutique.idms.fr/24-baies-et-accessoires">Baies et accessoires</a>
																																													</li>
																										</ul>
																							</div>
																											</div>
																				</div>
Eric Notarianni 04 Aug 2022, 20:39

an idea also it seems when i see in the category page that the the thumb is in .png
perhaps i must replace
if (file_exists(_PS_CAT_IMG_DIR_.$category→id_category.’_thumb.jpg’)) {

by
if (file_exists(_PS_CAT_IMG_DIR_.$category→id_category.’_thumb.png’)) {

let me know please

Fred 05 Aug 2022, 11:03

I have changed “large” image to “medium” old code

$img = $this->context->link->getCatImageLink($category->link_rewrite, $category->id_category, ImageType::getFormattedName('category'));

updated code

$img = $this->context->link->getCatImageLink($category->link_rewrite, $category->id_category, ImageType::getFormattedName('medium'));
Eric Notarianni 05 Aug 2022, 11:43

hello thanks Fred it is better , i try to optimize the page to be less heavy but it is always around 4MB
have you ideas to optimize more i have compressed the image of categories but….

Fred 05 Aug 2022, 12:01

I would recommend to reduce the number of slides. And Optimize images before upload to the slider