制作・ハック【CSS】疑似要素:first-childが効かない時→実はfirst（1番目）じゃないパターン【備忘録】
CSSを使っていると「:first-child」や「:nth-child(1)」がうまく効かない時があります。 これが実は1番目を指定できていないパターンでした。 CSS関連の記事はこちら :first-childが効かない時 CSSでデザ...
css
制作・ハック
制作・ハック【WordPress初心者】ブログ記事内のブロックにクラス名(class)を追加する方法【CSS】
WordPressでCSSを追加してページ内に反映させるには、該当要素にクラス名を追加する必要があります。 CSSを追加したものの、クラス名のつけ方がわからない…という方は是非参考にしてくださいね。 段落ブロックにクラス名(class)を追...
制作・ハック【CSS】テキストリンクのクリックできる領域を増やす方法【WordPress】
普通のテキストリンクだとテキストの範囲しかクリックできませんが、 テキストの周囲もクリックできる領域にしてしまう方法があります！ 広い範囲をクリックできるようになるので、クリック率もアップするかも👍 CSS関連記事はこちら テキストリンクの...
制作・ハック【WordPress】Rinkerリンク切れの画像サムネイルが消える→画像準備中を表示させて対処【CSS】
商品リンク作成の「Rinker」プラグインで、リンク切れが起きてサムネイル画像が非表示になってしまう時に「画像準備中」などを表示させて対処した記録です。 Rinkerのリンク切れで画像が消えてしまったリンク切れの更新がすぐできない という時...
制作・ハック【ブログ】テキストリンクを貼ると自動でバナーが出てくるCSSの書き方【WordPress/Cocoon】
WordPressなどブログ上で、テキストリンクにクラス名を追加するだけでバナーが表示されるCSSを作りました！ このCSSを追加すればエディター上ではテキストリンクを作るだけ！ 簡単にバナー付きリンクを表示させることができます。 テキスト...
制作・ハックiPhoneのSafariだけ正常に表示されない→コンテンツブロッカーが原因かも【HTML/CSS】
WEB制作の実機検証をしていたらiPhoneのSafariでだけ表示が崩れてしまって困りました。 原因はなんとiPhoneでコンテンツブロッカーを設定していたことでした。 iPhoneのSafariだけ表示がおかしい！ 仕事でWEBページの...
制作・ハック【Cocoon】投稿した画像を加工せずに円形や長方形にトリミングするCSSの方法【WordPress】
WordPressのブログ記事に画像をアップしたものの、周りに写っているものをトリミングしたいな〜でも加工して再アップしたくないなという時ありませんか？ すでに投稿した画像をトリミングしたい長方形の画像を円形にトリミングしてメリハリをつけた...
制作・ハック【WordPress】ブログ記事の好きな位置に矢印を入れる方法【CSS】
ブログ記事で流れや手順の説明をしている内容の時に「↓矢印」が好きな位置に配置できたら便利じゃないですか？ Wordpressの投稿記事内の好きな位置に矢印を入れることができる方法をまとめてみました。 ブログ記事の好きな位置に矢印を入れる方法...
制作・ハックコンテンツブロッカー対策をした記録。（ASPタグ改変なし）
iPhone等でブラウザにコンテンツブロッカーを使っているとブログ記事の一部のアフィリエイトリンクが表示されなくなってしまいます。 それだとブログ記事の内容が正常に伝わらず見栄えも悪くなってしまうので、アフィリエイトタグを改変せずにできる限...
制作・ハックブログ記事内のテキストリンクをボタンにするCSS
ブログ記事にリンクをつけることはよくありますが、テキストリンクだけでは寂しい時やもっと目立たせたい時はありますよね。 CSSを追加してテキストリンクからボタンのデザインに変更できるようにしてみました。Class名を付け替えるだけでデザインを...