Selected variation color price doesn't showing on mouse click
On the following web page:
http://steel-classics.com/de/produkt/le-corbusier-2-sitzer-sofa-lc3/
I have the following problem:
When I click for example Verona or Liguria (Materials) and then choose any Leather color, the price for chosen variation doesn't appear.
The following code is used for displaying variation price, but it doesn't appear.
<script type="text/template" id="tmpl-variation-template">
<div class="woocommerce-variation-description">{{{
data.variation.variation_description }}}
</div>
<div class="woocommerce-variation-price">{{{
data.variation.price_html }}}
</div>
<div class="woocommerce-variation-availability">{{{
data.variation.availability_html }}}
</div>
</script>
I've also tried to change display property from none; to block!important!; in ivpa-hidden-price class.
Then it is showing the price range again, as above on the page, but not the actual selected variation price.
Does anyone have a possible solution how to make variation price appear on mouse click on the selected variation because this should be working by default in outstock theme, and I don't know what is blocking it from working.
Thanks in advance to everyone who atleast invested time to read this question.
jquery woocommerce variations
asked Nov 9 '18 at 11:56
DigitalWhirl LLCDigitalWhirl LLC
642627
add a comment |
On the following web page:
http://steel-classics.com/de/produkt/le-corbusier-2-sitzer-sofa-lc3/
I have the following problem:
When I click for example Verona or Liguria (Materials) and then choose any Leather color, the price for chosen variation doesn't appear.
The following code is used for displaying variation price, but it doesn't appear.
<script type="text/template" id="tmpl-variation-template">
<div class="woocommerce-variation-description">{{{
data.variation.variation_description }}}
</div>
<div class="woocommerce-variation-price">{{{
data.variation.price_html }}}
</div>
<div class="woocommerce-variation-availability">{{{
data.variation.availability_html }}}
</div>
</script>
I've also tried to change display property from none; to block!important!; in ivpa-hidden-price class.
Then it is showing the price range again, as above on the page, but not the actual selected variation price.
Does anyone have a possible solution how to make variation price appear on mouse click on the selected variation because this should be working by default in outstock theme, and I don't know what is blocking it from working.
Thanks in advance to everyone who atleast invested time to read this question.
jquery woocommerce variations
asked Nov 9 '18 at 11:56
DigitalWhirl LLCDigitalWhirl LLC
642627
add a comment |
On the following web page:
http://steel-classics.com/de/produkt/le-corbusier-2-sitzer-sofa-lc3/
I have the following problem:
When I click for example Verona or Liguria (Materials) and then choose any Leather color, the price for chosen variation doesn't appear.
The following code is used for displaying variation price, but it doesn't appear.
<script type="text/template" id="tmpl-variation-template">
<div class="woocommerce-variation-description">{{{
data.variation.variation_description }}}
</div>
<div class="woocommerce-variation-price">{{{
data.variation.price_html }}}
</div>
<div class="woocommerce-variation-availability">{{{
data.variation.availability_html }}}
</div>
</script>
I've also tried to change display property from none; to block!important!; in ivpa-hidden-price class.
Then it is showing the price range again, as above on the page, but not the actual selected variation price.
Does anyone have a possible solution how to make variation price appear on mouse click on the selected variation because this should be working by default in outstock theme, and I don't know what is blocking it from working.
Thanks in advance to everyone who atleast invested time to read this question.
jquery woocommerce variations
asked Nov 9 '18 at 11:56
DigitalWhirl LLCDigitalWhirl LLC
642627
On the following web page:
http://steel-classics.com/de/produkt/le-corbusier-2-sitzer-sofa-lc3/
I have the following problem:
When I click for example Verona or Liguria (Materials) and then choose any Leather color, the price for chosen variation doesn't appear.
The following code is used for displaying variation price, but it doesn't appear.
<script type="text/template" id="tmpl-variation-template">
<div class="woocommerce-variation-description">{{{
data.variation.variation_description }}}
</div>
<div class="woocommerce-variation-price">{{{
data.variation.price_html }}}
</div>
<div class="woocommerce-variation-availability">{{{
data.variation.availability_html }}}
</div>
</script>
I've also tried to change display property from none; to block!important!; in ivpa-hidden-price class.
Then it is showing the price range again, as above on the page, but not the actual selected variation price.
Does anyone have a possible solution how to make variation price appear on mouse click on the selected variation because this should be working by default in outstock theme, and I don't know what is blocking it from working.
Thanks in advance to everyone who atleast invested time to read this question.
jquery woocommerce variations
jquery woocommerce variations
asked Nov 9 '18 at 11:56
DigitalWhirl LLCDigitalWhirl LLC
642627
asked Nov 9 '18 at 11:56
DigitalWhirl LLCDigitalWhirl LLC
642627
asked Nov 9 '18 at 11:56
DigitalWhirl LLCDigitalWhirl LLC
642627
asked Nov 9 '18 at 11:56
DigitalWhirl LLCDigitalWhirl LLC
642627
asked Nov 9 '18 at 11:56
DigitalWhirl LLCDigitalWhirl LLC
642627
642627
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
I'm assuming these are configured as variable products in woocommerce.
In the woocommerce product options inside the dashboard, have you actually modified the "Regular Price" for each variation (by clicking expand on the variation under the variations tab)?
answered Nov 13 '18 at 22:19
ipetduckiesipetduckies
115
yes, thats all already setup. Each leather type has different price, Liguria has it price and Verona its own price. Thats not an issue
– DigitalWhirl LLC
Nov 13 '18 at 22:33
1
In the console there is a js script missing (giving 404). Maybe that one's responbile for the functionality you're after? The script missing is named owl.carousel.js in themes/outstock/owl-carousel steel-classics.com/wp-content/themes/outstock/owl-carousel/…
– ipetduckies
Nov 14 '18 at 0:49
1
that JS file has nothing to do with variation colors
– DigitalWhirl LLC
Nov 14 '18 at 7:25
1
@DigitalWhirlLLC, yourcustom.jsfile is callingjQuery.fn.owlCarousel(), but since the carousel script is not loaded - which meansjQuery.fn.owlCarouselisundefined, the console throws an error which I believe prevented the variation script from being executed properly. So fix the carousel script's path and see if that fixes the variation price visibility issue.
– Sally CJ
Nov 14 '18 at 13:50
ok, seems like that a partial solution, the price now appears, but disappear when I select second variation. What could be the cause of that?
– DigitalWhirl LLC
Nov 14 '18 at 15:38
|
show 1 more comment
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53225287%2fselected-variation-color-price-doesnt-showing-on-mouse-click%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
I'm assuming these are configured as variable products in woocommerce.
In the woocommerce product options inside the dashboard, have you actually modified the "Regular Price" for each variation (by clicking expand on the variation under the variations tab)?
answered Nov 13 '18 at 22:19
ipetduckiesipetduckies
115
yes, thats all already setup. Each leather type has different price, Liguria has it price and Verona its own price. Thats not an issue
– DigitalWhirl LLC
Nov 13 '18 at 22:33
1
In the console there is a js script missing (giving 404). Maybe that one's responbile for the functionality you're after? The script missing is named owl.carousel.js in themes/outstock/owl-carousel steel-classics.com/wp-content/themes/outstock/owl-carousel/…
– ipetduckies
Nov 14 '18 at 0:49
1
that JS file has nothing to do with variation colors
– DigitalWhirl LLC
Nov 14 '18 at 7:25
1
@DigitalWhirlLLC, yourcustom.jsfile is callingjQuery.fn.owlCarousel(), but since the carousel script is not loaded - which meansjQuery.fn.owlCarouselisundefined, the console throws an error which I believe prevented the variation script from being executed properly. So fix the carousel script's path and see if that fixes the variation price visibility issue.
– Sally CJ
Nov 14 '18 at 13:50
ok, seems like that a partial solution, the price now appears, but disappear when I select second variation. What could be the cause of that?
– DigitalWhirl LLC
Nov 14 '18 at 15:38
|
show 1 more comment
I'm assuming these are configured as variable products in woocommerce.
In the woocommerce product options inside the dashboard, have you actually modified the "Regular Price" for each variation (by clicking expand on the variation under the variations tab)?
answered Nov 13 '18 at 22:19
ipetduckiesipetduckies
115
yes, thats all already setup. Each leather type has different price, Liguria has it price and Verona its own price. Thats not an issue
– DigitalWhirl LLC
Nov 13 '18 at 22:33
1
In the console there is a js script missing (giving 404). Maybe that one's responbile for the functionality you're after? The script missing is named owl.carousel.js in themes/outstock/owl-carousel steel-classics.com/wp-content/themes/outstock/owl-carousel/…
– ipetduckies
Nov 14 '18 at 0:49
1
that JS file has nothing to do with variation colors
– DigitalWhirl LLC
Nov 14 '18 at 7:25
1
@DigitalWhirlLLC, yourcustom.jsfile is callingjQuery.fn.owlCarousel(), but since the carousel script is not loaded - which meansjQuery.fn.owlCarouselisundefined, the console throws an error which I believe prevented the variation script from being executed properly. So fix the carousel script's path and see if that fixes the variation price visibility issue.
– Sally CJ
Nov 14 '18 at 13:50
ok, seems like that a partial solution, the price now appears, but disappear when I select second variation. What could be the cause of that?
– DigitalWhirl LLC
Nov 14 '18 at 15:38
|
show 1 more comment
I'm assuming these are configured as variable products in woocommerce.
In the woocommerce product options inside the dashboard, have you actually modified the "Regular Price" for each variation (by clicking expand on the variation under the variations tab)?
answered Nov 13 '18 at 22:19
ipetduckiesipetduckies
115
I'm assuming these are configured as variable products in woocommerce.
In the woocommerce product options inside the dashboard, have you actually modified the "Regular Price" for each variation (by clicking expand on the variation under the variations tab)?
answered Nov 13 '18 at 22:19
ipetduckiesipetduckies
115
answered Nov 13 '18 at 22:19
ipetduckiesipetduckies
115
answered Nov 13 '18 at 22:19
ipetduckiesipetduckies
115
answered Nov 13 '18 at 22:19
ipetduckiesipetduckies
115
115
yes, thats all already setup. Each leather type has different price, Liguria has it price and Verona its own price. Thats not an issue
– DigitalWhirl LLC
Nov 13 '18 at 22:33
1
In the console there is a js script missing (giving 404). Maybe that one's responbile for the functionality you're after? The script missing is named owl.carousel.js in themes/outstock/owl-carousel steel-classics.com/wp-content/themes/outstock/owl-carousel/…
– ipetduckies
Nov 14 '18 at 0:49
1
that JS file has nothing to do with variation colors
– DigitalWhirl LLC
Nov 14 '18 at 7:25
1
@DigitalWhirlLLC, yourcustom.jsfile is callingjQuery.fn.owlCarousel(), but since the carousel script is not loaded - which meansjQuery.fn.owlCarouselisundefined, the console throws an error which I believe prevented the variation script from being executed properly. So fix the carousel script's path and see if that fixes the variation price visibility issue.
– Sally CJ
Nov 14 '18 at 13:50
ok, seems like that a partial solution, the price now appears, but disappear when I select second variation. What could be the cause of that?
– DigitalWhirl LLC
Nov 14 '18 at 15:38
|
show 1 more comment
yes, thats all already setup. Each leather type has different price, Liguria has it price and Verona its own price. Thats not an issue
– DigitalWhirl LLC
Nov 13 '18 at 22:33
1
In the console there is a js script missing (giving 404). Maybe that one's responbile for the functionality you're after? The script missing is named owl.carousel.js in themes/outstock/owl-carousel steel-classics.com/wp-content/themes/outstock/owl-carousel/…
– ipetduckies
Nov 14 '18 at 0:49
1
that JS file has nothing to do with variation colors
– DigitalWhirl LLC
Nov 14 '18 at 7:25
1
@DigitalWhirlLLC, yourcustom.jsfile is callingjQuery.fn.owlCarousel(), but since the carousel script is not loaded - which meansjQuery.fn.owlCarouselisundefined, the console throws an error which I believe prevented the variation script from being executed properly. So fix the carousel script's path and see if that fixes the variation price visibility issue.
– Sally CJ
Nov 14 '18 at 13:50
ok, seems like that a partial solution, the price now appears, but disappear when I select second variation. What could be the cause of that?
– DigitalWhirl LLC
Nov 14 '18 at 15:38
yes, thats all already setup. Each leather type has different price, Liguria has it price and Verona its own price. Thats not an issue
– DigitalWhirl LLC
Nov 13 '18 at 22:33
yes, thats all already setup. Each leather type has different price, Liguria has it price and Verona its own price. Thats not an issue
– DigitalWhirl LLC
Nov 13 '18 at 22:33
1
1
In the console there is a js script missing (giving 404). Maybe that one's responbile for the functionality you're after? The script missing is named owl.carousel.js in themes/outstock/owl-carousel steel-classics.com/wp-content/themes/outstock/owl-carousel/…
– ipetduckies
Nov 14 '18 at 0:49
In the console there is a js script missing (giving 404). Maybe that one's responbile for the functionality you're after? The script missing is named owl.carousel.js in themes/outstock/owl-carousel steel-classics.com/wp-content/themes/outstock/owl-carousel/…
– ipetduckies
Nov 14 '18 at 0:49
1
1
that JS file has nothing to do with variation colors
– DigitalWhirl LLC
Nov 14 '18 at 7:25
that JS file has nothing to do with variation colors
– DigitalWhirl LLC
Nov 14 '18 at 7:25
1
1
@DigitalWhirlLLC, your
custom.js file is calling jQuery.fn.owlCarousel(), but since the carousel script is not loaded - which means jQuery.fn.owlCarousel is undefined, the console throws an error which I believe prevented the variation script from being executed properly. So fix the carousel script's path and see if that fixes the variation price visibility issue.– Sally CJ
Nov 14 '18 at 13:50
@DigitalWhirlLLC, your
custom.js file is calling jQuery.fn.owlCarousel(), but since the carousel script is not loaded - which means jQuery.fn.owlCarousel is undefined, the console throws an error which I believe prevented the variation script from being executed properly. So fix the carousel script's path and see if that fixes the variation price visibility issue.– Sally CJ
Nov 14 '18 at 13:50
ok, seems like that a partial solution, the price now appears, but disappear when I select second variation. What could be the cause of that?
– DigitalWhirl LLC
Nov 14 '18 at 15:38
ok, seems like that a partial solution, the price now appears, but disappear when I select second variation. What could be the cause of that?
– DigitalWhirl LLC
Nov 14 '18 at 15:38
|
show 1 more comment
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53225287%2fselected-variation-color-price-doesnt-showing-on-mouse-click%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
