はてなブックマーク

2018/09/16マークアップ言語 以前「横並びの画像をCSSで簡単にレスポンシブ表示する方法」という記事を書かせていただきましたが、何よりも「簡単に」という点を重視していた事もあって、本当にタイトル以上でも以下でも無いそのまんまの事しか出来ないのがずっと気になっていました。 そこで、今回はそれを発展させた拡張版と言いますか、表示するデバイスの画面サイズに合わせてカラム（列）数を変えたり、画像以外のちょっとしたコンテンツも並べられるよう改良を加えました。 単純に画像を横並びに表示したいだけで、PCでもスマホでも全く同じ見え方になればいいという事なら上記のエントリーを参考にしていただいても特に問題無いかと思いますが、当エントリーでは画像に限定せずコンテンツ枠を作成してその枠を制御する形になるので、その中には画像やテキストなどの要素を好きなように組み合わせて表示させる事が出来ます。 ただ、そ

2018/04/14WordPressテーマ リリース当初から何かと話題になっている無料WordPressテーマのCocoonですが、Simplicityと同様に機能はこれでもかってくらい盛り沢山なのに対して、見た目的にはちょっと寂しいと感じている人もいるのではないかと思います。 私とか（またそれか） そこで、せめて見出しだけでもカスタマイズしたいという事で、Cocoonの各見出し部分のclassセレクタをひと通り調べてみました。カスタマイズ例として簡単なサンプルも挙げていますが、あくまでもclassセレクタの紹介がメインなのでスタイル自体は自分で頑張って下さいね？という点はご了承を。 投稿・固定ページの見出しなどデベロッパーツールの使い方がよくわからない内は、簡単そうに見えて意外と苦労させられる事もあるのがこの記事内の見出しではないでしょうか。テーマと言うかテーマの作者さんによってcla

プラグインの新規追加画面からChild Theme Configuratorで検索してインストール＆有効化します。プラグイン本体に関する設定は無いので有効化した後は即利用可能です。 尚、プラグインのインストール及び有効化の手順についてよくわからないという方は、こちらのエントリーを参照していただけると幸いです。 子テーマを作成する前の注意点このChild Theme Configuratorは優れたプラグインですが、万能というわけではありません。ごく一般的な構造のテーマなら問題無く子テーマを作成出来ますが、中には特殊な構造というか複雑な作り方をしたテーマもあるかと思います。そのような場合に子テーマの作成がうまくいかない、または作成した子テーマが正しく機能しない可能性もあるという事を頭の片隅にでも置いといて下さいませ。 なので、ぶっつけ本番で絶賛運営中のサイトに適用するような事はせず、ある程度

2018/03/11WordPressテーマ ウィジェットに設定した内容をショートコードで投稿や固定ページに使いたいなぁ…と思う事ってありますよね。それはちょっとしたコンテンツだったりAdSenseのような広告だったりと使い方は人それぞれですが、標準でその機能を持ったテーマというのはありそうでなかなか無いのが実情です。そこで当エントリーではそのウィジェットを作ろう！という内容になります。 例によって素人が見よう見まねで作ってみましたレベルのモノですんで、ご利用は自己責任という事でお願いしたいですが、万が一失敗してWordPressが真っ白になってもドンマイですよ？ 当エントリーは私が過去に公開していたサイトのリライト記事になります。 WordPressの投稿・固定ページにショートコードで挿入出来るウィジェットを作ってみた カスタムショートコードの作成ぶっちゃけコレはSTINGER系テーマの

2018/01/252018/09/16マークアップ言語 画像を何枚か並べてちょっとしたギャラリー風にしてみたのはいいけれど、スマホから見たらレイアウトがあぁ…という経験は誰もが一度は通る道ではないでしょうか。そこで当エントリーでは画像を複数枚並べた時に巧くレスポンシブ表示出来るCSSのサンプルを紹介したいと思います。 当エントリーの内容に改良を加えたバージョンを以下のエントリーで公開しています。そちらでは画像だけでは無くテキストやその複合コンテンツもレスポンシブに並べて表示出来るようにしてみました。