• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

FOXWP

WordPressの始め方と使い方をわかりやすく解説!

  • HOME
  • WordPressブログの始め方
  • お問い合わせ
FOXWP / WordPress / WordPressのカスタムCSS追加プラグイン6個を比較|おすすめはどれ?
※当サイトでは、アフィリエイト広告を利用しています。

WordPressのカスタムCSS追加プラグイン6個を比較|おすすめはどれ?

最終更新日:2021年10月6日

この記事では、カスタムCSSを追加できる以下の6つのプラグインを比較し、目的別におすすめを紹介します。

  • Simple CSS
  • Simple Custom CSS
  • SiteOrigin CSS
  • Simple Custom CSS and JS
  • WP Add Custom CSS
  • Code Snippets
目次 非表示
1 WordPressのカスタムCSS追加プラグインの選び方
1.1 CSSの知識が十分か
1.2 CSSを適用したい範囲
1.3 CSS以外にHTMLショートコードやJavascriptを使用するか
2 おすすめのカスタムCSS追加プラグインを目的別に紹介
2.1 迷った方向け(シンプルな機能のみ)
2.2 WordPress初心者向け
2.3 投稿・固定ページごとにCSSを適用したい方向け
2.4 ショートコードやJavascriptも追加したい方向け
3 プラグインでカスタムCSSの追加を行うメリット
3.1 テーマを変更しても編集内容が保存される

WordPressのカスタムCSS追加プラグインの選び方

WordPressのカスタムCSS追加プラグインを選ぶ際には、以下の項目を考えるといいでしょう。

  • CSSの知識が十分か
  • 投稿個別にCSSを適用したいか
  • CSS以外にショートコードやJavascriptを使用するか

CSSの知識が十分か

CSSの追加は、デザインやレイアウト変更のために行います。

その変更内容によって、適したCSSを記述する必要があります。

CSSの知識が十分にない方は、希望の変更を行えないかもしれません。

そういった方は、自身でCSSコードの記述を行うことなく、直感的な操作(数値などの入力)のみで自動的にCSSコードを追加してくれるプラグインがおすすめです。

CSSを適用したい範囲

追加したカスタムCSSは、基本的にサイト全体に適用されます。

投稿ページ・固定ページ個別に適用したいCSSがある方は、個別にカスタムCSSを追加できる機能があるプラグインを選びましょう。

CSS以外にHTMLショートコードやJavascriptを使用するか

プラグインによっては、カスタムCSSの追加以外にも、HTMLショートコードやJavascriptの追加に対応しています。

プラグインの管理を楽にしたい方は、まとめて管理できるプラグインがおすすめです。

おすすめのカスタムCSS追加プラグインを目的別に紹介

迷った方向け(シンプルな機能のみ)

Simple Custom CSS Plugin Simple Custom CSS Plugin

Author(s): John Regan

Current Version: 4.0.6

Last Updated: 2022年10月6日

simple-custom-css.zip

96%Ratings 200,000+Installs 3.0.1Requires

Simple Custom CSSは、シンプルなCSSエディターのみを追加するWordPressプラグインです。

設定項目などは一切ありません。

ひとまずカスタムCSSを追加できるプラグインが欲しい方におすすめです。

WordPress初心者向け

SiteOrigin CSS SiteOrigin CSS

Author(s): SiteOrigin

Current Version: 1.5.9

Last Updated: 2023年11月11日

so-css.1.5.9.zip

98%Ratings 200,000+Installs WP 3.9+Requires

SiteOrigin CSSは、シンプルなCSSエディターに加えて、直感的な操作でCSSを追加できるビジュアルエディター機能があります。

ビジュアルエディター機能を利用すれば、CSSに詳しくなくても様々なデザイン変更が可能です。

投稿・固定ページごとにCSSを適用したい方向け

Simple CSS Simple CSS

Author(s): Tom Usborne

Current Version: 1.1.1

Last Updated: 2023年8月30日

simple-css.1.1.1.zip

98%Ratings 100,000+Installs WP 4.0+Requires

Simple CSSは、サイト全体および投稿個別のカスタムCSSの追加が行えるWordPressプラグインです。

投稿個別に適用できる機能がないプラグインで追加したCSSは、サイト全体に適用がされます。

ほぼ同じ機能を持ったプラグインとしてWP Add Custom CSSがあります。

違いはカスタム投稿タイプの設定項目の有無だけなので、カスタム投稿タイプを使う予定がない方はどちらを選んでもいいでしょう。

ショートコードやJavascriptも追加したい方向け

Code Snippets Code Snippets

Author(s): Code Snippets Pro

Current Version: 3.6.2

Last Updated: 2023年11月11日

code-snippets.3.6.2.zip

96%Ratings 800,000+Installs WP 5.0+Requires

Code Snippetsは、CSSだけではなく、HTMLショートコードやJavascriptのコードをまとめて管理できるWordPressプラグインです。

記述はアクションフックを使用しているため、WordPress関数およびPHPの知識が少し必要となります。

そのため、WordPress初心者にはあまりおすすめできません。

一方でWordPressやPHPに知識がある方は、HTMLショートコード・CSS・JavascriptをCode Snippetsのみで追加できるため、管理が行いやすいでしょう。

プラグインでカスタムCSSの追加を行うメリット

テーマを変更しても編集内容が保存される

もしプラグインを使用しなかった場合、テーマを変更する前に行ったCSSの編集内容が、移行後のテーマに反映されません。

プラグインを使用せずにCSS編集を行う場合、テーマのスタイルシートを編集するかカスタマイズメニューにある追加CSSを利用することになります。

これらのCSSの編集内容は、テーマに紐づけられるためです。

そのため、テーマを変更しても利用したいCSSは、プラグインを利用して編集を行うことをおすすめします。

カテゴリー:WordPress タグ:WordPressプラグイン

WordPress初心者の方に読んで欲しい記事

  • あとで後悔しない!WordPress初期設定の基本事項
  • 安全にサイトを運営しよう!WordPressセキュリティ対策の基本マニュアル
Previous Post: « WordPressではどんなウェブサイトを作れる?具体例を紹介
Next Post: WordPressでインスタグラムを埋め込みしても表示されない原因と対処法 »

Primary Sidebar

世界で一番利用されているWordPressテーマ

Divi WordPress Theme
レビューを見る

あなたの悩みは?

WordPress
セキュリティ
WordPress
トラブル
アクセスアップアフィリエイト
おすすめASP

最近の投稿

  • 検索順位が付かない時に確認すべきこと
  • GA4でイベントのイベントパラメータを確認する方法
  • WordPressのおすすめセキュリティプラグイン6選
  • WordPressでおすすめの目次プラグイン8選
  • WordPressでバックアップを取る2つの方法を解説

カテゴリー

  • GA4
  • WordPress
  • お役立ち情報
  • アフィリエイト
  • ドメインレジストラ
  • レンタルサーバー
    • ColorfulBox
    • Conoha WING
    • mixhost
    • さくらのレンタルサーバー
    • エックスサーバー
    • エックスフリー
    • ロリポップ!
  • 便利ツール
WordPress学習方法
トップページへ

プライバシーポリシー|お問い合わせ
Copyright © 2023 FOXWP All rights reserved.