補足情報を表示させるための拡張クラスの使い方|Simplicity

Simplicityに、以下のような足説明(補足情報補)用のスタイルを適用した拡張クラスを追加しました。

以下のような補足説明用のスタイルを表示できます。

補足説明を入力する。
疑問を持たれそうな内容に関する補足説明を入力する。
スポンサーリンク

利用方法

上記のような、補足説明のためのスタイルを適用させるには、Wordpressエディター等に以下のように入力してください。

補足説明(インフォメーション)

<div class="information">補足説明を入力する。</div>

補足説明(クエスチョン)

<div class="question">疑問を持たれそうな内容に関する補足説明を入力する。</div>

スタイルの詳しい設定や、AddQuicktagプラグインの設定方法などは、以下の記事を参照してください。

ブログで記事を書いていて補足説明を入れたいときがあります。 そんな時はこれまで、以下のようなスタイルを用いて補…

レスポンシブ表示にしたくない場合

デフォルトでは、デバイスの横幅が440px未満の場合は、アイコンなどは非表示になります。

アイコンを表示にしたくない場合は、子テーマのstyle.css等で以下のように記入してください。

@media screen and (max-width:440px){
  .information,
  .question{
    padding: 20px 20px 20px 72px;
  }
  .information::before,
  .question::before{
    display: inline;
  }
}

親テーマで、指定されたスタイル指定を打ち消すことができるかと思います。

GitHubリポジトリ

不具合等ありましたらGitHubに、ご連絡いただけると幸いです。

yhira/simplicity2

スポンサーリンク
アドセンス(大)
アドセンス(大)

フォローする

スポンサーリンク
アドセンス(大)

コメント

  1. じゃんぱっぷ より:

    お世話になります。
    CSSの拡張クラス(extention.css)にあるものは、非常に利便性の高い文字装飾ばかりだと思います。
    検索していて拡張クラスが用意されていることを知り、色合いなどをいくつか変更しました。
    WordPress管理画面のテーマの編集から親テーマの編集画面にもextention.cssが表示されると便利だなと思いました。
    後、私のような初心者も文字装飾は良く使いますので、Simplicityの機能説明のところにも最初から説明があると嬉しいです。(もちろん個別記事で拡張クラスの説明がされているのはわかります。)
    以上です

  2. アバター画像 わいひら より:

    検索していて拡張クラスが用意されていることを知り、色合いなどをいくつか変更しました。
    WordPress管理画面のテーマの編集から親テーマの編集画面にもextention.cssが表示されると便利だなと思いました。

    申し訳ないですが、構造上、そういった仕様になっています。
    デベロッパーツールでデザインを確認しながら、style.cssに上書きすれば、個人的に必要性は感じていないので、今後もこのままでいくと思います。
    ※Wordpress的にも、親テーマを直接カスタマイズするのは、推奨されている方法ではないので。
    子テーマ – WordPress Codex 日本語版

    後、私のような初心者も文字装飾は良く使いますので、Simplicityの機能説明のところにも最初から説明があると嬉しいです。

    「Simplicityの機能説明のところ」というのは具体的に言うとどこでしょうか?

    • じゃんぱっぷ より:

      お世話になります。
      トップページの「Simplicityの特徴」で最後の方の「カスタマイズがしやすい」の中に小見出しで「予め用意された拡張クラス」とかってあるといいかなって思いました。

  3. じゃんぱっぷ より:

    了解しました。
    もちろん使う際には、親テーマに表示されるextention.cssからコピーして子テーマのstyle.cssにコピペした上で利用させていただいています。
    初心者の方に便利なものが、初心者の方にはわかりにくい感じになってるなぁって思っただけです。
    ありがとうございました(≧∇≦)/

    • アバター画像 わいひら より:

      汎用的な拡張クラスの案内記事は、以前から書こう書こうとは思っているのですが、仕事と、ブログと、Simplicity更新と、フォーラムのレスをやっていたら、1日の時間が無くなってしまって、ヘルプ記事までにはなかなか手が回せないままここまで来ています;
      時間にある程度余裕ができたら、書こうとは思います。