{"title":"無料セクション","description":"","products":[{"product_id":"heading-bg-text","title":"見出しセクション — 36種類のデザインから選べる万能見出し","description":"\u003c!-- リード文（HTML） --\u003e\n\u003ch2\u003e\u003cstrong\u003e見出しひとつで、ストアの印象は変わる。\u003c\/strong\u003e\u003c\/h2\u003e\n\u003cp\u003e\n  「なんだか素人っぽい」「テンプレート感が抜けない」──その原因、見出しのデザインかもしれません。\u003cbr\u003e\n  商品カテゴリやブランドの世界観に合わせて見出しのデザインを選ぶだけで、ページ全体にプロが手がけたような統一感と洗練さが生まれます。\n\u003c\/p\u003e\n\u003cp\u003e\n  このセクションは、\u003cstrong\u003e左線・下線・リボン・吹き出し・タグ・背景テキストなど全36種類のデザイン\u003c\/strong\u003eをセレクトひとつで切り替え可能。\u003cbr\u003e\n  色・太さ・サイズ・配置・余白はテーマエディタから自由にカスタマイズでき、PC・モバイルそれぞれに最適なフォントサイズを設定できるので、どのデバイスでも美しい表示を実現します。\u003cbr\u003e\n  \u003cstrong\u003eアプリ不要・無料\u003c\/strong\u003eで、テーマに直接組み込むだけ。すぐにストアの見た目をワンランク上げられます。\n\u003c\/p\u003e\n\n\u003c!-- 主な機能・特徴（HTML） --\u003e\n\u003ch2\u003e\u003cstrong\u003e主な機能・特徴\u003c\/strong\u003e\u003c\/h2\u003e\n\n\u003ch3\u003e\u003cstrong\u003e🎨 36種類の見出しデザインを自由に切り替え\u003c\/strong\u003e\u003c\/h3\u003e\n\u003cp\u003e\n  シンプルな線系から装飾的な枠・背景系まで、あらゆるページに馴染む豊富なバリエーション。\u003cbr\u003e\n  セレクトボックスから選ぶだけで、HTMLやCSSを触らずにデザインを切り替えられます。\n\u003c\/p\u003e\n\u003cul\u003e\n  \u003cli\u003e\n\u003cstrong\u003e線系（11種類）\u003c\/strong\u003e：左線／左線＆背景色／左線＆背景色（立体的）／左線＆背景色（内側）／下線／文字数に応じた下線／下線（点線／破線／二重線／小）／両端に線／左右に斜線\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003e枠・吹き出し系（8種類）\u003c\/strong\u003e：鉤括弧／鉤括弧（大）／吹き出し風／吹き出し風（下線のみ）／立体的／カラフルなシャドウ／四角形の装飾／タグ風\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003eリボン・旗・付箋系（6種類）\u003c\/strong\u003e：リボン風／背景に回り込むリボン風／旗風／テープ風／付箋風（単色）／付箋風（先端色）\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003e数字・ラベル系（4種類）\u003c\/strong\u003e：番号／数字の背景／大きいラベル／1文字目だけ大きめ\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003e背景・装飾系（7種類）\u003c\/strong\u003e：文字の背景／円の背景／ストライプ背景／チェック柄／映画フィルム風／下に反射する文字\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003e\u003cstrong\u003e🖌️ 細やかな共通設定\u003c\/strong\u003e\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003e見出しテキスト：テキスト \/ フォントサイズ（PC・モバイル別）\/ 太さ \/ 色\u003c\/li\u003e\n  \u003cli\u003e横幅・配置：自動 \/ 横幅いっぱい \/ テキストに合わせる × 左寄せ \/ 中央 \/ 右寄せ\u003c\/li\u003e\n  \u003cli\u003eデザイン個別設定：各デザインに合わせた色・太さ・装飾パラメータ\u003c\/li\u003e\n  \u003cli\u003eセクション全体：背景色 \/ 最大幅 \/ 余白（PC・モバイル別に上下左右）\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003e\u003cstrong\u003e📱 PC \/ モバイル別のレスポンシブ設定\u003c\/strong\u003e\u003c\/h3\u003e\n\u003cp\u003e\n  フォントサイズと余白（上下左右）をPC・モバイルそれぞれ個別に設定可能。\u003cbr\u003e\n  デバイスごとに最適な表示を実現します。\n\u003c\/p\u003e\n\n\u003ch3\u003e\u003cstrong\u003e⚙️ すべて日本語・ノーコードで操作可能\u003c\/strong\u003e\u003c\/h3\u003e\n\u003cp\u003e\n  テーマエディタの設定画面はすべて\u003cstrong\u003e日本語\u003c\/strong\u003e。HTMLやCSSの知識は一切不要で、直感的に操作できます。\n\u003c\/p\u003e\n\n\u003ch2\u003e\u003cstrong\u003e🎁 このセクションが無料の理由\u003c\/strong\u003e\u003c\/h2\u003e\n\u003cp\u003e\n  Copilifyのコード品質・設定画面の使いやすさを、まず体験していただくために無料公開しています。\u003cbr\u003e\n  有料セクションもすべて同じ作り・同じ導入手順です。36種類の見出しデザインで「これが無料なら」と感じていただけたら、ぜひ他のセクションもご覧ください。\n\u003c\/p\u003e\n\n\u003ch2\u003e\u003cstrong\u003e🔧 開発・検証について\u003c\/strong\u003e\u003c\/h2\u003e\n\u003cp\u003e\n  Copilifyのセクションは、Shopify Plusパートナー企業に所属する現役エンジニアが開発しています。\u003cbr\u003e\n  月商5,000万円超のECサイト構築を手がける実案件と同じ基準で、コードの品質・表示速度・テーマエディタの使いやすさまで検証済みです。\n\u003c\/p\u003e\n\u003cul\u003e\n  \u003cli\u003eShopify標準のLiquid・CSS・JavaScriptのみで構築し、特定テーマの専用機能に依存しない設計。Online Store 2.0対応テーマであれば基本的にご利用いただけます\u003c\/li\u003e\n  \u003cli\u003e開発・表示確認はDawn系テーマで実施。世の中すべてのテーマでの検証はできているわけではないため、ご不安な場合はご購入前にテーマ名を添えてお問い合わせください\u003c\/li\u003e\n  \u003cli\u003e設定画面はすべて日本語ラベル、導入手順は動画付きガイドでご案内\u003c\/li\u003e\n  \u003cli\u003e導入でつまずいた場合は無料サポートで解決まで対応\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003cp style=\"font-size: 0.85em; color: #666; margin-top: 2em;\"\u003e\n  ※ 本セクションのデザインは \u003ca href=\"https:\/\/pote-chil.com\/css-stock\/ja\" target=\"_blank\" rel=\"noopener\"\u003eCSS Stock（pote-chil.com）\u003c\/a\u003e を参考に作成しています。\n\u003c\/p\u003e\n","brand":"Copilify","offers":[{"title":"Default Title","offer_id":50263025418523,"sku":"","price":0.0,"currency_code":"JPY","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0882\/3678\/5947\/files\/1_041ecbab-d80d-4d0a-8858-cfcbdff851b7.jpg?v=1776604024"},{"product_id":"marquee","title":"流れるアイテム（マーキー）— 受賞・掲載・お客様の声を流して信頼感アップ","description":"\u003ch2\u003e\u003cstrong\u003e受賞・メディア掲載・お客様の声——\"流れる実績\"が、ブランドの信頼感を静かに積み上げる\u003c\/strong\u003e\u003c\/h2\u003e\n\n\u003cp\u003e\n  「本当に大丈夫?」——はじめて訪れた訪問者は、必ずそう思っています。\u003cbr\u003e\n  受賞歴、メディア掲載ロゴ、お客様の声が画面を滑らかに流れる——それだけで、その疑いが「このブランドは信頼できる」に変わっていきます。\u003cbr\u003e\n  マーキー（流れるアイテム）は、ページを見ているだけでブランドの実績を伝え続ける、最もコストパフォーマンスの高い信頼演出のひとつです。\n\u003c\/p\u003e\n\u003cp\u003e\n  このセクションは、画像とテキストを自由に組み合わせてマーキー表示を実現します。\u003cbr\u003e\n  ドラッグ・タッチ操作による手動スクロールにも対応。速度・方向・ホバー時の一時停止もテーマエディタからノーコードで設定できます。\u003cbr\u003e\n  テーマに直接組み込む形式なので、\u003cstrong\u003e外部アプリの月額費用がかからず\u003c\/strong\u003e、外部スクリプト読み込みによるページ表示速度への影響もありません。\n\u003c\/p\u003e\n\n\u003ch2\u003e\u003cstrong\u003e主な機能・特徴\u003c\/strong\u003e\u003c\/h2\u003e\n\n\u003ch3\u003e🎯 画像＆テキストの自由な組み合わせ\u003c\/h3\u003e\n\u003cp\u003e\n  ブランドロゴ画像・受賞バッジ・お客様の声テキストなど、画像ブロックとテキストブロックを自由に組み合わせてマーキーを構成できます。\u003cbr\u003e\n  各アイテムにリンクを設定し、別タブで開く設定も可能です。\n\u003c\/p\u003e\n\n\u003ch3\u003e🖱️ ドラッグ・タッチ操作対応\u003c\/h3\u003e\n\u003cp\u003e\n  PCではマウスドラッグ、スマートフォンではスワイプで手動スクロール可能。\u003cbr\u003e\n  訪問者が自発的に操作できるインタラクティブなUXを実現します。\n\u003c\/p\u003e\n\n\u003ch3\u003e⚙️ スクロール動作の細かな制御\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003eスクロール速度：5〜60秒（1周にかかる秒数で直感的に調整）\u003c\/li\u003e\n  \u003cli\u003eスクロール方向：右から左 \/ 左から右を切り替え可能\u003c\/li\u003e\n  \u003cli\u003eホバー時に一時停止：ON\/OFF 切り替え\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003e📱 PC \/ モバイル別レスポンシブ設定\u003c\/h3\u003e\n\u003cp\u003e\n  画像の高さ（PC：50〜500px \/ モバイル：50〜300px）をそれぞれ個別に設定。\u003cbr\u003e\n  テキストブロックもPC・モバイルで異なるフォントサイズを指定できます。\n\u003c\/p\u003e\n\n\u003ch3\u003e🎨 細やかなデザイン調整（19の設定項目）\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003e画像の角丸（0〜30px）\u003c\/li\u003e\n  \u003cli\u003eアイテム間の余白（0〜60px）\u003c\/li\u003e\n  \u003cli\u003e背景色・最大幅の設定\u003c\/li\u003e\n  \u003cli\u003eセクション余白（上下左右）のPC \/ モバイル個別設定\u003c\/li\u003e\n  \u003cli\u003eテキストの色・サイズ・太さ（標準 \/ 太字）\u003c\/li\u003e\n  \u003cli\u003e見出しテキスト・色・サイズ（PC \/ モバイル個別）\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003cp\u003eテーマエディタの設定画面はすべて\u003cstrong\u003e日本語ラベル\u003c\/strong\u003eなので、直感的に操作できます。\u003c\/p\u003e\n\n\u003ch3\u003e♾️ シームレスなループ表示\u003c\/h3\u003e\n\u003cp\u003e\n  アイテム数が少なくても画面幅に合わせて自動的に複製・補完するため、途切れのない滑らかなループを維持します。\u003cbr\u003e\n  アクセシビリティ配慮として「モーション低減」設定のユーザーには自動停止します（prefers-reduced-motion対応）。\n\u003c\/p\u003e\n\n\u003ch3\u003e💡 活用例\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003e受賞歴・認証バッジの掲示\u003c\/li\u003e\n  \u003cli\u003eメディア掲載・取材実績のロゴ紹介\u003c\/li\u003e\n  \u003cli\u003eお客様の声・レビュー抜粋の常時表示\u003c\/li\u003e\n  \u003cli\u003e取扱ブランド・パートナーロゴの一覧\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch2\u003e\u003cstrong\u003e🔧 開発・検証について\u003c\/strong\u003e\u003c\/h2\u003e\n\u003cp\u003e\n  Copilifyのセクションは、Shopify Plusパートナー企業に所属する現役エンジニアが開発しています。\u003cbr\u003e\n  月商5,000万円超のECサイト構築を手がける実案件と同じ基準で、コードの品質・表示速度・テーマエディタの使いやすさまで検証済みです。\n\u003c\/p\u003e\n\u003cul\u003e\n  \u003cli\u003eShopify標準のLiquid・CSS・JavaScriptのみで構築し、特定テーマの専用機能に依存しない設計。Online Store 2.0対応テーマであれば基本的にご利用いただけます\u003c\/li\u003e\n  \u003cli\u003e開発・表示確認はDawn系テーマで実施。世の中すべてのテーマでの検証はできているわけではないため、ご不安な場合はご購入前にテーマ名を添えてお問い合わせください\u003c\/li\u003e\n  \u003cli\u003e設定画面はすべて日本語ラベル、導入手順は動画付きガイドでご案内\u003c\/li\u003e\n  \u003cli\u003e導入でつまずいた場合は無料サポートで解決まで対応\u003c\/li\u003e\n\u003c\/ul\u003e","brand":"Copilify","offers":[{"title":"Default Title","offer_id":52049891492123,"sku":null,"price":0.0,"currency_code":"JPY","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0882\/3678\/5947\/files\/5sec_0.4_compressed_b28449cb-10a0-4f4e-a63c-4b5fa45bbc90.gif?v=1776247637"},{"product_id":"back-to-top","title":"トップへ戻るボタン — 長いページでも離脱させない直感操作","description":"\u003ch2\u003e\u003cstrong\u003e長いページの最後まで読んだ訪問者を、迷わせずにもう一度トップへ——静かに効く回遊導線\u003c\/strong\u003e\u003c\/h2\u003e\n\n\u003cp\u003e\n  商品詳細、LP、ブログ記事——ページが縦に長くなるほど、訪問者は「戻るのが面倒」で離脱します。\u003cbr\u003e\n  画面の隅に小さく浮かぶ\"ページトップへ戻る\"ボタンがあるだけで、その一手間がゼロになり、他商品や関連情報への回遊が自然に続いていきます。\u003cbr\u003e\n  地味な存在ながら、ページ下部での離脱率・回遊率に確実に効くUIです。\n\u003c\/p\u003e\n\u003cp\u003e\n  このセクションは、表示位置・形状・色・アイコン・テキストまでテーマエディタから自由にカスタマイズできます。\u003cbr\u003e\n  設定したスクロール量を超えたときだけフェードイン表示、クリックでなめらかにトップへ戻る——訪問者の視界をさりげなく支える動きを標準装備。\u003cbr\u003e\n  テーマに直接組み込む形式なので、\u003cstrong\u003e外部アプリの月額費用がかからず\u003c\/strong\u003e、外部スクリプト読み込みによるページ表示速度への影響もありません。\n\u003c\/p\u003e\n\n\u003ch2\u003e\u003cstrong\u003e主な機能・特徴\u003c\/strong\u003e\u003c\/h2\u003e\n\n\u003ch3\u003e📍 表示位置を3パターンから選択\u003c\/h3\u003e\n\u003cp\u003e\n  右下・左下・下中央の3パターンから選択可能。\u003cbr\u003e\n  画面端からの距離（左右・下）もPC／モバイル個別にpx単位で細かく調整できるので、既存のチャットボタンやカートアイコンと干渉しない位置に配置できます。\n\u003c\/p\u003e\n\n\u003ch3\u003e🎯 スクロール量に応じた自動表示\u003c\/h3\u003e\n\u003cp\u003e\n  ページを開いた直後はボタンを隠し、指定したスクロール量（0〜2000px）を超えたタイミングでフェードイン表示。\u003cbr\u003e\n  ファーストビューの邪魔をせず、必要な場面でだけ静かに現れます。\n\u003c\/p\u003e\n\n\u003ch3\u003e🖱️ なめらかスクロールと瞬間移動を切替\u003c\/h3\u003e\n\u003cp\u003e\n  クリック時のスクロール動作を「なめらか」「即座に移動」から選択可能。\u003cbr\u003e\n  アクセシビリティ配慮として「モーション低減」設定のユーザーには自動で即時スクロールに切り替わります（prefers-reduced-motion対応）。\n\u003c\/p\u003e\n\n\u003ch3\u003e🎨 アイコン4種類＋テキスト併用に対応\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003eアイコン：上向き矢印 \/ 山型 \/ 三角形 \/ 二重山型 \/ なし\u003c\/li\u003e\n  \u003cli\u003eボタンテキスト：空欄でアイコンのみ、「TOP」など任意の文字列を追加可能\u003c\/li\u003e\n  \u003cli\u003eテキストの太さ：標準 \/ 太字\u003c\/li\u003e\n  \u003cli\u003e読み上げ用 aria-label も自由に設定可能\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003e🟠 形状・サイズ・色の細やかなカスタマイズ（28の設定項目）\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003e形状：円形 \/ 角丸（半径0〜30px） \/ 四角\u003c\/li\u003e\n  \u003cli\u003eボタンサイズ：PC 32〜100px \/ モバイル 32〜80px（個別設定）\u003c\/li\u003e\n  \u003cli\u003eアイコンサイズ・文字サイズもPC／モバイル個別に調整\u003c\/li\u003e\n  \u003cli\u003e背景色・アイコン／テキスト色・ホバー時の色をそれぞれ設定\u003c\/li\u003e\n  \u003cli\u003e枠線（0〜6px）・影の有無も切替可能\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003e📱 PC \/ モバイル別の表示切替\u003c\/h3\u003e\n\u003cp\u003e\n  PCのみ・モバイルのみ表示するといった切替にも対応。\u003cbr\u003e\n  デバイスごとに最適なUXを設計できます。\n\u003c\/p\u003e\n\n\u003ch3\u003e♿ アクセシビリティ配慮\u003c\/h3\u003e\n\u003cp\u003e\n  キーボード操作時のフォーカスリング表示、スクリーンリーダー向けの aria-label、モーション低減設定への自動対応など、すべての訪問者が迷わず使える設計です。\n\u003c\/p\u003e\n\n\u003ch2\u003e\u003cstrong\u003e🔧 開発・検証について\u003c\/strong\u003e\u003c\/h2\u003e\n\u003cp\u003e\n  Copilifyのセクションは、Shopify Plusパートナー企業に所属する現役エンジニアが開発しています。\u003cbr\u003e\n  月商5,000万円超のECサイト構築を手がける実案件と同じ基準で、コードの品質・表示速度・テーマエディタの使いやすさまで検証済みです。\n\u003c\/p\u003e\n\u003cul\u003e\n  \u003cli\u003eShopify標準のLiquid・CSS・JavaScriptのみで構築し、特定テーマの専用機能に依存しない設計。Online Store 2.0対応テーマであれば基本的にご利用いただけます\u003c\/li\u003e\n  \u003cli\u003e開発・表示確認はDawn系テーマで実施。世の中すべてのテーマでの検証はできているわけではないため、ご不安な場合はご購入前にテーマ名を添えてお問い合わせください\u003c\/li\u003e\n  \u003cli\u003e設定画面はすべて日本語ラベル、導入手順は動画付きガイドでご案内\u003c\/li\u003e\n  \u003cli\u003e導入でつまずいた場合は無料サポートで解決まで対応\u003c\/li\u003e\n\u003c\/ul\u003e","brand":"Copilify","offers":[{"title":"Default Title","offer_id":52073502474523,"sku":null,"price":0.0,"currency_code":"JPY","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0882\/3678\/5947\/files\/compressed_5e1a98ef-0165-43f1-8c13-378ab938639e.gif?v=1776477638"}],"url":"https:\/\/copilify.com\/collections\/free.oembed","provider":"Copilify","version":"1.0","type":"link"}