WordPressテーマ変更!SimplicityからCocoonへ

カスタマイズ

カスタマイズ

CSSで番号なしulリストマークのカスタマイズ!※子要素がズレる・はみ出す原因text-indentは入れちゃダメ

番号なしulリスト前li:beforeマークの数字をCSSでスタイルをキレいに見やすく装飾するカスタマイズです。 リストの装飾にtext-indentを使ったカスタマイズを使っていたら子要素がズ...
カスタマイズ

番号なしulリストを記号・マーク・画像で装飾!CSS初心者が応用できるカスタマイズ説明あり

番号なしulリスト前の『・』をCSSでカスタマイズして変更する3つの方法と、目次のプラグインTable of Contents PlusのリストマークをCSSで消すセレクタなどを紹介します。 ...
カスタマイズ

箇条書きulとol!liタグを入れ子にする方法で、スッキリ見やすいブログへ♪

HTMLタグの番号付きリスト<ol>や番号なしリスト<ul>の項目<li>をどう書いたら良いのか、リストの中にリストを入れ子にする書き方や使い方タグの意味を説明しま...
HTMLとCSSの基本

CSS初心者へ❦スタイルの不具合ってどうやって直すの?その工程、見てみよぉ!

幅のせまいスマホから見ると、枠から画像や文字がはみ出す。対処ページを探しコードをコピペするため検索検索検索。検索と確認をくりかえし時間を費やすより、それぞれ状況が違うから、原因を突き止めてから検索する...
CSS

CSSが効かない原因!反映させるため、ブログ初心者さんが確認する7つのこと

反映していたCSSが突然、反映しなくなった原因はホントに沢山あります。編集後のコードの消し忘れや消しすぎなどが原因です。コメントアウトのミス、CSSの構文があっているかなどを書いていきます。このほか基...
CSS

WordPress投稿のテキスト画面が、超見やすいCSSカスタマイズ!スマホ・タブレットでミスタップを防ぐコード

WordPressのエディタで記事を書いて、装飾したいときテキスト画面を開くと見にくい!またスマホやタブレットで書いてると、文字が小さく行間がないから、別の場所をミスタップ! 5分の作業でWor...
2018.01.30
Simplicityのカスタマイズ

Simplicity2のカスタマイズ!スマホメニューをヘッダー画像上に移動し装飾❦可愛いデザインをCSSでコピペ

Simplicity2でスマホメニューがヘッダー画像に被らないよう、画像上に領域を作って、メニューを置くカスタマイズをしました。シンプルなデザインと、レース画像を導入して作ったデザイン。後者は、可愛い...
Simplicityのカスタマイズ

Simplicity2カスタマイズ!ヘッダー画像を完全レスポンシブ対応【CSSコピペ】ヘッダー設定3つを画像で比較

Simplicity2のテーマのカスタマイズからできるヘッダー画像設定3つ、現在のヘッダー・ロゴ画像・背景全面の表示の比較をしてみました。 ヘッダー画像の設定でスマホ・タブレット。パソコンの...
2016.12.30
カスタマイズ

内部リンクを見分けるマークを付けたい!記号・アイコンフォント・画像を表示するカスタマイズ、CSSのコード

ブログ内コンテンツに内部リンクと外部リンクを置きますよね。リンクに付けるアンカーテキストではどっちのリンクか解りにくく、見分けが欲しいので、CSSでカスタマイズしてみました。 自分のページへの内...
2016.10.28
カスタマイズ

WordPress・CMSでFont Awesomeアイコンフォントを導入!最新アイコンが表示しないとき、バージョンアップ方法付き

テーマにアイコンフォントFont Awesomeを導入してないとき、簡単に導入できる方法として、リンクタグを入れる方法をWordPressを例に紹介します。 これでリンクaタグ・見出しhタグの前...
2018.01.09
カスタマイズ

WordPressでコンテンツのみの親要素を作る!カスタマイズした装飾を本文以外、反映させない方法

WordPressで自分が書いた文章だけをカスタマイズしたい。本文以外は、装飾を反映させたくない場合があります。例えばリンクaタグ・リストなどの装飾。 コンテンツ以外にたくさん使われ、サイドやナ...
HTMLとCSSの基本

親要素の指定方法!ブログ初心者にCSSのセレクタ簡単な付け方を説明

ブログを見ていると、親要素という単語を見かけます。カスタマイズ初心者は、親要素を見つけるのが得意ではないので、超簡単にそれを見るける方法を書いていきますね。 ここでは、文章を書いてる部分コンテン...
HTMLとCSSの基本

ブログで邪魔な広告・画像のHTMLタグを見つけ、ワンクリ削除する方法

トップ・サイドバーにあるアドセンス(広告)。ブログ画面のスクリーンショットを撮るときは消したい!またブログを読んでいるとき、チラチラ大きく動く画像を削除したい! 超簡単に消す方法です^^ ...
2017.01.05
カスタマイズ

ol番号付きリストのカスタマイズ!デザインをきれいに変更する方法。リストの数字を任意の番号3から始めたい時のCSS

olのリストマークのデザインをきれいにカスタマイズする方法3コ、リストの続き番号を途中(任意)の番号から始めたい場合CSS、おまけでリストを横並びにするHTMLを紹介します。 ※今まで番号リストの続...
2017.03.05
CSS

レスポンシブ対応!メディアクエリの書き方と書く場所。あなたのテーマはスマホファースト、PCファースト!?

レスポンシブ対応のテーマを使っていても、スマホで確認したら画像や表が画面からはみ出てたり、CSSで装飾したものがPCビューと違って幅の狭いスマホでは表示がおかしい部分がでてきます。そこでメディ...
HTMLとCSSの基本

HTMLの要素!属性、属性値とは!?class名を複数設定するHTMLの書き方付

HTMLやCSSの初心者からすれば、属性と属性値という単語が、HTMLやCSSの説明で突然この言葉が出てきて話が進むと、これは何をさしてるのか意味がわからない状態のまま、読み進めますよね。 属性...
HTMLとCSSの基本

HTMLのdivとspanの違いは、ブロックレベルとインライン要素★入れ子にしたカスタマイズ例:初心者向け

初めてカスタマイズするとき、divとspanの違いって何だろうって初心者は思ってしまうものです。これはブロックレベル要素とインライン要素の違いを知ることで、解決できます。 HTMLタグを知り始め...
2017.09.11
HTMLとCSSの基本

隣接セレクタ!セレクタの指定方法と色んな使用例。初心者向けページ

隣接セレクタは、同じ親要素内にある要素Aの直後の要素のスタイルだけを変えたい場合、便利です。CSSでブログの細かい部分を指定して反映させたいときに使います。 基本であるclass・id・子孫セレ...
HTMLとCSSの基本

CSSの基本、子セレクタの説明!初心者向け、子孫セレクタとの違い付き

子セレクタの使い方と、子孫セレクタの違い。また2つを複合して使う場合も結構あるので、それぞれ使用例をあげてます。 HTMLタグの要素や、親要素や子要素の関係と基本的なclass、id、タイプ、全...
HTMLとCSSの基本

CSSセレクタ指定方法!HTMLタグのid・classなど優先順位を説明

初心者のカスタマイズでCSSが反映しない、書いた内容が効かない、でもキャッシュが原因ではない。なんで反映しないのか!?それはHTMLのタグの指定方法、セレクタの選び方が理解できてないのが原因、またはC...
2017.01.02
トップへ戻る