「デザイン」の記事一覧

CSSでリストから表を作る方法!flexプロパティを使えば2列、3列、4列のレイアウトは簡単過ぎる!

ブログでデザインカスタマイズでは、ul, li を使ったリストに対してCSSを使って2列、3列などの表形式で表示したい!という場合がよくあります。 tableプロパティを使えば簡単に表は出来ますが、floatを使って2列、3列といったレイアウトなどにした場合に隣同士の高さが揃わず、罫線を引くとちぐはぐは表になってしまって結 ...

ブログのヘッダー画像の大きさは?主要テーマを比較から縦250pxが良い!?

ブログの見た目における一番のポイントは、なんといってもヘッダー画像。ヘッダー画像とは、ブログの一番上にドーンと表示される画像です。 いよいよブログデザインの章に入りますが、まずはその一番のポイントであるヘッダー画像の大きさから見てみましょう。 横幅は使用するテーマの幅によってきますが、縦幅をどうするか ...

ブログの見出しデザインを制覇せよ!CSS貼り付けだけの簡単素材で記事を彩る

ブログデザインの中でも大きな要素を占めるものの1つが「見出し」。 トップページや個々の記事、またサイドバーなど、ブログのいたるところで使われるものですね。 見出しはテーマごとにいろいろとデザインがされていて、テーマの特徴がとてもよく出るものですが、そうであるからこそ逆に人気のテーマでは「あ、これはあの ...

画面の拡大縮小操作ができない!Stinger Plusのカスタマイズ例でviewport設定を解説

ワードプレスのテーマにもいろいろありますが、パソコンで見ている分には問題なくても「スマホやタブレット」など画面が小さいモバイル端末で表示している時に「拡大して見たい!」という時があります。 もっと大きな文字で読みたい、画像が小さいので拡大して見たい、などがそうですが、そんな時、ピンチイン・ピンチアウ ...

ブラウザのおすすめはGoogle Chrome!デザインカスタマイズやアフィリエイトで力を発揮する最速ブラウザ

インターネットでいろいろと検索する時に使うブラウザ。あなたはいつも何を使ってますか? パソコンにしてもスマホにしても、必ず最初から入っているブラウザですが、 Windowsでは「e」マークの「IE」(インターネット・エクスプローラー) Macではコンパスマークの「Safari」(サファリ) スマホで言えばAndroidでは「ブラウ ...

ワードプレスで記事投稿前でもプレビュー表示を共有して見る方法!プラグイン「外部確認」が超便利

ワードプレスで記事を書いていると、実際に投稿する前の下書きを誰か他の人に確認して欲しい、という場合があったりします。 そんな場合には、意を決して実際に投稿して記事のURLを確認して欲しい第三者に送るか、プレビュー画面をキャプチャーしてその画像を送って見てもらう、なんてことをしたりします。(この記事を見て ...

【WordPressプラグイン】新着表示は「Newpost Catch」がオススメ!サムネイル表示で差をつける!

人気記事表示に並んで、ブログの基本となるのが新着記事の表示。 いきなり前置きが長くなって恐縮ですが... いやこの「新着記事」の表示っていらない、というか余計じゃない?だって、訪れた読者が常にこのブログ見ていて新着記事を心待ちにしてるわけないし、新着記事!って表示しても人気記事みたいに面白いないかどう ...

ブログのデザインカスタマイズ!Google Chromeの開発者ツールでCSSを思いのままに操る!

デザインカスタマイズでは多少なりとも必要となるHTMLとCSS。 ゼロから全て学ぼうとすると、時間もかかりかなり大変なことですが、深く広く全て知る必要はなく、ポイントをおさえて必要な所のみを学んでいく、という姿勢で十分です。 (この記事を読めばコピペを基本に覚えれば良い!といった感覚になるはずです(笑)) ま ...

クラスの指定法 – WordPressでCSSを特定の記事だけ、ページだけに反映したい場合

CSSを利用してWordPressでデザインカスタマイズをする場合では、とても便利なプラグイン「JetPack」の「CSS編集」といった機能や「Simple Custom CSS」といったプラグインを使用して、CSSを新たに追加します。 ここで「ある特定の記事だけ」、「ある特定のページだけ」にCSSを設定したい、という場合がありますが、私の場合 ...

WordPressのCSSカスタマイズ!読み込み用プラグインとCSS反映の具体例!

別記事で見たGoogle Chromeとその開発者ツールの威力。それを武器にCSSがカスタマイズできれば、一気にデザインカスタマイズの可能性が広がります。 実際に修正したり他から持ってきたCSSをブログに反映するには、 1)使用しているテーマのスタイルシートに直に書き込む 2)プラグインを利用したスタイルシートに書き込む ...

ワードプレスでテーマのカスタマイズができない!何度も読み込み直しになる原因はこれ!

ワードプレスのテーマを「カスタマイズ」しようとすると、何度も読み込み直しの無限ループになり、「カスタマイズできないじゃん!うわー!」と焦る場合があります。 というか、私も実は先ほどなりました(笑) とにかくワードプレスで何か問題が起こった!という場合、往々にしてその原因はプラグインによるものが多い、と ...

「table of contents plus」の先頭の数字を非表示にしたい!特定の記事やページだけに適用するワザ

記事に自動的に目次をつけるプラグインとしては「table of contents plus」がとても便利です。 訪れた読者から見ると、目次をつけることで 記事全体の把握がすぐできる 求める情報がどこにあるかが分かりやすい 目次をクリックすると、すぐその場所に飛べる といったことが自動で実現できるんですね。 関連【WordPressプラ ...

リストの先頭にフォントでマーク表示!画像を付けるのはもう古い!

通常 ul li などのリストを使うと自動的に先頭に丸や四角のマークが付きます。 個性を出すためにその先頭のマークを画像などに置き換える、といったカスタマイズをすることもありますが、これが結構大変だったりするんですね。 画像の難点は、調度良い形と大きさのものを探してネット上をさ迷い歩くといった放浪の旅に出て ...

【WordPressプラグイン】目次の作り方 – 自動で作成、デザインカスタマイズも楽々!

あなたのブログの記事には目次がありますか? トレンドブアフィリエイトを実践しているブログではそれほど多くないようですが、私は目次があるのが好きで、トレンドアフィリエイトに本格的に取り組んだ直後から導入しています。 目次があると記事に何が書いてあるのかがひと目で分かり、訪れる読者にも分かりやすい、書いて ...

ブログのデザインカスタマイズの決め手!CSSの適用範囲を確認する技

デザインを簡単に修正できるよう、多くのサイトでCSSの具体的記述例が公開されています。 (見出しのデザインならは ブログの見出しデザインを制覇せよ!CSS貼り付けだけの簡単素材で記事を彩るの記事を参照してみてくださいね!) CSSをサクッとコピーしてブログに貼り付ければすぐ利用ができる、といった手軽さでとっても ...