ネットビジネスで自由に生きる!会社を辞めて海外にいながらブログで稼ぐJINのサイト

「デザイン」の記事一覧

Stinger8でヘッダー画像を記事でも表示させたい!投稿ページでも表示させるカスタマイズは瞬間で終わり!

人気のテーマ「Stinger8」。流行なのか、読者から見たユーザビリティを考えると当たり前のこと、となるかも知れませんが、記事を表示すると(つまり投稿ページで)ヘッダー画像が表示されないんですね。 ここは意見が分かれるところですが、ヘッダー画像はブログ、サイトの雰囲気づくりには一番のポイン […]

「Stigner8」のサイドバータイトルが表示されない?CSSで簡単表示とデザインカスタマイズしてみる!

ワードプレスの人気テーマ「Stinger8」。 でも、なぜかサイドバーの人気記事とか新着表示、カテゴリーなどの見出しというか、タイトルが表示されないんですね。 こんな時はテーマを直接編集する、というのもありますが、ここではCSSを使って、サイドバーの見出しを簡単に表示させてみます。ついでに […]

「Stinger8」のサイドバーから新着記事表示を削除する2つの方法

ワードプレスの人気のテーマの1つ「Stinger8」では、サイドバーに常に新着記事表示がされます。 これはもともとテーマに組み込まれたもので、他によく使う新着表示用のプラグインを使うと、新着記事表示が2重になったりするんですね。 ここではそんな状況を回避するために、Stinger8のサイド […]

Simplicityのカスタマイズ!iPadでもPC表示のようにサイドメニューを横に配置したい!

ワードプレスの人気テーマで、無料でシンプル、見やすくカスタマイズも簡単に沢山できる、となると「Simplicity」でしょう。 私もとても気に入っていていくつかのブログで使ってますが、それでもiPadの横向きで表示するとモバイル表示(縦1列の表示)になるんですね。 うーん、普通にPCで見え […]

ブログデザインのカスタマイズ!HTMLとCSSの使い方を簡単に理解する!

ブログのデザインをカスタマイズをする上で、避けて通れないのがHTMLとCSS. で、でた━━( ゚∀゚)人(゚∀゚ )━━!! 聞いたことあるけどイヤだーと思ったそこのあなた! いや何事もそうですが、1つ1つ見て行けば難しいことはありません。 挫折するとしたら難しいからではなく、簡単そうが […]

横並びのメニュー項目の高さを揃えたい!CSSで子要素にheight100%、親要素に高さを指定するのがコツ

ワードプレスなど、テーマのデザインカスタマイズでよく手を入れるのが、上段に表示されるグローバルメニューです。 背景色や文字色、枠や影付けなどは今ではCSSで簡単にできますが、メニュー項目の文字数の違いから、高さを揃えたりするのが結構難しかったりするんですね。 親のブロック要素の高さが可変で […]

cssで先頭のや最後の要素を指定するには?nth-childとnth-of-typeの使い分け

ブログやサイトのデザインカスタマイズをしていると「先頭や最後のこの要素だけに指定がしたいんじゃぁ~」という場合が多くあります。 力技、というか、まぁ普通にやろうとすれば、先頭の要素や最後の要素だけにクラスを指定して、そのクラスに対してCSSを定義する、なんてことをしますが、これが毎回クラス […]

CSSでリストから表を作る方法!2列、3列、4列のレイアウトはこうすれば良いけど罫線が問題

よく出くわすかもしれませんが、ul, li を使ったリストがあり、それをCSSを使って表にしたい!という場合があります。 tableプロパティを使えば簡単に表は出来ますが、横長の一行の表になってしまうんですね。 表を作る前提でリストのul, liをうまく組み分ければ2列3列の表も出来ますが […]

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」(サファリ) […]

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

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

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

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