{"id":7679,"date":"2026-03-11T07:26:03","date_gmt":"2026-03-11T07:26:03","guid":{"rendered":"https:\/\/www.pocketshop.cn\/?page_id=7679"},"modified":"2026-03-23T02:56:52","modified_gmt":"2026-03-23T02:56:52","slug":"templates","status":"publish","type":"page","link":"https:\/\/www.pocketshop.cn\/index.php\/templates\/","title":{"rendered":"templates"},"content":{"rendered":"\n<h2 class=\"wp-block-heading has-text-align-center\" style=\"padding-top:80px\">\u591a\u884c\u4e1a\u4e3b\u9898\u5168\u8986\u76d6\uff0cSEO \u9996\u9009\u5efa\u7ad9\u7cfb\u7edf<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-88098167 wp-block-columns-is-layout-flex\" style=\"padding-right:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--30)\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"padding-top:30px;padding-bottom:30px\">        <style>\n        .saas-ui{font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,\"Helvetica Neue\",Arial,\"Noto Sans\",\"PingFang SC\",\"Hiragino Sans GB\",\"Microsoft YaHei\",sans-serif;color:#1f2937}\n        .saas-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin-top:16px}\n        .saas-card{background:#fff;border:1px solid #848484;border-radius:12px;padding:10px;box-shadow:0 2px 8px rgba(0,0,0,.04)}\n        .saas-card-title{font-size:18px;font-weight:600;margin-bottom:6px}\n        .saas-filter{display:flex;gap:12px;align-items:stretch}\n        .saas-filter .saas-input{flex:1;min-width:0}\n        .saas-filter .saas-select{width:160px;flex-shrink:0}\n        .saas-filter .saas-button{padding:0 28px;font-size:14px;flex-shrink:0;white-space:nowrap}\n        .saas-filter-sentinel{height:1px;margin-bottom:-1px;visibility:hidden;pointer-events:none}\n        .saas-filter-panel{border:none;box-shadow:none;padding:0;background:transparent;position:sticky;top:calc(var(--saas-filter-top,0px) + 12px);z-index:99;transition:background .2s,box-shadow .2s,padding .18s,border .18s}\n        .saas-filter-panel.is-stuck{background:#fff !important;box-shadow:0 4px 24px rgba(0,0,0,.10) !important;padding:12px !important;border:1px solid #e5e7eb !important;border-radius:10px !important;margin-bottom:12px}\n        .saas-filter-panel.is-stuck .saas-filter{margin:0}\n        .saas-filter-panel.is-stuck .saas-card-title{display:none}\n        .saas-input,.saas-select{width:100%;padding:10px 12px;border:1px solid #e5e7eb;border-radius:8px;box-sizing:border-box}\n        .saas-button{display:inline-flex;align-items:center;justify-content:center;background:#14532d;color:#fff;border:none;border-radius:8px;padding:10px 20px;cursor:pointer;text-decoration:none;font-size:14px;line-height:1.2}\n        .saas-button:hover{background:#0f3d21}\n        .saas-empty{color:#6b7280;padding:12px 0}\n        .saas-template-list .saas-grid .saas-card{height:520px;display:flex;flex-direction:column}\n        .saas-template-list .saas-grid .saas-card .saas-card-title{margin-bottom:0}\n        .saas-template-list .saas-grid .saas-card .saas-card-row{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}\n        .saas-template-list .saas-grid .saas-card .saas-card-row .saas-meta{margin:0;gap:6px}\n        .saas-template-list .saas-grid .saas-card .saas-card-row .saas-button{white-space:nowrap}\n        .saas-actions{margin-left:auto;display:flex;align-items:center;gap:8px}\n        .saas-button-secondary{background:#fff;color:#111827;border:1px solid #d1d5db}\n        .saas-button-secondary:hover,.saas-button-secondary:focus{background:#f3f4f6;color:#111827;border-color:#9ca3af}\n        .saas-cover{height:440px;overflow:hidden;border-radius:8px;margin-bottom:8px;--saas-shift:0px}\n        .saas-cover img{width:100%;height:auto;min-height:100%;border-radius:0;margin-bottom:0;display:block;transform:translate3d(0,0,0);backface-visibility:hidden;transform-origin:center top}\n        @media (prefers-reduced-motion: reduce){.saas-cover img{animation:none}}\n        .saas-meta{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}\n        .saas-tag{background:#f3f4f6;color:#374151;border-radius:999px;padding:4px 10px;font-size:12px}\n        .saas-template-card[data-select-url]{cursor:pointer}\n        <\/style>        <div class=\"saas-ui saas-template-list\">\n            <div class=\"saas-filter-sentinel\"><\/div>\n            <div class=\"saas-card saas-filter-panel\">\n                <div class=\"saas-card-title\">\u6a21\u677f\u5e02\u573a<\/div>\n                <form class=\"saas-filter\" method=\"get\">\n                    <input class=\"saas-input\" type=\"text\" name=\"saas_template_keyword\" value=\"\" placeholder=\"\u641c\u7d22\u6a21\u677f\" \/>\n                    <select class=\"saas-select\" name=\"saas_template_category\">\n                        <option value=\"\">\u5168\u90e8\u5206\u7c7b<\/option>\n                                                    <option value=\"B2C\" >\n                                B2C                            <\/option>\n                                            <\/select>\n                    <button class=\"saas-button\" type=\"submit\">\u7b5b\u9009<\/button>\n                <\/form>\n            <\/div>\n                            <div class=\"saas-grid\">\n                                                                    <div class=\"saas-card saas-template-card\" data-select-url=\"https:\/\/www.pocketshop.cn\/index.php\/wizard\/?template_id=533\">\n                                                            <div class=\"saas-cover\"><img decoding=\"async\" src=\"https:\/\/www.pocketshop.cn\/wp-content\/uploads\/2026\/03\/Needles-\u2013-Just-another-Starter-Templates-Sites-site-scaled.jpg\" alt=\"Needles\" \/><\/div>\n                                                        <div class=\"saas-card-row\">\n                                <div class=\"saas-card-title\">Needles<\/div>\n                                <div class=\"saas-meta\">\n                                                                            <span class=\"saas-tag\">2026.04.16-164957<\/span>\n                                                                                                                <span class=\"saas-tag\">B2C<\/span>\n                                                                    <\/div>\n                                <div class=\"saas-actions\">\n                                                                                                                <a class=\"saas-button saas-button-secondary\" href=\"https:\/\/www.pocketshop.cn\/index.php\/wizard\/?template_id=533\">\u9009\u4e2d\u6a21\u677f<\/a>\n                                                                    <\/div>\n                            <\/div>\n                        <\/div>\n                                                                    <div class=\"saas-card saas-template-card\" data-select-url=\"https:\/\/www.pocketshop.cn\/index.php\/wizard\/?template_id=531\">\n                                                            <div class=\"saas-cover\"><img decoding=\"async\" src=\"https:\/\/www.pocketshop.cn\/wp-content\/uploads\/2026\/03\/Bike-Shop-\u2013-Just-another-Starter-Templates-Sites-site-scaled.jpg\" alt=\"Bike\" \/><\/div>\n                                                        <div class=\"saas-card-row\">\n                                <div class=\"saas-card-title\">Bike<\/div>\n                                <div class=\"saas-meta\">\n                                                                            <span class=\"saas-tag\">2026.04.16-164957<\/span>\n                                                                                                                <span class=\"saas-tag\">B2C<\/span>\n                                                                    <\/div>\n                                <div class=\"saas-actions\">\n                                                                            <a class=\"saas-button\" href=\"https:\/\/startertemplatecloud.com\/g47\/\" target=\"_blank\" rel=\"noopener\">\u9884\u89c8<\/a>\n                                                                                                                <a class=\"saas-button saas-button-secondary\" href=\"https:\/\/www.pocketshop.cn\/index.php\/wizard\/?template_id=531\">\u9009\u4e2d\u6a21\u677f<\/a>\n                                                                    <\/div>\n                            <\/div>\n                        <\/div>\n                                                                    <div class=\"saas-card saas-template-card\" data-select-url=\"https:\/\/www.pocketshop.cn\/index.php\/wizard\/?template_id=527\">\n                                                            <div class=\"saas-cover\"><img decoding=\"async\" src=\"https:\/\/www.pocketshop.cn\/wp-content\/uploads\/2026\/03\/Soap-Shop-\u2013-Just-another-Starter-Templates-Sites-site-scaled.jpg\" alt=\"soap\" \/><\/div>\n                                                        <div class=\"saas-card-row\">\n                                <div class=\"saas-card-title\">soap<\/div>\n                                <div class=\"saas-meta\">\n                                                                            <span class=\"saas-tag\">2026.04.16-164957<\/span>\n                                                                                                                <span class=\"saas-tag\">B2C<\/span>\n                                                                    <\/div>\n                                <div class=\"saas-actions\">\n                                                                            <a class=\"saas-button\" href=\"https:\/\/startertemplatecloud.com\/g32\/\" target=\"_blank\" rel=\"noopener\">\u9884\u89c8<\/a>\n                                                                                                                <a class=\"saas-button saas-button-secondary\" href=\"https:\/\/www.pocketshop.cn\/index.php\/wizard\/?template_id=527\">\u9009\u4e2d\u6a21\u677f<\/a>\n                                                                    <\/div>\n                            <\/div>\n                        <\/div>\n                                    <\/div>\n                    <\/div>\n        <script>\n            (function () {\n                var container = document.querySelector('.saas-template-list');\n                if (!container) {\n                    return;\n                }\n                container.addEventListener('click', function (event) {\n                    if (event.target.closest('a,button,input,select,textarea,label')) {\n                        return;\n                    }\n                    var card = event.target.closest('.saas-template-card[data-select-url]');\n                    if (!card) {\n                        return;\n                    }\n                    var url = card.getAttribute('data-select-url');\n                    if (url) {\n                        window.location.href = url;\n                    }\n                });\n\n                var covers = container.querySelectorAll('.saas-cover');\n                function updateShift(cover) {\n                    if (!cover) {\n                        return;\n                    }\n                    var img = cover.querySelector('img');\n                    if (!img) {\n                        return;\n                    }\n                    var coverHeight = cover.clientHeight;\n                    var rect = img.getBoundingClientRect();\n                    var shownHeight = rect.height;\n                    if (img.naturalWidth > 0 && rect.width > 0) {\n                        var byRatio = rect.width * (img.naturalHeight \/ img.naturalWidth);\n                        if (byRatio > shownHeight) {\n                            shownHeight = byRatio;\n                        }\n                    }\n                    var shift = Math.max(0, Math.round(shownHeight - coverHeight));\n                    cover.style.setProperty('--saas-shift', shift + 'px');\n                    cover.__saasShift = shift;\n                }\n                function readCurrentY(img) {\n                    if (!img) {\n                        return 0;\n                    }\n                    var matrix = window.getComputedStyle(img).transform;\n                    if (!matrix || matrix === 'none') {\n                        return 0;\n                    }\n                    var parts = matrix.match(\/matrix(3d)?\\((.+)\\)\/);\n                    if (!parts || !parts[2]) {\n                        return 0;\n                    }\n                    var values = parts[2].split(',');\n                    if (parts[1] === '3d') {\n                        var y3d = Number(values[13]);\n                        return Number.isFinite(y3d) ? Math.abs(y3d) : 0;\n                    }\n                    var y2d = Number(values[5]);\n                    return Number.isFinite(y2d) ? Math.abs(y2d) : 0;\n                }\n                function animateTo(cover, target, duration, easing) {\n                    if (!cover) {\n                        return;\n                    }\n                    var img = cover.querySelector('img');\n                    if (!img) {\n                        return;\n                    }\n                    var current = typeof cover.__saasCurrentY === 'number' ? cover.__saasCurrentY : readCurrentY(img);\n                    var safeTarget = Math.max(0, target);\n                    if (cover.__saasAnim && typeof cover.__saasAnim.cancel === 'function') {\n                        cover.__saasAnim.cancel();\n                    }\n                    img.style.willChange = 'transform';\n                    if (img.animate) {\n                        var from = -current;\n                        var to = -safeTarget;\n                        var anim = img.animate([\n                            { transform: 'translate3d(0,' + from + 'px,0)' },\n                            { transform: 'translate3d(0,' + to + 'px,0)' }\n                        ], {\n                            duration: duration,\n                            easing: easing,\n                            fill: 'forwards'\n                        });\n                        cover.__saasAnim = anim;\n                        anim.onfinish = function () {\n                            cover.__saasCurrentY = safeTarget;\n                            img.style.transform = 'translate3d(0,' + (-safeTarget) + 'px,0)';\n                            img.style.willChange = '';\n                        };\n                        anim.oncancel = function () {\n                            cover.__saasCurrentY = readCurrentY(img);\n                        };\n                        return;\n                    }\n                    img.style.transition = 'transform ' + duration + 'ms ' + easing;\n                    img.style.transform = 'translate3d(0,' + (-safeTarget) + 'px,0)';\n                    cover.__saasCurrentY = safeTarget;\n                    window.setTimeout(function () {\n                        img.style.transition = '';\n                        img.style.willChange = '';\n                    }, duration + 20);\n                }\n                covers.forEach(function (cover) {\n                    var img = cover.querySelector('img');\n                    if (!img) {\n                        return;\n                    }\n                    if (img.complete) {\n                        updateShift(cover);\n                    } else {\n                        img.addEventListener('load', function () {\n                            updateShift(cover);\n                        }, { once: true });\n                    }\n                    cover.addEventListener('mouseenter', function () {\n                        updateShift(cover);\n                        animateTo(cover, cover.__saasShift || 0, 6000, 'linear');\n                    });\n                    cover.addEventListener('mouseleave', function () {\n                        animateTo(cover, 0, 260, 'ease-out');\n                    });\n                });\n                var rafId = 0;\n                window.addEventListener('resize', function () {\n                    if (rafId) {\n                        window.cancelAnimationFrame(rafId);\n                    }\n                    rafId = window.requestAnimationFrame(function () {\n                        covers.forEach(function (cover) {\n                            updateShift(cover);\n                        });\n                    });\n                });\n                window.requestAnimationFrame(function () {\n                    covers.forEach(function (cover) {\n                        updateShift(cover);\n                    });\n                });\n            })();\n        <\/script>\n        <script>\n            (function(){\n                var panel = document.querySelector('.saas-filter-panel');\n                var sentinel = document.querySelector('.saas-filter-sentinel');\n                if (!panel || !sentinel) return;\n                var headerH = 0;\n                function getHeaderH() {\n                    var sels = ['header.site-header','#masthead','.site-header','#header','.header'];\n                    for (var i = 0; i < sels.length; i++) {\n                        var el = document.querySelector(sels[i]);\n                        if (el) { var h = el.getBoundingClientRect().height; if (h > 0) return h; }\n                    }\n                    var headers = document.querySelectorAll('header');\n                    for (var j = 0; j < headers.length; j++) {\n                        if (!headers[j].closest('.saas-ui')) {\n                            var hh = headers[j].getBoundingClientRect().height;\n                            if (hh > 0) return hh;\n                        }\n                    }\n                    return 0;\n                }\n                function updateTop() {\n                    headerH = getHeaderH();\n                    document.documentElement.style.setProperty('--saas-filter-top', headerH + 'px');\n                }\n                function check() {\n                    var top = sentinel.getBoundingClientRect().top;\n                    if (top <= headerH + 12 + 1) {\n                        panel.classList.add('is-stuck');\n                    } else {\n                        panel.classList.remove('is-stuck');\n                    }\n                }\n                updateTop();\n                check();\n                window.addEventListener('scroll', check, {passive: true});\n                window.addEventListener('resize', function(){ updateTop(); check(); });\n            })();\n        <\/script>\n        \n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u591a\u884c\u4e1a\u4e3b\u9898\u5168\u8986\u76d6\uff0cSEO \u9996\u9009\u5efa\u7ad9\u7cfb\u7edf<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_post_transparent":"","_kad_post_title":"hide","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"show","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-7679","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.pocketshop.cn\/index.php\/wp-json\/wp\/v2\/pages\/7679","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.pocketshop.cn\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.pocketshop.cn\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.pocketshop.cn\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pocketshop.cn\/index.php\/wp-json\/wp\/v2\/comments?post=7679"}],"version-history":[{"count":29,"href":"https:\/\/www.pocketshop.cn\/index.php\/wp-json\/wp\/v2\/pages\/7679\/revisions"}],"predecessor-version":[{"id":11180,"href":"https:\/\/www.pocketshop.cn\/index.php\/wp-json\/wp\/v2\/pages\/7679\/revisions\/11180"}],"wp:attachment":[{"href":"https:\/\/www.pocketshop.cn\/index.php\/wp-json\/wp\/v2\/media?parent=7679"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}