cocoon で画像を拡大できるようにする
ブログに unreal engine の記事を追加しようと思ったのだが、Blueprint は画像が大きくなってしまうので、画像拡大の機能が欲しくなった。 cocoon での使い方は以下の通り Cocoon 設定から「画像」を選択 画像拡大 ...
Cocoon で Prism.js を使う
Highlighting Code Block プラグインを使うだけで良い。 自分でカスタマイズしてダウンロードしてきた prism.js と prism.css を指定して使うことができる。 設定 まず、プラグインをインストールして有効化 ...
Cocoon のシンタックスハイライトのスマホでの改行位置を変えたい
Cocoon のデフォルトでは、シンタックスハイライトを有効にしている状態で iPhone や iPad でソースコード見たときに、右端で改行してくれている。好みの問題だが私はこれだと見づらい。なので右端で改行しないでスクロールするようにし ...
Cocoon の シンタックスハイライトの背景を縞々にする
現在、WordPress のテーマは、サイトを分けて Cocoon と Luxeritas を両方使っています。Luxeritas のシンタックスハイライトで、背景を縞々にすることができているので、Cocoon でもできないかやってみました ...
06: WordPress – 余分なヘッダの削除
<head> 内に追加される不要なタグを取り除く 標準でいろいろ不要だと思うものが<head> タグ内に追加されています。これらを消していきます。SEO的にあった方が良いものもあるのかもしれませんが、わからないものは ...
05: WordPress – オリジナルのテンプレートの作成 – 3カラムレイアウト
3カラムのテンプレートに、WordPrsses の記事を表示する部分を実装します 次のような機能を実現します。一部、プラグインを使うところは、後日実装します。 ヘッダー タイトル パンくずリスト用のエリア 左サイドバー カレンダーアーカイブ ...
04: WordPress – Bootstrapで3カラムレイアウトの作成 – レスポンシブデザイン
Bootstrap を使って 3カラムレイアウトのテンプレートを作成します オリジナルテーマの作り方を探していると、ほとんどが 2 カラムのレイアウトになっています。熱帯魚のブログを他サイトから引っ越してくる際に、それまで使っ ...
03: WordPress – Bootstrapで2カラムレイアウトの作成 – レスポンシブデザイン
Bootstrap の grid システムを使って、WordPress のカスタムテンプレートをレスポンシブデザインにします Bootstrap の導入 まずは、bootstrap-4.1.3-dist.zip してきます。 その中から次の ...
02: WordPress – 2カラムレイアウトのテンプレートの骨組み作成
Bootstrap でレスポンシブデザインを作っていくための下準備 今回は、テンプレートを分割して配置するところまで行います。デザインを調整する際に必要がないため、WordPress として記事を表示する部分は実装しません。と ...
01: WordPress – さくらインターネットのスタンダードプランにWordPressをインストール
クイックインストールで簡単にインストールできます。1時間くらいでできると思います。 WordPress でオリジナルテーマを作るにあたり、まずは、さくらインターネットのスタンダードプランにWordPress をインストールしました。あらため ...
WordPress のプラグイン
自分で試してみたプラグインについて、ここにメモしています。 Crayon Syntax Highlighter この機能が欲しくてWordPress をはじめました。重たいって言われています。重たいのは、preタグの中をtableやdiv、 ...