BLOG

ブログ

2019.05.7.

HTML/CSSの私的チートシート

WordPressの私的チートシートに引き続き、今回はHTML/CSSのチートシートです。 基本的には個人的に最低限必要なものを記述したHTMLとCSSのテンプレートを用意しておいて、新規コーディング時にはそれを使い回しています。そして、気づいた点や追記したいものがあった時は忘れないようにすぐにアップデートするようにしています。 HTML 基本 宣言などの絶 …

2019.05.6.

WordPressの私的チートシート

WordPressでテーマを作成するときによく使うテンプレートタグやソースをまとめてみました。基本的なものからニッチなものまで、思いついたものは随時追記していきます。 うまくまとまった記事になれば、これを使うことでWordPressのテーマ制作がかなり捗るようになるはずです。何回も同じ事を調べなくても良くなるので、個人的にはそれだけでもかなりの時短になるかと …

2019.05.5.

WordPressで特定カテゴリーの新着記事を表示させる方法

今回はWordPressで特定のカテゴリーの新着記事を表示させる方法を紹介します。 例えば、「Aカテゴリーの記事は更新時に新着記事としてお知らせに掲載したいけど、Bカテゴリーの記事は更新してもお知らせには表示させたくない」という場合に使える方法です。 この方法を使えば、各カテゴリーの新着記事をまとめた固定ページを作ることも可能です。 特定カテゴリーの新着記事 …

2019.05.4.

<li></li>を縦並びのまま中央寄せにする方法

<li>を横並びにして中央寄せにする方法は良く紹介されていますが、縦並びのまま中央寄せにする方法となるとどうでしょう。 使う場面は中々少ないかも知れませんが、覚えておいて損は無い方法かと思います。普段メモ代わりにしているドキュメントに残っていたのですが、僕自身どんな場面で調べたのか全く覚えていません。ただ久しぶりに見返してみると意外と「なるほど」 …

2019.05.3.

hoverしたときのSVGの色をCSSだけで変える方法

ちょっとしたアイコンなんかであれば画像よりも使い勝手の良いSVG。フリーでつかえるファイルも今や色々公開されていて、僕もサイト制作時にはよく使います。 一点だけ難点があるとすれば、hover時の色の変更でしょうか。javascriptをつかった方法や、HTMLに直接SVGコードを記述する方法等、色々な方法がありますがどれも一筋縄ではいかない感じです。 そんな …

2019.05.2.

Twitterからのリンクを考慮した結果、WordPressのAMP化を止めてみた

このブログを立ち上げたときから、WordPressのAMPというプラグインを入れて個別記事をAMP化していました。で、先日。Twitterアカウントを開設してそちらからも流入を増やしていこうと思って、早速公開した記事をTwitterに投稿してみたのですが、Twitterからのリンクで表示されるページが有無を言わさずAMP化されていました。 僕としては、Goo …

2019.05.1.

どのくらいページを読み進んだかがわかるトップへ戻るボタン

CODEPENを漁っていたら面白いものを見つけました。動作的にはページのトップへスクロールしながら戻るボタンなのですが、そのページをどのくらい読み進めたかがわかるようになっています。サイトやページにちょっとしたアクセントを付けたいときに良いのではないでしょうか。あくまでトップへ戻るボタンなので、デザインの邪魔にもなりにくいと思います。 サンプル 上の説明を読 …

2019.04.30.

WordPressでプラグインをつかわずにSNSボタンを設置する方法

今回はWordPressにSNSのシェアボタンを設置する方法を紹介します。プラグインは使いません。 プラグインを使えば様々なSNSに対応することも簡単に出来ますが、現実的にはtwitter、facebook、はてブ、pocketくらいで充分かと思います。海外向けに記事を書いている場合は他のSNSを設置する必要があるのかも知れませんが。僕みたいに日本の方に読ん …