Home Forums Hitek Support Forum Product Builder Image Gallery Widget Size

This topic contains 14 replies, has 2 voices, and was last updated by Artem Temos Artem Temos 2 weeks, 5 days ago.

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #321761

    newsprince
    Staff

    Hello.

    In product builder your widget > Gallery that shows the product image with the thumbnails it doesn’t have an option to set the image width.

    How to do it?

    #321865

    Hello,

    Product images width can be set globally only via Dashboard -> Appearance -> Customize -> WooCommercce -> Product images. You can set a different size for product images on a particular product page.

    Kind Regards

    #321868

    newsprince
    Staff

    No it is not right to set it globally. This is different functionality.

    We are talking about widget’s style option. You should add the same option as elementor’s image widget style settings.

    Attachments:
    You must be logged in to view attached files.
    #321870

    Would you be so kind and send us this screenshot in English so we can better understand what are you talking about? 🙂

    #321871

    newsprince
    Staff

    Sure

    Attachments:
    You must be logged in to view attached files.
    #321873

    Yes, but it is just a single image, it is not a dynamic product images gallery. It can’t have such options and simply ignore global WooCommerce settings.

    #321875

    newsprince
    Staff

    Yes but it’s in the widget’s scope to have these options. It can inherit them via global woo settings but the widgets have their own functionality.

    Anyway i’ll do it via custom css..

    #322004

    Yes, but this element has a too complicated logic behind and it is not as easy to implement custom image size there and not break anything like images lightbox, variations images, etc.

    Kind Regards

    #322098

    newsprince
    Staff

    @artem Temos.

    No offense here, i believe you are one of the best team in market and produce the best themes but telling me that this element has a too complicated logic to implement a width image size option for the image product builder widget is plain excuse.

    I added a few lines of code based on elementor’s guide and it works just like i described.

    Here is the code

    $this->add_responsive_control(
    			'main_image_width',
    			array(
    				'label'      => esc_html__( 'Images Block Width (%)', 'xts-img-width-builder' ),
    				'type'       => Controls_Manager::SLIDER,
    				'size_units' => array( '%' ),
    				'range'      => array(
    					'%' => array(
    						'min' => 0,
    						'max' => 100,
    					),
    				),
    				'default'    => array(
    					'unit' => '%',
    					'size' => 100,
    				),
    				'selectors'  => array(
    					'{{WRAPPER}} ' . $css_scheme['images'] => 'width: {{SIZE}}% !important; float: none !important;',
    				),
    			)
    		);

    File:
    /xts-hitek/framework/integration/elementor/elements/single-product/gallery/class-gallery.php

    After line 131.

    I attach a screen record to see it in action.

    Thank you.

    Private Content Hidden
    #322152

    This control just changes the image container size with CSS. It has no sense since you can use column width for this.
    We were talking about the image size itself, not with its container CSS style.

    #322193

    newsprince
    Staff

    Actually that was what i wanted to say in the first place. I miswrote it.

    The element’s width not the image as image. The image can stay what ever value has for woocommerce settings.

    I meant the width of the image widget. I know you can use column width BUT i want the column to stay for example at 50% and only shrink the image.

    Consider adding this in the widget please.

    Thank you.

    #322253

    In this case, you would better add some padding to the right side of the column. If it is possible to do with existing functionality there is no sense in adding more and more extra options.

    #322355

    newsprince
    Staff

    I think padding is not the solution here and let me show you why.

    I attached a screen record to see.

    I don’t know why is there so much negativity for a simple feature.

    Anyway thank you.

    https://recordit.co/CJ1CzWhRuy

    #322356

    newsprince
    Staff

    Also by applying padding you cant center the image widget afterwards.

    Check the screen record here too.

    https://recordit.co/D0F2zmqLNc

    #322452

    Hello,

    1. The difference is that you set fixed padding in PX and the width is set in %. You need to use the same unit of measurement. Also, the padding can be adjusted on mobile devices too.

    2. You can center it easily by adding paddings from the right and left sides.

    By the way, why you didn’t set the image width container size using an appropriate option that comes in the Advanced tab of Elementor by default? It looks like your custom option does exactly the same. https://gyazo.com/f63be2be2ac5940362bdbfce621e9961

    Kind Regards

Viewing 15 posts - 1 through 15 (of 15 total)

You must be logged in to reply to this topic.