Question

我们的大部分产品都在其网页上有标签（说明，视频，下载等）

我希望能够在我们的类别页面上创建一个链接到产品页面的链接，并使用它的锚点打开相应的选项卡。像http://www.example.com/product.html#tab-downloads

这样的东西

使用该类型的网址将转到产品页面并滚动到标签部分，但它没有打开链接标签。

我正在使用Ultimo主题进行Magento

以下是一个实例：http://www.nellyssecurity.com/cameras/hi-def-cameras/ip-cameras/3-mp/eyesurv-esip-mp3-dm4-hi-def-3-mp-weatherproof-mini-dome-ip-camera.html#tab-downloads

我确定页面上需要包含一些js，但我不确定从哪里开始。任何帮助都会很棒！

Answer 1

不是真正的Magento相关问题，但更多JS并且是关于跳转页面到哈希位置并打开选项卡/单击元素。

对于给定的实例，使用jQuery可以使用：

<script type="text/javascript">
$( document ).ready(function() {
     var hash = window.location.hash;
     jQuery(hash).children().click();

    });
</script>

您可以在实际示例中测试此代码，方法是加载实时示例网址并在Inspect Element Console中运行document.ready中的两行。

在这种情况下，

children()是因为您必须click() anchor元素中li元素#id。根据实际网页DOM结构的需要进行调整。

Answer 2

尝试在app / design / frontend / ultimo / default / template / catalog / product / view.phtml中添加此代码

围绕线：324你会看到一个＆lt; / script＆gt;标签。复制此代码。并上传它。

jQuery(document).ready(function() { 
            if(location.hash == '#tab-downloads') {
                if(jQuery("#product-tabs").hasClass("accor")){jQuery("#product-tabs .tabs-panels").data("tabs").click(jQuery(".tabs-panels .acctab").index(jQuery("#acctab-downloads")))}else{jQuery("#product-tabs .tabs").data("tabs").click(jQuery("#tab-downloads").index())};
            }
        });

Answer 3

我也使用Magento Ultimo主题，并且能够将这项工作用于自定义选项卡（＃tab2）。

我将custom.js添加到我的子主题local.xml

这是custom.js文件。

jQuery(document).ready(function(){
    jQuery("#rq-product").click(function(){
        jQuery("#tab2").find("a").addClass("current");
        if(jQuery("#product-tabs").hasClass("accor")){
            jQuery("#product-tabs .tabs-panels").data("tabs").click(jQuery(".tabs-panels .acctab").index(jQuery("#acctab2")))
        }
        else {
            jQuery("#product-tabs .tabs").data("tabs").click(jQuery("#tab2").index())
        };
    }); 
});

我将链接放在静态块中，其中 id =＆＃34; rq-product＆＃34; 和 href =＆＃34;＃tab2＆＃ 34;

似乎适合我。

Magento：链接到产品标签

3 个答案: