Product Reviews

[mdurkee]

Re: Product Reviews

I am trying to move the reviews into a tabbed layout. How would I make the link that says "write a review" come back with that particular tab active?
Thanks for any help/ideas.
Maxanne

[nottheusual1]

Re: Product Reviews

We use jQuery to do that stuff. Here's where I learned how:

http://stackoverflow.com/questions/1...ide-of-the-div

[mdurkee]

Re: Product Reviews

Thanks for the link, I was also trying to follow a similar thread on their site but nothing seems to be working.
Here is my code: Do you see something I am missing?

<a class="open-tab" href="&mvt:global:sessionurl;Store_Code=&mvta:global:store:code;&amp;Screen=PROD&amp;Product_Code=&mvta:global:Product_Code;&amp;review=1" title="Review this product and receive a savings coupon">Rate this product</a>

<!-- Product Tabs -->
<div id="tabs">
<ul class="nav nav-tabs">
    <li class="active"><a href="#js-description" data-toggle="tab"><i class="icon-th-large"></i>&nbsp;&nbsp;Product Description</a></li>
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:specifications">
        <li><a href="#js-specifications" data-toggle="tab"><i class="icon-th-large"></i>&nbsp;&nbsp;&mvt:customfield_names:customfields:specifications;</a></li>
    </mvt:if>
    <li><a name="rev" href="#js-reviews" data-toggle="tab"><i class="icon-th-large"></i>&nbsp;&nbsp;Reviews</a></li>
</ul>
<div class="tab-content"> 
    <div class="tab-pane active" id="js-description">
        <h5 class="title">&mvt:product:name;</h5>
        &mvt:product:descrip;
    </div>
    <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:customfields:specifications">
        <div class="tab-pane" id="js-specifications">
            <h5 class="title">&mvt:customfield_names:customfields:specifications;</h5>
            &mvt:product:customfield_values:customfields:specifications;
        </div>
    </mvt:if>


    <div class="tab-pane" id="js-reviews">
        <h5 class="title">Reviews</h5>
        <mvt:item name="toolkit" param="render|RRPROD" />


    </div>
</div>
</div> <!-- END tabs -->
<script type="text/javascript">
$(document).ready(function () {
    $('#tabs').tabs();


    $('.open-tab').click(function (event) {
        var tab = $(this).attr('href');
        $('#tabs').tabs('select', tab);
    });
});
</script>

[nottheusual1]

Re: Product Reviews

What version of jQuery are you using?

**EDIT** Meant to ask if you're using the jQuery UI. We used this:

https://jqueryui.com/tabs/

Not the page in the Stackoverflow link. It's been long enough I'd forgot that bit. Apologies. This link is easier to absorb.

[mdurkee]

Re: Product Reviews

These are the lines in the global footer:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>window.jQuery || document.write(unescape('%3Cscript src="js/jquery.min.js"%3E%3C/script%3E'))</script>

I am actually using the standard bootstrap template that is provided from Miva but am trying to customize it a bit. the tabs are just html type (i believe) and I wanted to put the reviews in there. Thing is when someone clicks to add a review, it reloads the page and the default first tab is visible. That would be kind of confusing for the customer.
the site is being developed at dev.heavytshirt.com, if you want to see what I mean. I will take a look at the new info you gave me. Thanks so much for your input.

Maxanne

[nottheusual1]

Re: Product Reviews

Both the solution you were looking at and the one I pointed at require the jQuery UI to be installed. You may just need to add this bit of code to your header:

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js" type="text/javascript"></script>

Fingers crossed ! ! !