how to specify thumnais image size in sub menu
i would like to manage max size image from category thumnails
Regards
3 answers
Hi Philippe Bach,
I wonder which menu sub item you referred to?
Supposed that you want to adjust the max-size of the menu item “Service” on our demo: http://megamenu.magento2.demo.ubertheme.com/
(When hovering the menu item “Service” -> Gear -> you should see an thumbnail)
In order to change the max-width of this image, you can follow steps below:
Step1: copy this file: app\code\Ubertheme\UbMegaMenu\view\frontend\web\css\source\module\_horizontal.less to the folder: app\design\frontend\YOUR_BRAND\YOUR_THEME_NAME\Ubertheme_UbMegaMenu\web\css\source\module
(You need to create the same folder structure, if it does not exist yet)
Step 2: Open the app\design\frontend\YOUR_BRAND\YOUR_THEME_NAME\Ubertheme_UbMegaMenu\web\css\source\module\_horizontal.less, around the line 318, you can change the max-width as you want.
Step 3: Once done, you re-compile LESS -> CSS as follows:
You should back up your site first. Once done, you access your server via SSH and navigate to your Magento 2 folder, then run the following commands one by one:
Step 1: php bin/magento maintenance:enable
Step 2: rm -rf var/di/* var/generation/* var/cache/* var/log/* var/page_cache/* var/session/* var/view_preprocessed/* pub/static/frontend/YOUR_BRAND/YOUR_THEME_NAME/*
Step 3: php bin/magento setup:static-content:deploy -t YOUR_BRAND/YOUR_THEME_NAME -language sl_SI -f (Make sure you are using developer (or default) mode)
Step 4: php bin/magento cache:flush
step 5: php bin/magento maintenance:disable
Step 6: clear your browser cache
If you referred to another image, please let me know the url of your dev instance, and the specific menu item you want to change, we will check further and get back to you then.
Best Regards,
Ziven.
this work when you use a custom image but if you use
Menu Thumbnail
The category image will be used as the featured thumbnail of the menu item.
it doesnt work
Regards Philippe
Hi Philippe,
this work when you use a custom image but if you use
Menu Thumbnail
The category image will be used as the featured thumbnail of the menu item.
In order to change the max-width of the category image, you can follow similar steps as mentioned in my previous reply, except for adding new CSS definition in the Step 2 as follows:
Step1: (similar to my reply #1)
Step 2: Open the app\design\frontend\YOUR_BRAND\YOUR_THEME_NAME\Ubertheme_UbMegaMenu\web\css\source\module\_horizontal.less, navigate to the line 1178 and add the new declaration below:
.category-thumb {
img {
max-width: 100%;
}
}
(Like this screenshot: https://www.dropbox.com/s/h2v0l7ogc67wewb/2019-10-09_09-50-21.png?dl=0)
Here you can define your own width/height as you want.
Step 3: (similar to my reply #1)
Hope that helps.
Best Regard,
Ziven.