ブログ運営

【WordPress】当ブログのカスタマイズ内容まとめ【2021/08/07時点】

当ブログで施しているカスタマイズをまとめました。セキュリティ対策に関わる部分は公開できませんが、そこそこ洗いざらい話したつもりです。わたしが思い出すため備忘録ですが、あなたの参考になったとしたら、それはインターネットらしくて興奮しますね

もろパクリされてもいいのかと言われると……よくはないですけど、サイト上に表示される程度のものは、いつか真似されるのがウェブビジネスなのも確かでして。リスペクトがある真似をしてもらえれば、それでいいんじゃないでしょうか。

勝負するところは、真似できない範囲であるべきですから。

WordPressテーマ:GenesisFramework 当ブログのカスタマイズ内容まとめ

日本ではニッチなテーマです。海外では有名ですね。親テーマは1つ、子テーマがたくさんある変わったテーマ。

海外製なので日本語のQ&A記事が少ないです。あらゆる部分が英語向けになっているので(続きを読むが「Read more…」だったり)、初期導入コストは滅法たかめ。2年つかってきて、ようやく慣れてきたところです。

一方、SEOとセキュリティに強いのがメリットですね。

4年もブログやってると、デザインやSEOよりもセキュリティのほうが大切になってきます。わたしが持っているものの中で、一番愛着があるのがこのブログです。

使っている子テーマは「MagazinePro」です。あと4つくらい子テーマ買いましたが、これが一番使い易かったかな〜。

WordPressの細かいところ 当ブログのカスタマイズ内容まとめ

フォント

ベースは游ゴシックです。ちょっと前まではメイリオでした。太字にしたときハイライトが強くでてくれるので、游ゴシックに変更してみました。

フォント色は「#222」のグレー。文字の輪郭がハッキリしている方が好みだけど、ハイライトがつよすぎると目がチカチカするので、すこしだけグレーにしています。

よっぽど目がこえてないと#000との違いは分かんないと思う。好みの問題でもある。

記事下のカテゴリーページへの誘導

これです
これです

MagazineProは、記事下にウィジェットを置けるので、HTMLパーツとして配置しています。After Entryはもうごちゃごちゃです。きったねぇ。

カテゴリー誘導って名前、下品ですね……
カテゴリー誘導って名前、下品ですね……

このウィジェットは、このカテゴリーのときに表示する、という条件分岐はプラグインで実装しています。「Widget Options」というプラグインです。有名どころですね。

こいつが使いやすい。多機能だから、けっこう重たいとは思います
こいつが使いやすい。多機能だから、けっこう重たいとは思います

ほんとうは、ウィジェットではなく記事本文に書きたかったのです。SEO的には本文にある内部リンクの方が高く評価するためです。しかしWordPressはセキュリティの観点から、本文中のスクリプトをほとんど無効化してしまいます。php,javascript,iframeいろいろやる方法はあるんですが、セキュリティの方が大事。

2段の見出し

見出しだと順番が入れ替わるのが特徴
見出しだと順番が入れ替わるのが特徴

この記事でも使ってます。2段の見出し。SEO対策です。

目次に乗っかったときの見た目を整えるために、上段と下段を入れ替えています。Flexboxのorderです。Flexboxはほんとうに便利。Gridは使ったことがない……(技術についていけてない)

目次を出さない方がいいまである

ブログカード

つい最近導入しました。それまではテキストリンクだけの超シンプル仕様です。正直にいえばそれで問題はない。

ブログカードとテキストリンクのクリック率の差も気になりますが、ネット上の記事だと、あんまり参考になるものがありませんでして。結局は趣味かな〜なんて思います。

当ブログでは、ブロガー向けの記事も多々あります。ガク”マーケティング”ですからね一応。それならブログカードがあった方が馴染みがいいかなと思って導入。

なお、ちょっと変わった仕様になっています。GenesisFrameworkではブログカードをサポートしていません。外部から持ってくる必要があります。(海外産テーマではブログカードをサポートしていない印象があります。海外ではブログカード人気ないのかな?)

HTMLで直書きです。とはいえ、それでは面倒すぎるので、ブックマークレットで短縮しています。参考にしたのはこちらの記事。非常にシンプルで分かりやすく美しいソリューションです。大好き。

ブログカードのブックマークレットを作成しました

SSL化後の悩ましい作業のひとつ ブログカード

これまで Embedly を使ってきましたが、仕様がかなり独特なんですよね (´・ω・`)
画像や記事概要など、必ずしもOGPに従っているわけではないもので。かといって はてなブログカード はSSLに対応できてないですし。
* 2018年現在ではSSL対応しています。…

ブログカードを全体リンクにする【CSSのみ】

下書きのまま放置していました。すみません ^^;
弊ブログ提供の ブログカード、デフォルトでは各タイトルや画像がリンクになっていますが、これを全体リンクに変更する方法です。…

自サイト向けのブックマークレットも、target=“_blank”で別タブを展開する設計になっています。当サイトは、サイト内で動くときはページ遷移にするルールなので、そこだけ改造してます。

そういえば、WordPressのoEmbedは無効にしてます。URLを本文中にはりつけると自動でブログカードを出してくれるアレ。おーえんぶど。動作が安定しないのと、デザインが嫌いです。「Disable Embeds」というプラグインで無効にしています。

効率化ツール:Alfred 当ブログのカスタマイズ内容まとめ

有料版(Powerpack)をつかっています。クリップボードの履歴、スニペットがAlfredの本領です。

ウェブ検索機能

Alfredのウェブ検索機能で、当ブログを検査するURLを用意しています。関連記事を探すときに、かなり重宝する。

スニペット機能

記事のテンプレートや、2段になる見出しのHTML、吹き出しなんかを、すぐに出力できるようにしています。これがないと、いちいち控えをコピペしに行くので大変。

Alfredのオススメ アーカイブ – ガクマーケティング

Alfredのオススメ機能や設定をご紹介!多機能すぎてとっつきにくいAlfredを、いっしょに紐解いていきましょう。無料版はもちろん、有料版ならではのオススメの使い方ご紹介いたします。「私がMACユーザーにオススメしたいアプリ」第1位!無料版でも十分効率化できる最強のツールを使い倒して、想像以上の時間を生み出しましょう。

とくに役立っているのは2段見出しと、吹き出し。スニペットがなかったら、こんなに面倒なもん使っていられません!

効率化ツール:Yoink3 当ブログのカスタマイズ内容まとめ

仮想デスクトップを多用するので、これがないと作業できません。とくにUlyssesは全画面で作業することがほとんどなので、とても便利。

画像の挿入など、ブログではドラッグ&ドロップをすることが多いのだ。

効率化ツール:Automator 当ブログのカスタマイズ内容まとめ

  • スクリーンショットの格納位置を変更する
  • 任意のサイズにリサイズする
  • 任意のサイズにリサイズしてウォーターマーク(黒)を入れる
  • 任意のサイズにリサイズしてウォーターマーク(白)を入れる
  • HEICをJPGに変換する

これらすべてAutomatorで自動化しています。右クリック1つで動作するし、バックグラウンドで処理してくれるので気に入っています。Mac公式アプリで実装する価値はここにあり。

リサイズがあんまり綺麗じゃないのが欠点。ひとによっては許容できないくらいかもしれない。なぜ俺が許容するかは聞かないでくれ。

【歴4年】ブロガーにオススメのAutomatorレシピ集 – ガクマーケティング

MacについているAutomatorは、ブログで大活躍する優れもの。とくに画像処理で、他のソフトではできない多才っぷりを発揮します。リサイズから、ウォーターマーク、拡張子の変更までお手の物です。すべて無料できる内容ですので、ぜひ活用してみてください。

さっとメモをとったり簡単なコーディングをするときは、CotEditorを使ってます。タブ表示できたり、アプリ閉じちゃっても記述が消えなかったりして使いやすい。ミニマムだけど気がきく子。

Macのメモ帳は、ブログのネタ帳に使っています。iPhoneのウィジェットから直でアクセスできるので楽ですぞ。

壁紙はファイアパンチ
壁紙はファイアパンチ

テキストエディタ:Ulysses 当ブログのカスタマイズ内容まとめ

Ulysses

有料たかい。でも戻れない。なかったらこんなに書けない。散々紹介しているので、ここでは詳しく書かないでおく。

やっぱりブログはUlysses。20種類以上のテキストエディタを使ってきた男のオススメ – ガクマーケティング

Ulyssesはブログにぴったりのテキストエディタです。マークダウン+アウトライン機能+iCloud同期は、あなたの執筆活動を強力にサポートします。サブスク化してから、使ったことがない人は、ぜひもう一度使ってみてください!

Ulysses大解剖!メリット13個・デメリット6、レビューを紹介 – ガクマーケティング

こんにちは。ガクマーケの井上 です。 今回は、Ulssesを使おうか迷っている方に向けて送る記事です。 Mac・iOSのテキストエディタなら、Ulyssesがオススメです。私はiPadで使用していますが、とってもいい感じ […]

先日のアップデートで、ブロガー向けに強化されました。サブスクリプションでたかい反面、こうした定期的な機能改善があるのは強みですね。

アップデート内容をみたときはかなり興奮しました。最近仲良くさせていただいている「ブログ:いつもていねいに」管理人の小田やかたさん(@ottaka18)へ「すごいアップデートが来てますよ!」と連絡したところ、お忙しいのに記事にしていただけました。

かなり分かりやすく解説されているので、ぜひ読んでみてください。そして、使ってみてください。≫「Ulysses」がアップデートしてブロガーのためのエディタアプリになった|いつもていねいに

今回、注目のアップデートは次の3つです。

・投稿したシートに紙飛行機のアイコンが表示
・ブログの投稿状況をダッシュボードで表示
・アップロードしたブログのステータスが同期

これで、ブログエディタとしてのUlyssesには死角がなくなったのではないかと思います。

引用:「Ulysses」がアップデートしてブロガーのためのエディタアプリになった|いつもていねいに

画像編集ツール:Affinity Designer 当ブログのカスタマイズ内容まとめ

サムネイルとか、ちょっと複雑な画像とかはAffinity Designerくんを使っています。これで必要十分です。さすがにアドビCCは高すぎる。

Illustratorは本業でマーケターをやっていたときにお世話になっていました。2年間くらい使ったのかな。なのでそこそこ使っているんですよ。それでもAffinityで「この機能ないなぁ」とかはあんまり感じたことがありません。強いて言えばモザイク機能がない。

困ることがあるとすれば、.aiで保存できないところ。友人がIllustratorを使っているので、嫌な顔をされています。.pdfにレイヤー情報いれて保存しています。許せ。

画像編集ツール:Skitch 当ブログのカスタマイズ内容まとめ

複数タブ表示に対応してくれたらいいなぁ
複数タブ表示に対応してくれたらいいなぁ

スクリーンショットを編集したり、モザイクをいれるときはこれ。さっと使えて便利。Macデフォルト搭載の「マークアップ」にモザイク機能がついかされたら、使わなくなる未来が見える悲しい子。

パソコン:MacBookAir M1チップ 当ブログのカスタマイズ内容まとめ

一番安いモデルです。11万円くらいかな、税込でも。安さにたいするスペックは、ノートパソコン界でも随一ではないでしょうか。このスペックを11万円で買えるんですから、アップルは素晴らしい商品を開発してくれました。

MacBookAirでのブログ執筆を楽しくする環境つくり。 – ガクマーケティング

Ulysses? Bear? iAwriter? マック対応のテキストエディタで、楽しくブログ執筆する環境を整えてみました。

バッテリーの持ちも非常によい。ほぼ毎日カフェで仕事をしていますが、バッテリーで困ったことはありません。モバイルバッテリーも持ち歩いていますしね。

M1版MacBook AirのモバイルバッテリーはこれでOK【Anker PowerCore Essential 20000 PD】【Anker PowerPort Atom III 45W Slim】 – ガクマーケティング

M1版のMacBookAirで使える、コスパ最強モバイルバッテリーを紹介!普通のモバイルバッテリーだと、充電できないこともあるので、ご注意ください。私が実際に使って、問題なく充電できているものなので、安心してお使いいただけると思います。

キーボード:HHKB 当ブログのカスタマイズ内容まとめ

ここで紹介したもののうち、いちばん長く使っているものかもしれません。それこそ4年くらい。

音声入力でブログを書くことも多いですが、やっぱりキーボードで書くのが気持ちがいいです。口語を書くのと、口語を話すのは、まったく別のアウトプットだと思います。わたしは基本的には、書くのが好きなのです。嫌いだけど。

Macのうえに乗せて、尊師スタイルです。最近は持ち運ぶことも増えてきて、ルーフを買おうかな……なんて馬鹿なことを考えています。フタです。キーボードの。アホでしょ?

フタは置いといて、キーボード自体は素晴らしいです。わたしは長いときは1日で10時間以上キーボードを叩きます。HHKBだと疲れにくい。手が痛くならない!(ハズキルーペ)

HHKB日本語版1週間レビュー!良い点4つ・悪い点3つを赤裸々紹介 – ガクマーケティング

こんにちは。ガクマーケの井上 です。 念願のHHKBを購入しました!ありがとうアマゾンプライムデー! そこで今回は『HHKBを1週間使い倒した感想』をお伝えします。 HHKBを買おうか迷っている人、HHKBの試用感が気に […]

最近はクラムシェルモードでどっしり作業することも増えてきて、HHKBよりもどっしりしたキーボードがあっても良いよなとか思っています。そう、リアルフォースのMac用キーボードとか……(3万円)

まとめ 当ブログのカスタマイズ内容

ハードからソフトまで、いろいろ紹介しました。備忘録なので何かと説明不足であることも気づいています。

「この辺どうなってるの!」なんて質問があれば、お気軽にお問い合わせくださいな!

▼編集後記:
イノウエガク

@inouegaku01をフォローする

あえてプラグインは明記しませんでした。セキュリティ上の観点です。ごめんね。ブロガー長くやってると、他人のブログのこだわりに触れるのが好きになったりします。ゴリゴリ自社開発の企業ブログより、少しずつ改造されて年月を感じる個人ブログが好きなんだ。君も、そうなんだろう?

ABOUT ME
アバター
イノウエガク
運営責任者/ライター: イノウエガク 北海道在住のライターです。 olbb(株)取締役、ガクマーケティング代表 市役所と北海道庁職員を併任した後、WEBマーケターに転職。2年後に独立し、現在はライター&経営者をしています。 「働き方をもっと自由に、だけど堅実に」がモットー。 ■もう少し詳しく ≫個人的なプロフィールはこちら ≫ライターとしての活動実績などはこちら(外部リンク) ≫ワタシのシュウカン ≫ワタシのサブスク