Home Forums WoodMart – Premium Template 360 Product View in Woocommerce

360 Product View in Woocommerce

Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • #407522

    shineopticals17
    Participant

    Hai team,

    The speed of the 360 product view is so speed I mean if I click on the button to make the image rotate it rotates 4 to 5 images at once and if I try to swipe the 360 images with a touch on mobile then also it rotates so fast.

    Is there any solution I can find here, please I have added 17 angles to the image so please get me right with this.

    Hope I can get a sooner reply, Thank You.

    #407622

    Hello,

    Please try implementing the solution provided in the following topic:
    https://xtemos.com/forums/topic/360-product-view-speed/

    Best Regards

    #407625

    shineopticals17
    Participant

    Hai Aizaz,

    Thanks for your support, but the problem is I don’t no anything from code or server-side code like MY SQL or anything like that So were to add that code, Can you please tell me that in simple, will try.

    Thanks in advance.

    #407690

    Hello,

    Try to add this code snippet to your child theme functions.php file. There you will be able to change playSpeed parameter

    function basel_product_360_view() {
    		$images = basel_get_360_gallery_attachment_ids();
    		if( empty( $images ) ) return;
    
    		$id = rand(100,999);
    
    		$title = '';
    
    		$frames_count = count( $images );
    
    		$images_js_string = '';
    
    		?>
    			<div class="product-360-button">
    				<a href="#product-360-view"><span><?php _e('360 product view', 'basel'); ?></span></a>
    			</div>
    			<div id="product-360-view" class="product-360-view-wrapper mfp-hide">
    				<div class="basel-threed-view threed-id-<?php echo esc_attr( $id ); ?>">
    					<?php if ( ! empty( $title ) ): ?>
    						<h3 class="threed-title"><span><?php echo ($title); ?></span></h3>
    					<?php endif ?>
    					<ul class="threed-view-images">
    						<?php if ( count($images) > 0 ): ?>
    							<?php $i=0; foreach ($images as $img_id): $i++; ?>
    								<?php 
    									$img = wp_get_attachment_image_src( $img_id, 'full' );
    									$width = $img[1];
    									$height = $img[2];
    									$images_js_string .= "'" . $img[0] . "'"; 
    									if( $i < $frames_count ) {
    										$images_js_string .= ","; 
    									}
    								?>
    							<?php endforeach ?>
    						<?php endif ?>
    					</ul>
    				    <div class="spinner">
    				        <span>0%</span>
    				    </div>
    				</div>
    				<script type="text/javascript">
    					jQuery(document).ready(function( $ ) {
    					    $('.threed-id-<?php echo esc_attr( $id ); ?>').ThreeSixty({
    					        totalFrames: <?php echo $frames_count; ?>,
    					        endFrame: <?php echo $frames_count; ?>, 
    					        currentFrame: 1, 
    					        imgList: '.threed-view-images', 
    					        progress: '.spinner',
    					        imgArray: [<?php echo $images_js_string; ?>],
    					        height: <?php echo $height ?>,
    					        width: <?php echo $width ?>,
    					        responsive: true,
    					        playSpeed: 300,
    					        navigation: true
    					    });
    					});
    				</script>
    			</div>
    		<?php
    	}

    Regards

    #407745

    shineopticals17
    Participant

    Hello,

    But my main question here is where is that “child theme functions.php” file, whether it will be in my C-Panel or WordPress dashboard from where I can access it, please don’t mind as it’s my first-time project with your theme its a bit difficult for me to do. So yeah kindly tell me where I can find that file to insert the code you had given above.

    Thank You.

    #407750

    shineopticals17
    Participant

    And for your information in my WordPress dashboard, I had a WP code snippet plugin and I added the code by creating one snippet in that. Attacking that screenshot below.

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

    shineopticals17
    Participant

    Hello Team,

    Is there anyone to reply please it’s an immediate work for me because I should deliver the project to my client as soon as possible.

    Please assist soon.

    Thank You.

    #407924

    Hello,

    Please provide the admin panel and FTP details of the website to check it myself and help you out accordingly.

    Best Regards

    #407955

    shineopticals17
    Participant

    Hai team,

    I can give you the Bluehost hosting log-in details and WordPress log in details, may be you can log in to FTP directly from bluehost dashboard. Check the details below.

    Thank you.

    #408045

    shineopticals17
    Participant

    Hai Aizaz,

    Can you please help me with this soon because the date of project delivery is too close, So need your help ASAP.

    Thank You.

    #408107

    shineopticals17
    Participant

    Hello team,

    Is anyone here to help me with this, please check the details you asked for (admin credentials) in my previous replies and am attaching them in this as well again please make it happen soon.

    Thank You.

    #408127

    Elise Noromit
    Keymaster

    Hello,

    By default, The speed of the 360 product view depends on the number of images, you have added to the view. The more images, the slower rotation.

    If you do not like that, you need to add a custom snippet into the function.php of the child theme as provided by my colleague in #407690

    There two ways to find this file: WP admin panel and FTP.

    1. You can find the file in the Dashboard > Appearance > Theme file editor: https://gyazo.com/ca2d6f7bb19997e67e393832cdba3e8a

    2. Then select the proper theme and the proper file: https://gyazo.com/7a043c001983e3ef54c8c827bc80a903

    As soon as you add the code, you need to activate the child theme.

    If you want to add the code to the file via FTP, you need to select wp-content folder > themes > select the child theme > find the functions.php file and insert the code.

    The child theme should be activated.

    If you have any questions please feel free to contact us.

    Best Regards

    #408154

    shineopticals17
    Participant

    Hai Elise,

    That’s the problem for me right I didn’t find where to add it and I don’t want to mess with the code because I don’t know how to code and it’s my client project.

    But as you guys keep on referring child theme, for your info, I directly installed the main theme by skipping the option of installing the child theme.

    So can you please add the custom snippet or the extra code which you guys are referring to for me please as the credentials of both WordPress & Hosting were given two times in my previous replies.

    Hope you help me as soon as possible.

    Thanks in Advance.

    #408173

    shineopticals17
    Participant

    Hai team,

    As suggested somehow I figured it out and added as shown in the previous reply #408127 and added the code snippet but I don’t see any kind of speed change when I try to swipe & rotate the 360 views, and for your info, I changed play speed in the code snippet to 50 and added 32 images of my product you can also check that product here:

    https://chesmaexpress.in/shop/eye-glasses/red-black-clipper-block-specs/

    Can you guys can help me at the earliest possible then it would be a great help.

    Thank you.

    #408261

    shineopticals17
    Participant

    Hello team,

    Is anyone here to help me with this, I did what you guys have been told somehow I figured out where to add that snippet but I don’t see any change in rotation speed and added 32 angles of the object in the image, can you once check and solve this for me and requesting; please make it happen soon.

    https://chesmaexpress.in/shop/eye-glasses/red-black-clipper-block-specs/

    Thank You.

    #408401

    shineopticals17
    Participant

    Hello team,

    Is anyone here to help me with this, please make it happen soon.

    Thank You.

    #408497

    shineopticals17
    Participant

    Hello team,

    Is anyone here to help me with this, once open my dashboard & check whether I added it correctly or not because I don’t see any changes in the speed of the 360 product view. So please make it happen soon.

    For your info added the code snippet in the theme editor from the WP dashboard.

    Thank You.

    #408712

    Elise Noromit
    Keymaster

    Hello,

    We have installed the child theme. Please insert this code into functions.php: https://prnt.sc/gksmFhPbRFJH

    You need to enter Appearance > Theme Editor, select the child theme and open functions.php:

    add_filter( 'woodmart_three_sixty_prev_next_frames', function () {
    	return 2;
    });

    Best Regards

    #408808

    shineopticals17
    Participant

    Hai team,

    Okay thanks, I think the above code snippet is already added to the function.php in the child theme from the theme editor, but I don’t find any change in the speed of the 360 image view that we have before.

    Can you please check or is there anything to do?
    Access the product page from here where we have the 360 image view: https://chesmaexpress.in/shop/eye-glasses/red-black-clipper-block-specs/

    Thanks in advance.

    #409131

    Elise Noromit
    Keymaster

    Hello,

    The code we provided reduces the speed when you use the pagination: https://prnt.sc/yhdsSg0e9FP9 and https://prnt.sc/zM8mqyG6oWTA

    If you want to use swapping, add this code:

    add_filter( 'woodmart_three_sixty_framerate', function () {
    	return 20;
    });

    You can change the speed as per your needs.

    Best Regards

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