[Resolved] Multilingual (WPML) Woocommerce products related to multilingual pages

[Author]

Posts

[tipinoncomuni]

Tell us what you are trying to do?
- Congresses multilingual pages
- A congress can have one or more multilingual "Product" (Hotel) related.
- The Congress products are shown in a map and in a list
The site is italian language ready. What i need to understand how to relate english translated hotels to english translated congress

Is there any documentation that you are following?
- None found about that

Is there a similar example that we can see?
- I don't think so.

What is the link to your site?
- This is an italian Congress page with related Hotels map and list
hidden link

- This is the same Congress, English version
hidden link
As you can see, obviously, none of the hotel are in the page and/or list and the translation manager didn't enable to create the new relationship.
If i don't use the translation manager, the products will be duplicated and the same is true for rooms availability ...
HELP!

[Christian Cox]

If i don't use the translation manager, the products will be duplicated and the same is true for rooms availability ...
Hi, I'm not sure I understand what you mean that the products and rooms availability will be duplicated. What happens if you use the Translation Manager to translate the Products first, then go to WooCommerce > WooCommerce Multilingual > Settings and switch back to "Native WooCommerce product editing screen" temporarily, edit the English Hotels and use the Product Relationship panel to select the parent English Congress. When you are finished assigning the parent Congress posts, go to WooCommerce > WooCommerce Multilingual > Settings and switch back to the Translation Manager. In this case, are the Products and Availability duplicated? If so, I need to know more about how your store is set up.

[tipinoncomuni]

Thanks for your fast and Easter help.
GREAT! I'm now able to establish the relationship. The product "dangerous fields" are locked so it's unlikely there are problems with rooms availability. I will check better tomorrow (is night here).
Take a look at the "product" (hotel) page in italian language (i changed the site host):
hidden link
and english version
hidden link
As you can see it seems there is a CSS problem. It seems that both the Original WooCommerce my custom CSS are not loaded.

[Christian Cox]

Yes it looks like one div is missing from the English version, and it includes several classes that are important for the styles of the page. I'm attaching a screenshot here. Please try these troubleshooting steps first:
- Temporarily switch to the parent Divi theme. Is the markup identical now?
- Temporarily deactivate all plugins except Toolset, Divi Builder, and WooCommerce. Is the markup identical?

Let me know the results.

[tipinoncomuni]

Both attempts give the same UNCHANGED result,
... BUT ...
switching off the "translatable" option in the Product content template (see the enclosed picture), eliminate the CSS problem.
Is there a solution?

I have another question, if you can help (it is translation related) :
Take a look here: hidden link
The "before" property of the price CSS is hacked to write "Prezzo per 2 notti" before the price
Is there a way to use different CSS on different languages?

Toolset/DIVI/WPML is a really explosive mixture ...

[Christian Cox]

switching off the "translatable" option in the Product content template (see the enclosed picture), eliminate the CSS problem.
What if you add the CSS class "product" to the section module in the Divi builder? I'm attaching some screenshots here.

[tipinoncomuni]

Great Christian. It works! Many Thanks for your great help.
I have some other problems but i think is better to use different tickets.
Thanks for now.

[tipinoncomuni]

Sorry, not solved, i was confused by the various try.
Configuring the content model as translatable and adding the "product" CSS class didn't solve the problem. Only config the content template as "untranslatable" solve the problem at this time.

[Christian Cox]

I don't see the "product" CSS class anywhere on this page:
hidden link

Can I log in to your site's wp-admin panel and take a look at the Content Templates? I will activate private reply fields here.

[tipinoncomuni]

Another strange case: the price was visible in the previuos version now it is not.
I thinks it depends on Content template translatable option but i don't want to touch now since you are making your checks.

OLD: hidden link
NEW: hidden link
- Default IS defined, Only 1 variation, Variations is not available

OLD: hidden link
NEW: hidden link
- Default IS defined, 2 variations, one available, the other NOT available

OLD: hidden link
NEW: hidden link
- Default IS defined, 1 variation, not available

OLD: hidden link
NEW: hidden link
- Default NOT defined, 1 variation, when you choose the option, the price appear.

[Christian Cox]

I moved this CSS into the Appearance > Additional CSS area:

.woocommerce div.product form.cart .variations {
    margin-bottom: 0;
}

span.woocommerce-Price-amount.amount {
  font-size: 30px;
}

span.woocommerce-Price-amount.amount::before {
font-size:14px;
color:black;
    content: "Prezzo per 2 notti: ";
}

.woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
    float: left;
    width: 96%;
}

For some reason it did not carry over into the translated Content Template. It seems to be working as expected now.

Another strange case: the price was visible in the previuos version now it is not.
I'll look at this tomorrow and get back to you.

[tipinoncomuni]

You have done a great job.
I really loosed my (little) brain trying to debug in the previous days.

I try to explain in a better way the remaining problems.

===========================================
PROBLEM 1: in the new site, some product prices are shown, some other not.

I want that the product price is shown in the product page.
I had some difficult also before enable WPML and starting to translate.
Some product were not exposing the price.
It seemed to me there were a rule: the price is shown when the variable product has a minimum of two variation and at least one of them have in stock more than 0 products. But i don't think that rule is so exact. In any case, as you can see, in the "old" site i was able to show the price in any of the Hotels.
In some cases, i created a supplemental variation just for "my" rule (in Donatello Hotel the "Single in B&B" didn't is a real option, is there just for "my" rule hidden link ).
But, at the end, i see that was not ever necessary. For example, Hotel "Alla Rocca" hidden link have just one variation and the price is shown.
Please note that in the old site, i only translated the Lux Hotel then asked for your help about the relationship problem and moved the site to the new (final) host.

---------- PRICE NOT SHOWN IN THE NEW SITE ----------
OLD: hidden link
NEW: hidden link

OLD: show the price: hidden link
NEW: hidden link

OLD: hidden link
NEW: hidden link

OLD: hidden link
NEW: hidden link

OLD: hidden link
NEW: hidden link

OLD: hidden link
hidden link

---------- PRICE SHOWN IN THE OLD AND IN THE NEW SITE ----------
OLD: hidden link
NEW: hidden link

OLD: hidden link
NEW: hidden link

OLD: hidden link
NEW: hidden link

===========================================
PROBLEM 2: how to translate a CSS "before" property?

The CSS you moved did contain a "before" property for the price that overwrite the default CSS property:

span.woocommerce-Price-amount.amount::before {
font-size:14px;
color:black;
    content: "Prezzo per 2 notti: ";
}

how can i translate that text?
🙂

[Christian Cox]

What if you add the {!{wpv-woo-product-price}!} shortcode to your Content Template instead of using this CSS with the ::before pseudo-selector? I am not aware of any way to translate strings in CSS, because shortcodes are not supported in CSS fields.

[tipinoncomuni]

I can't just add {!{wpv-woo-product-price}!} since there is no way to extract and present the variations options and the relative prices.
I must use {!{wpv-woo-buy-options add_to_cart_text="Acquista"}!}

You tell that because you haven't found any solution to the price problem?
I desperately need that the price ... "resurrect" !

[Christian Cox]

Okay I see what you mean, it's unusual. I don't see any configuration problems, so there must be something else going on. Is it possible for you to provide a Duplicator package of just this site? My User does not have the ability to access the Duplicator plugin from wp-admin, as far as I can see.