「スタイル PLUS for SWELL」
当プラグインは、WordPressテーマ「SWELL」専用の拡張プラグインです。
専門的なCSSの知識がなくても、管理画面からの直感的な操作のみで、オリジナルの装飾（カスタムスタイル）を作成できるように設計されています。
見出しにも使えます
本マニュアルでは、プラグインのインストール手順から、実際のプレビューを見ながらの設定方法、記事への配置手順までを図解入りで順番に解説しています。
■ すでにご購入いただいた方へ
本ページの手順に沿って進めることで、スムーズに初期設定とカスタムスタイルの作成が完了します。実際の管理画面と見比べながら操作を進めてください。
■ ご購入を検討されている方へ
「設定の難易度」や「実際の操作画面」を事前にご確認いただけるよう、マニュアルを一般公開しております。ご自身の環境で使いこなせそうか、ご検討の材料としてお役立てください。
それでは、具体的な使い方を解説します。
ご購入前の注意事項・利用規約（必ずお読みください）
当プラグインをご利用いただくにあたり、以下の項目をご確認・ご了承くださいますようお願いいたします。
注意事項・利用規約（必ずお読みください）
動作環境と仕様について
- SWELL専用の「非公式」プラグインです
当商品はWordPressテーマ「SWELL」専用の拡張プラグインですが、ヒナテラスが独自に開発した非公式のサードパーティ製品です。SWELL開発元（株式会社LOOS）様とは一切関係ございませんので、本プラグインに関するお問い合わせをSWELL公式様へ行うことは固くご遠慮ください。なお、他のテーマでは動作いたしません。 - 必須環境（システム要件）
以下の環境での動作を推奨しております。（制作・動作確認時のバージョンです）- WordPress本体：バージョン 6.5 以上（最新版を推奨）
- PHP：バージョン 7.4 以上（8.0以上推奨）
※極端に古いバージョンでは正常にデザインが反映されない可能性があります。セキュリティの観点からも、できる限り最新の環境にアップデートしてご利用ください。
- ライブプレビューの表示について
カスタムスタイル設定画面の「ライブプレビュー」機能は、デザインを直感的に視覚化するための目安です。レスポンシブデザインの特性上、お使いの閲覧環境（PC・スマホの画面幅、OSなど）や他のCSSとの干渉により、実際のページ表示とは若干の差異が生じる場合がございます。最終的なデザインは実際の表示画面をご確認の上、微調整を行ってください。 - 他プラグインやCSSとの競合について
お客様独自のCSSカスタマイズや、キャッシュ系・高速化系など一部のプラグインとコードが干渉し、デザインが正常に反映されない場合がございます。すべての環境での完全な動作を保証するものではありません。 - バックアップのお願い
万が一に備え、必ずサイトのバックアップを取得してからインストールを行ってください。当プラグインの使用により生じたサイトの不具合や損害について、当方は一切の責任を負いかねます。
サポートおよびアップデートについて
- サポートの範囲
プラグインの基本的な設定方法は当マニュアルにてご案内しております。明らかな不具合（バグ）のご報告は歓迎いたしますが、お客様固有の環境調査や、個別デザインのカスタマイズ（CSSの書き方など）に関するサポートは対象外となります。 - アップデートと動作保証（現状有姿でのご提供）
本プラグインはご購入時点での「現状有姿（そのままの状態）」でのご提供となります。可能な限りの不具合修正は行いますが、WordPress本体やSWELLの将来的なメジャーアップデートに対する「永久的な互換性・動作保証」をお約束するものではございません。 - 機能・デザインの変更
プラグイン内のスタイル数やデザインの仕様は、より良いものにするため、予告なく追加・変更（統合）される場合がございます。
利用規約・著作権・返品について
- 著作権と再配布の禁止
本プラグインの著作権は、開発者（ヒナテラス）に帰属します。ご購入いただいたお客様が、当プラグインのファイルをそのまま、または改変して、第三者に再配布、転載、共有、販売する行為は固く禁止いたします。ご自身の制作代行サービス等で顧客のサイトに使用することは可能ですが、プラグイン単体を商品として二次配布することはできません。 - GPLライセンスの適用について
本プラグインのPHPコード部分についてはGPLライセンス（Ver2.0以降）を遵守しております。ただし、画像素材、デザイン要素、ドキュメントについてはGPLの適用外となり、当方の許可なく複製・転用することはできません。 - 返品・返金について
商品の性質上（デジタルコンテンツ）、ご購入後のキャンセルおよび返金は原則としてお受けできかねます。環境要件等をよくご確認の上、ご購入をお願いいたします。
＼人気テーマ「SWELL」専用プラグイン／
【スタイル PLUS for SWELL】
先着20名様限定・リリース特別価格
定価2,980円→特別価格1,980円
収録スタイルのデザイン一覧
まずは、当プラグインを有効化するだけで最初から使える「収録スタイル」のデザインをご紹介します。
シンプルな角丸やストライプから、手書き風、見出し向けの立体リボンまで、ブログのアクセントになる様々なバリエーションをご用意しています。
※実際のブロックへの適用手順や、色の変更方法については、後述の「エディター画面での使い方」でまとめて解説します。まずは、どんなデザインが使えるのかカタログとしてご覧ください。
収録スタイルの紹介
角丸小
角丸小（太）
角丸大
角丸大（太）
チェック
ストライプ
左線＋ストライプ
交差線
上下線
手書き
先頭大文字
角スクエア
ベタ影
ずらし背景
L字
背景シェード
フルワイド
リボン（中央揃え）
※リボンは背景色でスタイルのカラーが変わります
チェック
ポイント
memo
OK
NG
コピーブロック
紹介コードなどを読者にコピぺしてもらいたいときに使ってください
カラースタイル
SWELLの標準機能では4つまでしか登録できないので、増やしました。背景色も併用できるのでベタ塗りのブロックにもなります。
灰
赤
ピンク
紺
青
紫
オレンジ
黄
緑
茶
SWELL標準スタイルと収録スタイルの併用
SWELL標準スタイルと収録スタイルは併用できる組み合わせもあります。
角スクエア＋方眼
カラー（紫）＋角に折り目＋背景塗り
※スタイルの組み合わせによってデザインが崩れることがありますので、いろいろお試しください。
カスタムスタイル（全6枠）の設定方法
本プラグインの目玉機能である「カスタムスタイル」について解説します。
画像を2枚アップロードして、オリジナルのスタイルを6つ登録できます！
登録したスタイルは、記事作成エディターでワンクリックで装飾可能です。
設定方法
WordPress管理画面の左メニューに追加された 「スタイル PLUS」 をクリックして設定画面を開きます。
画像を2枚登録し、好みの位置に配置します。プレビュー画面をみながら設定してください。
ライブプレビューの表示について
カスタムスタイル設定画面の「ライブプレビュー」機能は、デザインを直感的に視覚化するための目安です。レスポンシブデザインの特性上、お使いの閲覧環境（PC・スマホの画面幅、OSなど）や他のCSSとの干渉により、実際のページ表示とは若干の差異が生じる場合がございます。最終的なデザインは実際の表示画面をご確認の上、微調整を行ってください。
配置パターンは以下になります。
パターン１：対角（左上＆右下）
パターン2：逆対角（左下＆右上）
パターン3：左右中央（同じ高さ）
パターン4：上下中央
パターン5：背景1枚
画像1に長方形の画像（1200×400推奨）を設定してください。画像2は使いません。
パターン5は全域をカバーしているので、どんなデザインもほぼ反映できます。
例）背景に英文字
～事業内容～
画像の配置が決まったら、枠線の種類、色、太さを決めてください。
お好みのデザインができたら、画面一番下の 「すべての設定を保存する」 を必ずクリックしてください。
画像サイズについて
画像の推奨サイズ
- パターン1～6：正方形（240×240px推奨）
- パターン7：横長（1200×400px推奨）
※いずれも透過画像（PNG）をご用意ください。
画像位置の微調整について
それぞれの配置パターンにおける基準位置は固定されています。
実際の装飾イメージをプレビュー画面で確認しながら、アップロードする透過画像側の余白を調整して、お好みの位置・サイズに合わせてください。
エディター画面での使い方
実際の記事作成エディターで装飾を適用する手順を解説します。
最初から用意されている「収録スタイル」も、ご自身で設定したオリジナルの「カスタムスタイル」も、基本的な操作方法はすべて同じです。
スタイルを適用する基本操作に加え、お好みのカラーに変更する方法や、そのままではスタイルが使えないブロックを装飾する「グループ化」の裏技も併せてご紹介します。
記事の編集画面での使い方
- 記事の編集画面（ブロックエディター）を開き、「見出し」「段落ブロック」にテキストを入力します。
- 画面右側の設定サイドバーにある 「スタイル」 パネルを開きます。
- カスタムスタイル5つと収録スタイルの中から、お好きなものを選んでクリックするだけです！
お好みの色に変更する方法
収録スタイルにはテキストカラー（文字色）とメインカラーの2色用意されているものがあります。
カラーは「外観」→「カスタマイズ」→「サイト全体設定」→「基本カラー」から変更できます。
基本は上記2色のスタイルになります。
スタイルの色を自由に変える方法
上記2色以外の色にしたい場合は、まず文字色のスタイルを選択してください。
ブロック全体の文字色（設定パネル右側の「色」＞「テキスト」）を変更すると、追加スタイル（枠線など）の色も連動して変わります↓
※ツールバーから「一部の文字色だけ」を変更した場合、スタイルの枠線等には適用されません↓
つまり、「文字色（テキストカラー）」ベースのスタイルを選び、ブロック自体のテキストカラーを変更することで、お好みの色で無制限にカスタマイズが可能です。
テキストの色もいっしょに変わってしまうので、ツールバーから好きなテキストカラーに戻してください。
※1部のスタイルではテキストカラーが反映されないものもあります。ご了承ください。
グループブロックにも使えます
スタイルは、グループブロックにも使用できます。
グループブロックにも装飾できます！
- 箇条書き１
- 箇条書き２
- 箇条書き３
グループ化していろんなパターンを探してください
グループ化の応用
スタイルが選べないSWELL標準ブロックでも、単体で「グループ化」することでスタイルを適用できるようになります。
＼SWELLボタンを単体でグループ化した例／
吹き出しブロックもグループにしてしまえば装飾できるよ
※スタイルの組み合わせによってデザインが崩れることがありますので、いろいろお試しください。
プラグインのインストール方法
購入の手続き後、ZIPファイルがダウンロードできます。
まずは、ダウンロードしたZIPファイルをWordPressにインストールしましょう。
- WordPressの管理画面から 「プラグイン」＞「プラグインを追加」 をクリックします。
- 画面上部の 「プラグインのアップロード」 をクリックします。
- 「ファイルを選択」ボタンを押し、ダウンロードしたZIPファイルを選択して、「今すぐインストール」 をクリックします。
- インストールが完了したら、「プラグインを有効化」 ボタンをクリックします。
これで準備は完了です！
プラグインのアップデート方法
不具合修正や機能追加などで新しいバージョンのZIPファイルを配布する場合があります。
受け取った場合の更新手順です。
- 最新のZIPファイルをダウンロードします。
- WordPress管理画面の「プラグイン」＞「新規追加」＞「プラグインのアップロード」を開きます。
- 新しいZIPファイルを選択し、「今すぐインストール」をクリックします。
- 画面に 「アップロードされたもので現在のものと置き換える」 というボタンが表示されるので、それをクリックします。
これで最新版へのアップデートが完了です。
設定していたカスタム装飾のデータが消えることはありませんのでご安心ください。
よくある質問
カスタム装飾について、プレビュー画面やPC、スマホでそれぞれ見え方が少し違うのですが？
PCやスマホなど、見る端末の画面サイズに合わせて自動でレイアウトを調整する「レスポンシブデザイン」の特性上、プレビュー画面や各端末で見え方（画像のズレや改行位置など）が異なる場合がございます。
管理画面のプレビューはあくまで「目安」としてご利用いただき、最終的には実際のスマホやPCの画面を確認しながら微調整を行ってください。
設定を保存したのに、実際の記事に反映されません。
キャッシュ系プラグイン（WP Super Cache等）や、サーバー側のキャッシュ機能が影響している可能性があります。一度キャッシュをクリア（削除）してから、再度ページを読み込んでみてください。
CSSを追加して自分でカスタマイズしてもいいですか？
はい、プラグインが出力するHTMLに対してご自身で追加CSSを記述していただくことは可能です。ただし、独自カスタマイズに関するサポートは対象外となりますのでご了承ください。
マニュアルを読んでも解決しない不具合・バグを見つけました。
ご不便をおかけして申し訳ございません。明らかな不具合と思われる場合は、【お問い合わせフォーム 】よりご報告をお願いいたします。
（※個別の環境による不具合や、カスタマイズに関するご質問にはお答えできかねますのでご了承ください）
プラグインを有効化したら、SWELLの他の機能がうまく動かなくなりました。
導入されている他のプラグイン（特に高速化やコード最適化プラグイン）と干渉している可能性があります。原因を特定するため、一度他のプラグインを無効化して動作をご確認ください。
使い方マニュアルは以上となります。
「スタイル PLUS for SWELL」を使って、あなただけの素敵なブログデザインをお楽しみください！
ご購入はこちら
＼人気テーマ「SWELL」専用プラグイン／
【スタイル PLUS for SWELL】
先着20名様限定・リリース特別価格
定価2,980円→特別価格1,980円
