app/template/user_data/guide/knowledge_index.twig line 1

Open in your IDE?
  1. {#
  2. 知識コンテンツ インデックス - EC-CUBE 4.2 bynoiezam テーマ用
  3. 配置先: app/template/bynoiezam/guide/knowledge/index.twig
  4. URL: /guide/knowledge
  5. #}
  7. {% extends 'default_frame.twig' %}
  9. {% set body_class = 'guide_page knowledge_page' %}
  11. {% block stylesheet %}
  12.     {{ parent() }}
  13.     <link rel="stylesheet" href="{{ asset('assets/css/guide.css', 'user_data') }}">
  14. {% endblock %}
  16. {% block main %}
  17. <div class="nz-guide-container">
  18.     
  19.     {# パンくずリスト #}
  20.     <nav class="nz-breadcrumb" aria-label="パンくずリスト">
  21.         <ol itemscope itemtype="https://schema.org/BreadcrumbList">
  22.             <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
  23.                 <a itemprop="item" href="{{ url('homepage') }}"><span itemprop="name">TOP</span></a>
  24.                 <meta itemprop="position" content="1" />
  25.             </li>
  26.             <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
  27.                 <span itemprop="name">知識コンテンツ</span>
  28.                 <meta itemprop="position" content="2" />
  29.             </li>
  30.         </ol>
  31.     </nav>
  33.     {# ヒーローセクション #}
  34.     <section class="nz-hero-section nz-hero-knowledge">
  35.         <div class="nz-hero-content">
  36.             <h1 class="nz-hero-title">
  37.                 <span class="nz-hero-sub">PC選びに迷ったら</span>
  38.                 <span class="nz-hero-main">知識コンテンツ</span>
  39.             </h1>
  40.             <p class="nz-hero-lead">
  41.                 PCの選び方、パーツの基礎知識、トラブル対処法など<br>
  42.                 初心者から上級者まで役立つ情報をお届けします。
  43.             </p>
  44.         </div>
  45.     </section>
  47.     {# カテゴリグリッド #}
  48.     <section class="nz-section nz-knowledge-categories">
  49.         
  50.         {# 用途別PC選び方 #}
  51.         <article class="nz-knowledge-category">
  52.             <div class="nz-category-header">
  53.                 <span class="nz-category-icon">🎯</span>
  54.                 <h2 class="nz-category-title">用途別PC選び方</h2>
  55.                 <p class="nz-category-desc">あなたの用途に最適なPCスペックを解説</p>
  56.             </div>
  57.             <ul class="nz-article-list">
  58.                 <li class="nz-article-item">
  59.                     <a href="/user_data/guide_knowledge_gaming" class="nz-article-link">
  60.                         <span class="nz-article-icon">🎮</span>
  61.                         <div class="nz-article-info">
  62.                             <h3 class="nz-article-title">ゲーミングPCの選び方</h3>
  63.                             <p class="nz-article-excerpt">FPS、RPG、配信など目的別の推奨スペックを解説。</p>
  64.                             <span class="nz-article-meta">
  65.                                 <span class="nz-read-time">⏱️ 読了時間: 約5分</span>
  66.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  67.                             </span>
  68.                         </div>
  69.                         <span class="nz-article-arrow">→</span>
  70.                     </a>
  71.                 </li>
  72.                 <li class="nz-article-item">
  73.                     <a href="/user_data/guide_knowledge_creator" class="nz-article-link">
  74.                         <span class="nz-article-icon">🎬</span>
  75.                         <div class="nz-article-info">
  76.                             <h3 class="nz-article-title">クリエイターPCの選び方</h3>
  77.                             <p class="nz-article-excerpt">動画編集、3DCG、イラスト制作に必要なスペックとは。</p>
  78.                             <span class="nz-article-meta">
  79.                                 <span class="nz-read-time">⏱️ 読了時間: 約5分</span>
  80.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  81.                             </span>
  82.                         </div>
  83.                         <span class="nz-article-arrow">→</span>
  84.                     </a>
  85.                 </li>
  86.                 <li class="nz-article-item">
  87.                     <a href="/user_data/guide_knowledge_business" class="nz-article-link">
  88.                         <span class="nz-article-icon">💼</span>
  89.                         <div class="nz-article-info">
  90.                             <h3 class="nz-article-title">ビジネスPCの選び方</h3>
  91.                             <p class="nz-article-excerpt">リモートワーク、オフィスワークに最適なPC選び。</p>
  92.                             <span class="nz-article-meta">
  93.                                 <span class="nz-read-time">⏱️ 読了時間: 約4分</span>
  94.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  95.                             </span>
  96.                         </div>
  97.                         <span class="nz-article-arrow">→</span>
  98.                     </a>
  99.                 </li>
  100.             </ul>
  101.         </article>
  102.         
  103.         {# パーツ基礎知識 #}
  104.         <article class="nz-knowledge-category">
  105.             <div class="nz-category-header">
  106.                 <span class="nz-category-icon">🔧</span>
  107.                 <h2 class="nz-category-title">パーツ基礎知識</h2>
  108.                 <p class="nz-category-desc">PCパーツの役割と選び方の基礎を学ぶ</p>
  109.             </div>
  110.             <ul class="nz-article-list">
  111.                 <li class="nz-article-item">
  112.                     <a href="/user_data/guide_knowledge_cpu" class="nz-article-link">
  113.                         <span class="nz-article-icon">🧠</span>
  114.                         <div class="nz-article-info">
  115.                             <h3 class="nz-article-title">CPUの選び方 - Intel vs AMD</h3>
  116.                             <p class="nz-article-excerpt">世代の見方、用途別おすすめ、性能比較のポイント。</p>
  117.                             <span class="nz-article-meta">
  118.                                 <span class="nz-read-time">⏱️ 読了時間: 約6分</span>
  119.                                 <span class="nz-difficulty nz-difficulty-intermediate">中級者向け</span>
  120.                             </span>
  121.                         </div>
  122.                         <span class="nz-article-arrow">→</span>
  123.                     </a>
  124.                 </li>
  125.                 <li class="nz-article-item">
  126.                     <a href="/user_data/guide_knowledge_gpu" class="nz-article-link">
  127.                         <span class="nz-article-icon">🖥️</span>
  128.                         <div class="nz-article-info">
  129.                             <h3 class="nz-article-title">グラフィックボードの選び方</h3>
  130.                             <p class="nz-article-excerpt">ゲーム別推奨スペック、VRAM、TDPの見方。</p>
  131.                             <span class="nz-article-meta">
  132.                                 <span class="nz-read-time">⏱️ 読了時間: 約7分</span>
  133.                                 <span class="nz-difficulty nz-difficulty-intermediate">中級者向け</span>
  134.                             </span>
  135.                         </div>
  136.                         <span class="nz-article-arrow">→</span>
  137.                     </a>
  138.                 </li>
  139.                 <li class="nz-article-item">
  140.                     <a href="/user_data/guide_knowledge_memory" class="nz-article-link">
  141.                         <span class="nz-article-icon">📊</span>
  142.                         <div class="nz-article-info">
  143.                             <h3 class="nz-article-title">メモリの選び方</h3>
  144.                             <p class="nz-article-excerpt">容量と速度、DDR4 vs DDR5、デュアルチャネルとは。</p>
  145.                             <span class="nz-article-meta">
  146.                                 <span class="nz-read-time">⏱️ 読了時間: 約5分</span>
  147.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  148.                             </span>
  149.                         </div>
  150.                         <span class="nz-article-arrow">→</span>
  151.                     </a>
  152.                 </li>
  153.                 <li class="nz-article-item">
  154.                     <a href="/user_data/guide_knowledge_storage" class="nz-article-link">
  155.                         <span class="nz-article-icon">💾</span>
  156.                         <div class="nz-article-info">
  157.                             <h3 class="nz-article-title">ストレージの選び方 - SSD vs HDD</h3>
  158.                             <p class="nz-article-excerpt">NVMe、SATA、容量の選び方と組み合わせ方。</p>
  159.                             <span class="nz-article-meta">
  160.                                 <span class="nz-read-time">⏱️ 読了時間: 約4分</span>
  161.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  162.                             </span>
  163.                         </div>
  164.                         <span class="nz-article-arrow">→</span>
  165.                     </a>
  166.                 </li>
  167.                 <li class="nz-article-item">
  168.                     <a href="/user_data/guide_knowledge_psu" class="nz-article-link">
  169.                         <span class="nz-article-icon">⚡</span>
  170.                         <div class="nz-article-info">
  171.                             <h3 class="nz-article-title">電源ユニットの選び方</h3>
  172.                             <p class="nz-article-excerpt">容量計算、80PLUS規格、選んではいけない電源。</p>
  173.                             <span class="nz-article-meta">
  174.                                 <span class="nz-read-time">⏱️ 読了時間: 約5分</span>
  175.                                 <span class="nz-difficulty nz-difficulty-intermediate">中級者向け</span>
  176.                             </span>
  177.                         </div>
  178.                         <span class="nz-article-arrow">→</span>
  179.                     </a>
  180.                 </li>
  181.                 <li class="nz-article-item">
  182.                     <a href="/user_data/guide_knowledge_case" class="nz-article-link">
  183.                         <span class="nz-article-icon">📦</span>
  184.                         <div class="nz-article-info">
  185.                             <h3 class="nz-article-title">PCケースの選び方</h3>
  186.                             <p class="nz-article-excerpt">サイズ、エアフロー、拡張性の基礎知識。</p>
  187.                             <span class="nz-article-meta">
  188.                                 <span class="nz-read-time">⏱️ 読了時間: 約4分</span>
  189.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  190.                             </span>
  191.                         </div>
  192.                         <span class="nz-article-arrow">→</span>
  193.                     </a>
  194.                 </li>
  195.             </ul>
  196.         </article>
  197.         
  198.         {# トラブル対処法 #}
  199.         <article class="nz-knowledge-category">
  200.             <div class="nz-category-header">
  201.                 <span class="nz-category-icon">🔨</span>
  202.                 <h2 class="nz-category-title">トラブル対処法</h2>
  203.                 <p class="nz-category-desc">PCトラブル時の対処法とチェックポイント</p>
  204.             </div>
  205.             <ul class="nz-article-list">
  206.                 <li class="nz-article-item">
  207.                     <a href="/user_data/guide_knowledge_no_boot" class="nz-article-link">
  208.                         <span class="nz-article-icon">🚫</span>
  209.                         <div class="nz-article-info">
  210.                             <h3 class="nz-article-title">PCが起動しない時のチェックリスト</h3>
  211.                             <p class="nz-article-excerpt">電源が入らない、BIOSが立ち上がらない時の対処法。</p>
  212.                             <span class="nz-article-meta">
  213.                                 <span class="nz-read-time">⏱️ 読了時間: 約5分</span>
  214.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  215.                             </span>
  216.                         </div>
  217.                         <span class="nz-article-arrow">→</span>
  218.                     </a>
  219.                 </li>
  220.                 <li class="nz-article-item">
  221.                     <a href="/user_data/guide_knowledge_slow" class="nz-article-link">
  222.                         <span class="nz-article-icon">🐌</span>
  223.                         <div class="nz-article-info">
  224.                             <h3 class="nz-article-title">PCが遅い時の改善方法</h3>
  225.                             <p class="nz-article-excerpt">動作が重い原因の特定と解決方法を解説。</p>
  226.                             <span class="nz-article-meta">
  227.                                 <span class="nz-read-time">⏱️ 読了時間: 約6分</span>
  228.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  229.                             </span>
  230.                         </div>
  231.                         <span class="nz-article-arrow">→</span>
  232.                     </a>
  233.                 </li>
  234.                 <li class="nz-article-item">
  235.                     <a href="/user_data/guide_knowledge_bsod" class="nz-article-link">
  236.                         <span class="nz-article-icon">💙</span>
  237.                         <div class="nz-article-info">
  238.                             <h3 class="nz-article-title">ブルースクリーン（BSOD）対処法</h3>
  239.                             <p class="nz-article-excerpt">エラーコードの読み方と原因別の対処方法。</p>
  240.                             <span class="nz-article-meta">
  241.                                 <span class="nz-read-time">⏱️ 読了時間: 約7分</span>
  242.                                 <span class="nz-difficulty nz-difficulty-intermediate">中級者向け</span>
  243.                             </span>
  244.                         </div>
  245.                         <span class="nz-article-arrow">→</span>
  246.                     </a>
  247.                 </li>
  248.             </ul>
  249.         </article>
  250.         
  251.         {# PC豆知識 #}
  252.         <article class="nz-knowledge-category">
  253.             <div class="nz-category-header">
  254.                 <span class="nz-category-icon">💡</span>
  255.                 <h2 class="nz-category-title">PC豆知識</h2>
  256.                 <p class="nz-category-desc">知っておくと便利なPC関連の情報</p>
  257.             </div>
  258.             <ul class="nz-article-list">
  259.                 <li class="nz-article-item">
  260.                     <a href="/user_data/guide_knowledge_fps" class="nz-article-link">
  261.                         <span class="nz-article-icon">🎯</span>
  262.                         <div class="nz-article-info">
  263.                             <h3 class="nz-article-title">フレームレート（fps）とは？</h3>
  264.                             <p class="nz-article-excerpt">60fps、144fps、240fpsの違いと体感差を解説。</p>
  265.                             <span class="nz-article-meta">
  266.                                 <span class="nz-read-time">⏱️ 読了時間: 約3分</span>
  267.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  268.                             </span>
  269.                         </div>
  270.                         <span class="nz-article-arrow">→</span>
  271.                     </a>
  272.                 </li>
  273.                 <li class="nz-article-item">
  274.                     <a href="/user_data/guide_knowledge_cable" class="nz-article-link">
  275.                         <span class="nz-article-icon">🎨</span>
  276.                         <div class="nz-article-info">
  277.                             <h3 class="nz-article-title">美配線のメリット</h3>
  278.                             <p class="nz-article-excerpt">見た目だけじゃない！エアフローと冷却効率の関係。</p>
  279.                             <span class="nz-article-meta">
  280.                                 <span class="nz-read-time">⏱️ 読了時間: 約4分</span>
  281.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  282.                             </span>
  283.                         </div>
  284.                         <span class="nz-article-arrow">→</span>
  285.                     </a>
  286.                 </li>
  287.                 <li class="nz-article-item">
  288.                     <a href="/user_data/guide_knowledge_bto" class="nz-article-link">
  289.                         <span class="nz-article-icon">⚖️</span>
  290.                         <div class="nz-article-info">
  291.                             <h3 class="nz-article-title">BTO vs フルオーダーの違い</h3>
  292.                             <p class="nz-article-excerpt">それぞれのメリット・デメリットを徹底比較。</p>
  293.                             <span class="nz-article-meta">
  294.                                 <span class="nz-read-time">⏱️ 読了時間: 約5分</span>
  295.                                 <span class="nz-difficulty nz-difficulty-beginner">初心者向け</span>
  296.                             </span>
  297.                         </div>
  298.                         <span class="nz-article-arrow">→</span>
  299.                     </a>
  300.                 </li>
  301.             </ul>
  302.         </article>
  303.         
  304.     </section>
  306.     {# CTA #}
  307.     <section class="nz-section nz-cta-section">
  308.         <div class="nz-cta-box">
  309.             <h2 class="nz-cta-title">読んでもわからない？<br>直接相談できます！</h2>
  310.             <p class="nz-cta-desc">
  311.                 記事を読んでもよくわからない、自分の場合はどうすればいい？<br>
  312.                 そんな時はお気軽にご相談ください。プロがお答えします。
  313.             </p>
  314.             <div class="nz-cta-buttons">
  315.                 <a href="{{ url('contact') }}" class="nz-btn nz-btn-primary nz-btn-lg">
  316.                     <span class="nz-btn-icon">💬</span>
  317.                     無料相談する
  318.                 </a>
  319.                 <a href="{{ url('contact') }}" class="nz-btn nz-btn-secondary nz-btn-lg">
  320.                     <span class="nz-btn-icon">📝</span>
  321.                     見積もりを依頼
  322.                 </a>
  323.             </div>
  324.         </div>
  325.     </section>
  327. </div>
  328. {% endblock %}
  330. {% block javascript %}
  331.     {{ parent() }}
  332.     
  333.     {# 構造化データ - ItemList #}
  334.     <script type="application/ld+json">
  335.     {
  336.         "@context": "https://schema.org",
  337.         "@type": "ItemList",
  338.         "name": "PC知識コンテンツ一覧",
  339.         "description": "PCの選び方、パーツの基礎知識、トラブル対処法など初心者から上級者まで役立つ情報",
  340.         "url": "https://noiezam.com/guide/knowledge",
  341.         "numberOfItems": 15,
  342.         "itemListElement": [
  343.             {
  344.                 "@type": "ListItem",
  345.                 "position": 1,
  346.                 "item": {
  347.                     "@type": "Article",
  348.                     "name": "ゲーミングPCの選び方",
  349.                     "url": "https://noiezam.com/guide/knowledge/gaming"
  350.                 }
  351.             },
  352.             {
  353.                 "@type": "ListItem",
  354.                 "position": 2,
  355.                 "item": {
  356.                     "@type": "Article",
  357.                     "name": "CPUの選び方 - Intel vs AMD",
  358.                     "url": "https://noiezam.com/guide/knowledge/cpu"
  359.                 }
  360.             },
  361.             {
  362.                 "@type": "ListItem",
  363.                 "position": 3,
  364.                 "item": {
  365.                     "@type": "Article",
  366.                     "name": "グラフィックボードの選び方",
  367.                     "url": "https://noiezam.com/guide/knowledge/gpu"
  368.                 }
  369.             }
  370.         ]
  371.     }
  372.     </script>
  373. {% endblock %}