CSS

ワードプレス

【スタイル】コクーンのヨメレバ・カエレバ・トマレバ・タベレバの画像を大きくする

WordPress(ワードプレス)のテーマ「Cocoon(コクーン)」を使用すると、ヨメレバ・カエレバ・トマレバ・タベレバというブログパーツのスタイルが、すでに定義されています。 表示される画像が小さくて目立たないので、大きめの画像が表示されるようにスタイル定義(CSS)を作ってみました。 ...
ワードプレス

【ワードプレス5.3】コクーンのブロックエディターでギャラリーの表示がずれるので

つい先日(2019.11.13)、WordPress(ワードプレス)のバージョンが 5.3 になりました。いろいろと使いやすくなるように、WordPress の仕様変更があったようです。 その仕様変更は、WordPress のテーマ「Cocoon(コクーン)」にも大きな影響を与えまし...
2019.12.05
ワードプレス

【ワードプレス】コクーンのカレンダーの見た目をシンプルに変えてみました

むかし表を作ったりすると、かならず数字と数字の間に罫線(けいせん)を入れていました。近年はそれが見直され、罫線の代わりにすき間を入れて、スッキリさせるのが主流のようです。 最近 WordPress(ワードプレス)のテーマを、Simplicity から Cocoon に変更しました。す...
2019.11.06
スポンサーリンク
その他 インターネット

【シンタックスハイライト】プリズムに加えたツールバーのデザインを調整しました

ホームページなどで、ソースコードを見栄え良く表示するのに便利なのが、シンタックスハイライターです。最近、Prism.js(プリズム ジェイエス)を手動で WordPress(ワードプレス)に導入してみました。 Prism.js にプラグインとして「Show Language」と「...
ワードプレス

【ワードプレス】コクーンのSNSボタンがずれていたので、整列させました

ボクは WordPress(ワードプレス)にテーマ「Cocoon(コクーン)」を導入しています。 SNSボタンの配置がずれていて気になったので、直してみました。なお SNSボタンの機能としては、何も問題がありません。 本文下のSNSボタン 「シェアする」ボタンと「フォローする」ボ...
2019.10.24
ワードプレス

【ワードプレス】コクーンのSNSボタンを「ブランドカラー(白抜き)」でも見やすく

ボクは、WorpPress(ワードプレス)のテーマとして「Cocoon(コクーン)」を利用しています。 派手な色使いは好みではないので、Cocoon 設定から SNSのシェアボタンとフォローボタンのボタンカラーを「ブランドカラー(白抜き)」に設定しています。 ところが、ボタンの...
2019.12.03
ワードプレス

【ワードプレス】コクーンに設置した、カスタム検索のデザインを調整しました

ボクのブログでは、Google AdSense(グーグル・アドセンス)の広告の設置しています。 今回は、WordPress(ワードプレス)のテーマ「Cocoon(コクーン)」で、 Googleカスタム検索(検索向け広告)を設置してみました。 ところが Googleカスタム検...
2019.10.28
その他 インターネット

【スタイル】ヨメレバ・カエレバ・トマレバ・タベレバを左揃えに その2 (巨大画像+地味ボタン版)

ひとの好みは、十人十色ひとそれぞれです。 ということで、ヨメレバ・カエレバ・トマレバ・タベレバの画像をさらに大きくした CSS を作ってみました。 今回の主な変更点 モバイル表示では、画像の大きさは前回とほとんど変えてありません。 なお今回は、ボタンの文字色と背...
2019.11.28
ホームページ

【Webフォント】フォントオーサム5フリー版の使い方 その2 (HTMLとCSSの記述篇)

便利なWebフォントとして、世界中の人が利用している Font Awesome もバージョン5になって、しばらく経ちましたので、使い方も落ち着いてきたようです。 ということで、ボクが試行錯誤してきた使い方を簡単に書いておきます。 前回、Font Awesome 5 Free版を...
2018.12.05
ホームページ

【Webフォント】フォントオーサム5フリー版の使い方 その1 (配置と関連付け篇)

便利なWebフォントとして、世界中の人が利用している Font Awesome もバージョン5になって、しばらく経ちました。 バージョン4 に比べて使いづらいところもありますが、デザインを見比べてみると、かなり描き直しているらしく、結構格好良くなっているようです。 そんな Fo...
2019.03.02
ホームページ

【CSS】パンくずリストで擬似クラス「:last-child」はもう使わない!

パンくずリスト(サイト内アドレス表示)で、項目を横に並べるとき、右端の項目には記号(">")が要りません。 そのため、右端の項目だけ記号(">")を消しますよね。 パンくずリスト 今回は、隣接セレクタ「+」を使って、それを実現する方法を紹介します。 擬似クラス「...
2018.11.08
ホームページ

【CSS】グリッドレイアウトで擬似クラス「:nth-child」はもう使わない!

グリッドレイアウト(格子状配置)で、画像を外枠いっぱいに並べるとき、右端の画像に右マージンがあると、外枠の中にピッタリと収まらず、左側に配置されてしまいます。 それを避けるため、右端の画像だけ右マージンの値を 0(ゼロ)にして、外枠の中にピッタリと収めたりしますよね。 グリッドレイアウ...
2018.07.13
ホームページ

【ホームページ】HTMLとCSSはこの本で勉強しました その3 (オブジェクト指向CSS篇)

現在、事務所のホームページは、自分で作っています。 いろいろな本を参考にして、すこしずつ改良を加えています。 オブジェクト指向CSSとの出会い 前回、紹介した本のお蔭で、事務所のホームページの体裁をさらに整えられました。 さらに、デスクトップファーストではありますが、...
2019.03.20
ホームページ

【ホームページ】HTMLとCSSはこの本で勉強しました その2 (Webデザイン篇)

現在、事務所のホームページは、自分で作っています。 いろいろな本を参考にして、すこしずつ改良を加えています。 Webデザインの向上 前回、紹介した本のお蔭で、ホームページの体裁を整えられました。 ただその後、フラットなデザインにこだわり過ぎたので、無骨でとっつきにくい...
2019.03.20
ホームページ

【ホームページ】HTMLとCSSはこの本で勉強しました その1 (はじめて篇)

現在、事務所のホームページは、自分で作っています。 いろいろな本を参考にして、すこしずつ改良を加えています。 今は昔 ボクが、本格的にホームページを作ることになったのは、行政書士になってからです。 先輩の行政書士に「作ったほうがいいよ」と言われて、作ることにしたのです。 ボ...
2019.03.12
スポンサーリンク
タイトルとURLをコピーしました