Upgrade from 2.10.1 to 3.3

I want to upgrade from version 2.10.1 to 3.3
I have noticed that the file woocommerce.php (‘woodmart/inc/woocommerce.php’) which was present in 2.10.1 version was removed from 3.3
I need to replace a part of code (look at the image) which was inside that file with another one.
It was a custom work from another developer.
Regards Leonidas

Hello,

Have you added this code to the child theme?

Best Regards

I had changed the code directly inside woocommerce.php file.
The new modified code is little different from the previous one (image).
So now you removed it I don’t know where to use it.
What do you suggest?

You can find this code in the folder /inc/integrations/woocommerce/modules/swatches.php

Hello
How we disable the top bar?Is there an option in the header builder?
Regards

Hello,

Please navigate to Woodmart > Header builder http://prntscr.com/iyd2pe

Choose the proper header type (your current) http://prntscr.com/iyd333

Remove the elements from the upper row: http://prntscr.com/iyd3h3

If you mean a header banner it is disabled in the Theme Settings > Shop > Header banner.

Best Regards

Thank you.
Do you know why I see the white space between the header and the page tile?

Hello,

You need to delete the custom code shown on the screen: http://prntscr.com/lq15tl

Best Regards

Perfect.
A long time ago you have given me a code on purpose to add an icon in the header.I wanted click on it to open a widget sidebar (check the video)

The code:
function woodmart_header_block_cart() {
$position = woodmart_get_opt(‘cart_position’);
$design = woodmart_get_opt(‘shopping_cart’);
$extra_class = ”;

if( woodmart_get_opt(‘shopping_icon_alt’) ) {
$extra_class .= ‘ woodmart-cart-alt’;
}

if( $position == ‘side’ ) {
$extra_class .= ‘ cart-widget-opener’;
}

if ( woodmart_woocommerce_installed() && $design != ‘disable’ ): ?>
<div class=”search-icon”><span class=”screen-reader-text”><?php esc_attr_e( ‘Search’, ‘woodmart’ ); ?></span>
<div class=”search-overlay”>
<div class=”search-inner”>

<?php
// Core WordPress function
echo do_shortcode(‘[isrc_ajax_search shortcode_id=1]’);
?></div>
</div>
</div>

<div class=”woodmart-shopping-cart woodmart-cart-design-<?php echo esc_attr( $design ); ?> <?php echo esc_attr( $extra_class ); ?>”>
“>
<span class=”woodmart-cart-wrapper”>
<span class=”woodmart-cart-icon”></span>
<span class=”woodmart-cart-totals”>
<?php woodmart_cart_count(); ?>
<span class=”subtotal-divider”>/</span>
<?php woodmart_cart_subtotal(); ?>
</span>
</span>

<?php if ( $position != ‘side’): ?>
<div class=”dropdown-cart”>
<?php

// Insert cart widget placeholder – code in woocommerce.js will update this on page load
echo ‘<div class=”widget woocommerce widget_shopping_cart”><div class=”widget_shopping_cart_content”></div></div>’;

?>
</div>
<?php endif ?>
</div>
<?php endif;
?>
<div class=”panel-icon”><i class=”fa fa-ellipsis-v”></i></div>
<?php
}

You can find it inside the function.php file of child theme from line 1161 to 1212.

It is obvious that this code doesn’t work after the update.
Can you modify it so not to lose the previous function?
Regards Leonidas

Could you please describe the purpose of the code so we can see what we can do there?

Maybe it would be better to take a look at my first post.

You don’t need to use custom code for this. Just add any content to the header using our header builder functionality.

But how I would do that and where should I integrate the code?

You can put it using Text/HTML block in WoodMart -> Header builder. Read more information about our header builder in the documentation https://xtemos.com/docs/woodmart/header-builder/

I believe you are talking about this. http://prntscr.com/lq5czg
I don’t know which part of the previous code to use.
I am not a developer so the only way now is to hire again a developer to do the same job.

Sorry, but we don’t know since that code is not a part of the theme. The fact is that now it is much easier to add any of your custom codes to the header.

Ok
Something else.

In the past I wanted my clients to see the horizontal menu at resolution 1024(image 1).

For this purpose I have used the code you gave me:

@media (min-width: 1024px) and (max-width: 1024px){
header.main-header .main-nav,
header.main-header .search-extended,
header.main-header .widgetarea-head,
div.sticky-header .main-nav{
display: block;}

div.header-left-side,
.mobile-nav-icon {
display: none;
}

.right-column .woodmart-shopping-cart .woodmart-cart-totals {
font-size: 0;
}

div.main-nav .item-level-0>a,
div.main-nav .menu>.menu-item-language>a {
line-height: 32px;
height: 32px;}

div.wrapp-header > .site-logo {
margin-left: -25px;}

.main-nav .sub-menu-dropdown {
margin-top: 19px;}}

Now this code doesn’t work (image2)
How can I achieve the same result?

Hello,

Please delete the code and insert this one:

@media (min-width: 1023px) {

	body .whb-general-header-inner {
			height: 60px;
	}
	
	body .whb-visible-lg,
	body .whb-hidden-mobile {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}
	
	body .whb-hidden-lg {
		display: none;
	}
}

Best Regards

The code worked.

Also I have used the code below on purpose to change product layout:

@media (max-width: 2600px) and (min-width:1025px){
div.product-image-summary-inner, div.product-image-summary-wrap {
flex-wrap: wrap;}

div div.product-image-summary-inner>.col-md-4 {
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 100%;
width: 100%;}

div div.product-image-summary-inner>.col-md-8 {
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 90%;
width: 90%;
margin-top: 0px;
margin-bottom: 30px;
margin-left:40px;}}

@media (max-width: 1024px) and (min-width:768px){
div.product-image-summary-inner, div.product-image-summary-wrap {
flex-wrap: wrap;}
div div.product-image-summary-inner>.col-md-4 {
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 100%;
width: 100%;}

div div.product-image-summary-inner>.col-md-8 {
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 100%;
width: 100%;
margin-top: 20px;
margin-bottom: 30px;}}

– So from 2600 to 1025 I see the first video regarding the product layout.
– From 1024 to 768 the second video

What changed do I have to make to see the same layout like before the upgrade?

(that last two images represents the way I see the product right now from 1024 resolution and above.
Below 768 the product is fine.)

Try to use one of those layouts that look exactly as you need https://gyazo.com/6d6c9abf8b7e02c8c41f72bf837e55cc

Now I only have a problem at 1024 res.
Check the video.
I want to have the same layout at 1024 res as it is at 768

We see that some code is already customized. Be sure that you don’t have any code added to the child theme and you didn’t customize the parent theme files also.

Can you please point me to that code?

I have removed all the custom code.
I want to see from 768 to 1024 res the same product layout that I see at 768res (image)
What code should I change?

Strange, but the single product page markup is still wrong. We don’t see CSS classes from our latest version.

How do we make the product image full screen from 768 to 1024?I don’t want to see the thumbnails on the right between those two resolutions.
The first video was recorded from version 2.10.1
The second from the new version.

Enabling that option made the image full screen in all resolutions which is something I don’t like.
I want like it was before with the only exception between those two resolutions.
Why we don’t change the media queries from 768 which is right now to 1024?

Firstly, you need to remove all the custom PHP code from the child theme to restore our original markup.

Ok.
I have disabled the child theme.

OK, now you need to enable this option http://prntscr.com/lqk118

[Author]

Posts