个人中心
文章发布
退出
作者热门文章
- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库？
- java - OnItemClickListener 不起作用，但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
28
4
我正在尝试在同一个容器中制作 8 张产品卡片，我正在按照以下示例进行操作:
https://codepen.io/virgilpana/pen/RNYQwB
但是当我尝试添加第二张、第三张等卡片时，动画仅适用于第一张卡片，其他卡片显示为照片。
是否有可能在每个产品中都有示例功能？
例子的html代码:
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'>
<a id="view-code" href="https://codepen.io/virgilpana/pen/RNYQwB" target="_blank">VIEW CODE</a>
<div id="make-3D-space">
<div id="product-card">
<div id="product-front">
<div class="shadow"></div>
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt.png" alt="" />
<div class="image_overlay"></div>
<div id="view_details">View details</div>
<div class="stats">
<div class="stats-container">
<span class="product_price">$39</span>
<span class="product_name">Adidas Originals</span>
<p>Men's running shirt</p>
<div class="product-options">
<strong>SIZES</strong>
<span>XS, S, M, L, XL, XXL</span>
<strong>COLORS</strong>
<div class="colors">
<div class="c-blue"><span></span></div>
<div class="c-red"><span></span></div>
<div class="c-white"><span></span></div>
<div class="c-green"><span></span></div>
</div>
</div>
</div>
</div>
</div>
<div id="product-back">
<div class="shadow"></div>
<div id="carousel">
<ul>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large.png" alt="" /></li>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large2.png" alt="" /></li>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large3.png" alt="" /></li>
</ul>
<div class="arrows-perspective">
<div class="carouselPrev">
<div class="y"></div>
<div class="x"></div>
</div>
<div class="carouselNext">
<div class="y"></div>
<div class="x"></div>
</div>
</div>
</div>
<div id="flip-back">
<div id="cy"></div>
<div id="cx"></div>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
最佳答案
如果您将所有 id 更改为 HTML CSS 和 JavaScript 中的类，并将(现在).product_card 设置为 position: relative;，那应该可以工作!
代码片段:
$(document).ready(function(){
// Lift card and show stats on Mouseover
$('.product-card').hover(function(){
$(this).addClass('animate');
$('div.carouselNext, div.carouselPrev').addClass('visible');
}, function(){
$(this).removeClass('animate');
$('div.carouselNext, div.carouselPrev').removeClass('visible');
});
// Flip card to the back side
$('.view_details').click(function(){
$('div.carouselNext, div.carouselPrev').removeClass('visible');
$('.product-card').addClass('flip-10');
setTimeout(function(){
$('.product-card').removeClass('flip-10').addClass('flip90').find('div.shadow').show().fadeTo( 80 , 1, function(){
$('.product-front, .product-front div.shadow').hide();
});
}, 50);
setTimeout(function(){
$('.product-card').removeClass('flip90').addClass('flip190');
$('.product-back').show().find('div.shadow').show().fadeTo( 90 , 0);
setTimeout(function(){
$('.product-card').removeClass('flip190').addClass('flip180').find('div.shadow').hide();
setTimeout(function(){
$('.product-card').css('transition', '100ms ease-out');
$('.cx, .cy').addClass('s1');
setTimeout(function(){$('.cx, .cy').addClass('s2');}, 100);
setTimeout(function(){$('.cx, .cy').addClass('s3');}, 200);
$('div.carouselNext, div.carouselPrev').addClass('visible');
}, 100);
}, 100);
}, 150);
});
// Flip card back to the front side
$('.flip-back').click(function(){
$('.product-card').removeClass('flip180').addClass('flip190');
setTimeout(function(){
$('.product-card').removeClass('flip190').addClass('flip90');
$('.product-back div.shadow').css('opacity', 0).fadeTo( 100 , 1, function(){
$('.product-back, .product-back div.shadow').hide();
$('.product-front, .product-front div.shadow').show();
});
}, 50);
setTimeout(function(){
$('.product-card').removeClass('flip90').addClass('flip-10');
$('.product-front div.shadow').show().fadeTo( 100 , 0);
setTimeout(function(){
$('.product-front div.shadow').hide();
$('.product-card').removeClass('flip-10').css('transition', '100ms ease-out');
$('.cx, .cy').removeClass('s1 s2 s3');
}, 100);
}, 150);
});
/* ---- Image Gallery Carousel ---- */
var carousel = $('#carousel ul');
var carouselSlideWidth = 335;
var carouselWidth = 0;
var isAnimating = false;
// building the width of the casousel
$('#carousel li').each(function(){
carouselWidth += carouselSlideWidth;
});
$(carousel).css('width', carouselWidth);
// Load Next Image
$('div.carouselNext').on('click', function(){
var currentLeft = Math.abs(parseInt($(carousel).css("left")));
var newLeft = currentLeft + carouselSlideWidth;
if(newLeft == carouselWidth || isAnimating === true){return;}
$('#carousel ul').css({'left': "-" + newLeft + "px",
"transition": "300ms ease-out"
});
isAnimating = true;
setTimeout(function(){isAnimating = false;}, 300);
});
// Load Previous Image
$('div.carouselPrev').on('click', function(){
var currentLeft = Math.abs(parseInt($(carousel).css("left")));
var newLeft = currentLeft - carouselSlideWidth;
if(newLeft < 0 || isAnimating === true){return;}
$('#carousel ul').css({'left': "-" + newLeft + "px",
"transition": "300ms ease-out"
});
isAnimating = true;
setTimeout(function(){isAnimating = false;}, 300);
});
});/* Generals resets and unimportant stuff */
* { margin: 0px; padding: 0px; }
body {
background: #eaebec;
font-family: "Open Sans", sans-serif;
}
.view-code{
color:#48cfad;
font-size:14px;
text-transform:uppercase;
font-weight:700;
text-decoration:none;
position:absolute;
top:640px;
left:50%;
margin-left:-35px;
}
.view-code:hover{color:#34c29e;}
/* --- Product Card ---- */
.make-3D-space{
position: relative;
perspective: 800px;
width:340px;
height:500px;
transform-style: preserve-3d;
transition: transform 5s;
position:absolute;
top:80px;
left:50%;
margin-left:-167px;
}
.product-front, .product-back{
width:335px;
height:500px;
background:#fff;
position:absolute;
left:-5px;
top:-5px;
-webkit-transition: all 100ms ease-out;
-moz-transition: all 100ms ease-out;
-o-transition: all 100ms ease-out;
transition: all 100ms ease-out;
}
.product-back{
display:none;
transform: rotateY( 180deg );
}
.product-card.animate .product-back, .product-card.animate .product-front{
top:0px;
left:0px;
-webkit-transition: all 100ms ease-out;
-moz-transition: all 100ms ease-out;
-o-transition: all 100ms ease-out;
transition: all 100ms ease-out;
}
.product-card{
width:325px;
height:490px;
position:relative;
top:10px;
left:10px;
overflow:hidden;
transform-style: preserve-3d;
-webkit-transition: 100ms ease-out;
-moz-transition: 100ms ease-out;
-o-transition: 100ms ease-out;
transition: 100ms ease-out;
}
div.product-card.flip-10{
-webkit-transform: rotateY( -10deg );
-moz-transform: rotateY( -10deg );
-o-transform: rotateY( -10deg );
transform: rotateY( -10deg );
transition: 50ms ease-out;
}
div.product-card.flip90{
-webkit-transform: rotateY( 90deg );
-moz-transform: rotateY( 90deg );
-o-transform: rotateY( 90deg );
transform: rotateY( 90deg );
transition: 100ms ease-in;
}
div.product-card.flip190{
-webkit-transform: rotateY( 190deg );
-moz-transform: rotateY( 190deg );
-o-transform: rotateY( 190deg );
transform: rotateY( 190deg );
transition: 100ms ease-out;
}
div.product-card.flip180{
-webkit-transform: rotateY( 180deg );
-moz-transform: rotateY( 180deg );
-o-transform: rotateY( 180deg );
transform: rotateY( 180deg );
transition: 150ms ease-out;
}
.product-card.animate{
top:5px;
left:5px;
width:335px;
height:500px;
box-shadow:0px 13px 21px -5px rgba(0, 0, 0, 0.3);
-webkit-transition: 100ms ease-out;
-moz-transition: 100ms ease-out;
-o-transition: 100ms ease-out;
transition: 100ms ease-out;
}
.stats-container{
background:#fff;
position:absolute;
top:386px;
left:0;
width:265px;
height:300px;
padding:27px 35px 35px;
-webkit-transition: all 200ms ease-out;
-moz-transition: all 200ms ease-out;
-o-transition: all 200ms ease-out;
transition: all 200ms ease-out;
}
.product-card.animate .stats-container{
top:272px;
-webkit-transition: all 200ms ease-out;
-moz-transition: all 200ms ease-out;
-o-transition: all 200ms ease-out;
transition: all 200ms ease-out;
}
.stats-container .product_name{
font-size:22px;
color:#393c45;
}
.stats-container p{
font-size:16px;
color:#b1b1b3;
padding:2px 0 20px 0;
}
.stats-container .product_price{
float:right;
color:#48cfad;
font-size:22px;
font-weight:600;
}
.image_overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:#48daa1;
opacity:0;
}
.product-card.animate .image_overlay{
opacity:0.7;
-webkit-transition: all 200ms ease-out;
-moz-transition: all 200ms ease-out;
-o-transition: all 200ms ease-out;
transition: all 200ms ease-out;
}
.product-options{
padding:2px 0 0;
}
.product-options strong{
font-weight:700;
color:#393c45;
font-size:14px;
}
.product-options span{
color:#969699;
font-size:14px;
display:block;
margin-bottom:8px;
}
.view_details{
position:absolute;
top:112px;
left:50%;
margin-left:-85px;
border:2px solid #fff;
color:#fff;
font-size:19px;
text-align:center;
text-transform:uppercase;
font-weight:700;
padding:10px 0;
width:172px;
opacity:0;
-webkit-transition: all 200ms ease-out;
-moz-transition: all 200ms ease-out;
-o-transition: all 200ms ease-out;
transition: all 200ms ease-out;
}
.view_details:hover{
background:#fff;
color:#48cfad;
cursor:pointer;
}
.product-card.animate #view_details{
opacity:1;
width:152px;
font-size:15px;
margin-left:-75px;
top:115px;
-webkit-transition: all 200ms ease-out;
-moz-transition: all 200ms ease-out;
-o-transition: all 200ms ease-out;
transition: all 200ms ease-out;
}
div.colors div{
margin-top:3px;
width:15px;
height:15px;
margin-right:5px;
float:left;
}
div.colors div span{
width:15px;
height:15px;
display:block;
border-radius:50%;
}
div.colors div span:hover{
width:17px;
height:17px;
margin:-1px 0 0 -1px;
}
div.c-blue span{background:#6e8cd5;}
div.c-red span{background:#f56060;}
div.c-green span{background:#44c28d;}
div.c-white span{
background:#fff;
width:14px;
height:14px;
border:1px solid #e8e9eb;
}
div.shadow{
width:335px;height:520px;
opacity:0;
position:absolute;
top:0;
left:0;
z-index:3;
display:none;
background: -webkit-linear-gradient(left,rgba(0,0,0,0.1),rgba(0,0,0,0.2));
background: -o-linear-gradient(right,rgba(0,0,0,0.1),rgba(0,0,0,0.2));
background: -moz-linear-gradient(right,rgba(0,0,0,0.1),rgba(0,0,0,0.2));
background: linear-gradient(to right, rgba(0,0,0,0.1), rgba(0,0,0,0.2));
}
.product-back div.shadow{
z-index:10;
opacity:1;
background: -webkit-linear-gradient(left,rgba(0,0,0,0.2),rgba(0,0,0,0.1));
background: -o-linear-gradient(right,rgba(0,0,0,0.2),rgba(0,0,0,0.1));
background: -moz-linear-gradient(right,rgba(0,0,0,0.2),rgba(0,0,0,0.1));
background: linear-gradient(to right, rgba(0,0,0,0.2), rgba(0,0,0,0.1));
}
.flip-back{
position:absolute;
top:20px;
right:20px;
width:30px;
height:30px;
cursor:pointer;
}
.cx, .cy{
background:#d2d5dc;
position:absolute;
width:0px;
top:15px;
right:15px;
height:3px;
-webkit-transition: all 250ms ease-in-out;
-moz-transition: all 250ms ease-in-out;
-ms-transition: all 250ms ease-in-out;
-o-transition: all 250ms ease-in-out;
transition: all 250ms ease-in-out;
}
.flip-back:hover .cx, .flip-back:hover .cy{
background:#979ca7;
-webkit-transition: all 250ms ease-in-out;
-moz-transition: all 250ms ease-in-out;
-ms-transition: all 250ms ease-in-out;
-o-transition: all 250ms ease-in-out;
transition: all 250ms ease-in-out;
}
.cx.s1, .cy.s1{
right:0;
width:30px;
-webkit-transition: all 100ms ease-out;
-moz-transition: all 100ms ease-out;
-ms-transition: all 100ms ease-out;
-o-transition: all 100ms ease-out;
transition: all 100ms ease-out;
}
.cy.s2{
-ms-transform: rotate(50deg);
-webkit-transform: rotate(50deg);
transform: rotate(50deg);
-webkit-transition: all 100ms ease-out;
-moz-transition: all 100ms ease-out;
-ms-transition: all 100ms ease-out;
-o-transition: all 100ms ease-out;
transition: all 100ms ease-out;
}
.cy.s3{
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transition: all 100ms ease-out;
-moz-transition: all 100ms ease-out;
-ms-transition: all 100ms ease-out;
-o-transition: all 100ms ease-out;
transition: all 100ms ease-out;
}
.cx.s1{
right:0;
width:30px;
-webkit-transition: all 100ms ease-out;
-moz-transition: all 100ms ease-out;
-ms-transition: all 100ms ease-out;
-o-transition: all 100ms ease-out;
transition: all 100ms ease-out;
}
.cx.s2{
-ms-transform: rotate(140deg);
-webkit-transform: rotate(140deg);
transform: rotate(140deg);
-webkit-transition: all 100ms ease-out;
-moz-transition: all 100ms ease-out;
-ms-transition: all 100ease-out;
-o-transition: all 100ms ease-out;
transition: all 100ms ease-out;
}
.cx.s3{
-ms-transform: rotate(135deg);
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transition: all 100ease-out;
-moz-transition: all 100ms ease-out;
-ms-transition: all 100ms ease-out;
-o-transition: all 100ms ease-out;
transition: all 100ms ease-out;
}
.carousel{
width:335px;
height:500px;
overflow:hidden;
position:relative;
}
.carousel ul{
position:absolute;
top:0;
left:0;
}
.carousel li{
width:335px;
height:500px;
float:left;
overflow:hidden;
}
.arrows-perspective{
width:335px;
height:55px;
position: absolute;
top: 218px;
transform-style: preserve-3d;
transition: transform 5s;
perspective: 335px;
}
.carouselPrev, .carouselNext{
width: 50px;
height: 55px;
background: #ccc;
position: absolute;
top:0;
transition: all 200ms ease-out;
opacity:0.9;
cursor:pointer;
}
.carouselNext{
top:0;
right: -26px;
-webkit-transform: rotateY( -117deg );
-moz-transform: rotateY( -117deg );
-o-transform: rotateY( -117deg );
transform: rotateY( -117deg );
transition: all 200ms ease-out;
}
.carouselNext.visible{
right:0;
opacity:0.8;
background: #efefef;
-webkit-transform: rotateY( 0deg );
-moz-transform: rotateY( 0deg );
-o-transform: rotateY( 0deg );
transform: rotateY( 0deg );
transition: all 200ms ease-out;
}
.carouselPrev{
left:-26px;
top:0;
-webkit-transform: rotateY( 117deg );
-moz-transform: rotateY( 117deg );
-o-transform: rotateY( 117deg );
transform: rotateY( 117deg );
transition: all 200ms ease-out;
}
.carouselPrev.visible{
left:0;
opacity:0.8;
background: #eee;
-webkit-transform: rotateY( 0deg );
-moz-transform: rotateY( 0deg );
-o-transform: rotateY( 0deg );
transform: rotateY( 0deg );
transition: all 200ms ease-out;
}
.carousel .x, .carousel .y{
height:2px;
width:15px;
background:#48cfad;
position:absolute;
top:31px;
left:17px;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.carousel .x{
-ms-transform: rotate(135deg);
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
top:21px;
}
.carousel .carouselNext .x{
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.carousel .carouselNext .y{
-ms-transform: rotate(135deg);
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'>
<a class="view-code" href="https://codepen.io/virgilpana/pen/RNYQwB" target="_blank">VIEW CODE</a>
<div class="make-3D-space">
<div class="product-card">
<div class="product-front">
<div class="shadow"></div>
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt.png" alt="" />
<div class="image_overlay"></div>
<div class="view_details">View details</div>
<div class="stats">
<div class="stats-container">
<span class="product_price">$39</span>
<span class="product_name">Adidas Originals</span>
<p>Men's running shirt</p>
<div class="product-options">
<strong>SIZES</strong>
<span>XS, S, M, L, XL, XXL</span>
<strong>COLORS</strong>
<div class="colors">
<div class="c-blue"><span></span></div>
<div class="c-red"><span></span></div>
<div class="c-white"><span></span></div>
<div class="c-green"><span></span></div>
</div>
</div>
</div>
</div>
</div>
<div class="product-back">
<div class="shadow"></div>
<div class="carousel">
<ul>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large.png" alt="" /></li>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large2.png" alt="" /></li>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large3.png" alt="" /></li>
</ul>
<div class="arrows-perspective">
<div class="carouselPrev">
<div class="y"></div>
<div class="x"></div>
</div>
<div class="carouselNext">
<div class="y"></div>
<div class="x"></div>
</div>
</div>
</div>
<div class="flip-back">
<div class="cy"></div>
<div class="cx"></div>
</div>
</div>
</div>
<div class="product-card">
<div class="product-front">
<div class="shadow"></div>
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt.png" alt="" />
<div class="image_overlay"></div>
<div class="view_details">View details</div>
<div class="stats">
<div class="stats-container">
<span class="product_price">$39</span>
<span class="product_name">Adidas Originals</span>
<p>Men's running shirt</p>
<div class="product-options">
<strong>SIZES</strong>
<span>XS, S, M, L, XL, XXL</span>
<strong>COLORS</strong>
<div class="colors">
<div class="c-blue"><span></span></div>
<div class="c-red"><span></span></div>
<div class="c-white"><span></span></div>
<div class="c-green"><span></span></div>
</div>
</div>
</div>
</div>
</div>
<div class="product-back">
<div class="shadow"></div>
<div class="carousel">
<ul>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large.png" alt="" /></li>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large2.png" alt="" /></li>
<li><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/245657/t-shirt-large3.png" alt="" /></li>
</ul>
<div class="arrows-perspective">
<div class="carouselPrev">
<div class="y"></div>
<div class="x"></div>
</div>
<div class="carouselNext">
<div class="y"></div>
<div class="x"></div>
</div>
</div>
</div>
<div class="flip-back">
<div class="cy"></div>
<div class="cx"></div>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>(您还应该使用最新版本的 JQuery，它是 3.2.1 而不是 1.11.2)
关于javascript - codepen 多张产品卡片，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44333074/
28
4
0
我需要按不同类别过滤我网站上的产品。例如，如果您选择“DRINKS”类别，它将向我显示属于该类别的产品。 为了更好地解释自己。 我需要按类别过滤我网站的出版物 [产品]，例如，在选择一个类别时说“饮料
我有 orders 集合，其中包含 products 集合。我将一些产品 ID 作为列表传递给该方法。我需要返回与任何匹配的产品列表input 列表中的 id。 我需要像这样使用 foreach 循环
我已经为临时分发进行存档好几个月了，但今天突然我无法这样做，因为“存档”菜单项已被禁用。我没有改变任何东西。我完成了该项目的配置设置，看起来没问题。 我的临时个人资料即将在 14 天后过期。这可能是问
我正在尝试找出产品和产品属性之间的关系。我有一个 product 表和一个 product_attributes 表。产品可以具有多种属性。我需要查询来查找具有一个特定属性和另一个属性之一的所有产品。
我正在使用 MySQL Workbench 创建 EER 图。 实现产品、类别和公司表之间关系的最佳方式是什么？ 我正在考虑这种关系，但考虑到我想让公司的客户管理自己的产品/类别，这是最好的方式吗？如
我正在使用 itertools 包，并尝试在具有 900 个值的数组中创建 1、2 和 3 的所有可能组合，然后将其转换为 30 x 30 矩阵。我必须执行此操作的代码在下面并且工作正常。 for d
我有几个关于 Cartridge 启动器的问题: 我的产品不需要评级或发布日期。他们永远不会出售。一些产品是可下载的，因此“num_in_stock”不相关或本质上是无限制的。没有颜色选项，只有尺寸。
在 MySQL 中，存储产品价格(或一般货币)的首选列类型是什么？谷歌知道我经常使用 DECIMAL of FLOAT，但我想知道哪个更好。 我存储的价格范围是 0.01 到 25.00。当然更高的值
在软件开发过程中，尤其是在准备将新功能或修复后的版本上线之前，进行详尽的自测和上线前检查是至关重要的。以下是一个从多个维度综合考量的上线升级检查清单（Checklist），旨在帮助团队确保软件质量、稳
我正在创建一个闪购网站，并且我已经在主页和商店页面上根据日期范围显示产品。但我也想根据其他地方的日期范围显示产品，因此使用简码。 这是我的代码: function testt($meta_query)
可以在 WooCommerce 上批量创建产品吗？我正在使用 wp-cli Product 命令，但似乎我必须一个一个地创建。 'My product 1'), array('title'
我有一个带有数量和价格列的 excel 文件，我用它来为插件 WooCommerce Dynamic Pricing 创建必要的输出的定价规则。 我几乎想通了，但是 WooCommerce 进口商正在
我刚刚继承了一个woocommerce项目，我需要将主页更改为仅显示特定品牌。他们设置了 Product-Data => Attribute => pa_brand。 如果我打印 pa_brand 数
在插件中如何使用 wc_get_products() 获取产品。或者有其他方法可以做到吗？ if ( in_array( 'woocommerce/woocommerce.php', apply_fi
我正在做一个无法从公司网络外部访问的内部网，他们希望在 Plone 中显示一些关于文件下载和最常查看的页面的不错的统计数据。 由于网络限制，我无法使用谷歌分析或任何类型的外部服务，那么是否有任何产品可
我正在就以下问题寻求建议: 保留哪些产品 key 属于哪个客户端的列表。例如，如果我的产品 key 为 8456-7894-4567-7894，则应该这样设计，以便将列表写入数据库而不是文件。 如何将
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the he
尝试将产品搜索栏添加到 Wordpress 管理栏后端，以进行 Woocommerce 产品搜索。它将位于后端管理菜单栏的顶部，这样无论您在后端的哪个位置，都可以搜索 woo 的产品。我很接近但在小绊
这让我抓狂.. 我正在尝试根据特定属性查询和输出 WooCommerce 产品。例如，我设置了一个名为 on 的属性，可能的值为 yes或 no . 我使用以下查询: $args = array(
我正在尝试从 Shopify 商店获取所有产品的 JSON。我一直在向 {STORE URL}/products.json 端点。但这最终只显示了商店提供的部分产品(很多，但不是全部)。当我将参数更改
我是一名优秀的程序员,十分优秀！