Cocoon

Cocoon で Prism.js を使う

Highlighting Code Block プラグインを使うだけで良い。自分でカスタマイズしてダウンロードしてきた prism.js と prism.css を指定して使うことができる。設定まず、プラグインをインストールして有効化する。...
Cocoon

Cocoon のシンタックスハイライトのスマホでの改行位置を変えたい

Cocoon のデフォルトでは、シンタックスハイライトを有効にしている状態で iPhone や iPad でソースコード見たときに、右端で改行してくれている。好みの問題だが私はこれだと見づらい。なので右端で改行しないでスクロールするようにし...
Cocoon

Cocoon の シンタックスハイライトの背景を縞々にする

現在、WordPress のテーマは、サイトを分けて Cocoon と Luxeritas を両方使っています。Luxeritas のシンタックスハイライトで、背景を縞々にすることができているので、Cocoon でもできないかやってみました...
サイト管理

新しいテーマのテストをするための投稿

タイトル H2H3H4H5H6スタイルシート/* 以下、好みに応じて子テーマ用のスタイルをお書きください。 ( Below here, please write down your own styles for the child them...
OS, DB, ミドルウェア

Docker

Docker のインストール方法インストール方法インストール方法は、いくつかあるらしい。(リポジトリをセットアップする。rpm から入れる。テストと開発の環境を入れるなど)CentOS 7 を minimal install した場合。yu...
OS, DB, ミドルウェア

CentOS 7 memo

ファイルシステムが ext4 から xfs に変更になった ネットワーク系のコマンドが変更になったコマンドなどの違いpkg-config --> systemctl 系のコマンドifconfig などのネットワーク系コマンド --> ip ...
OS, DB, ミドルウェア

CentOS 7 Tips

find + grepfind . -name \*.java -print | xargs grep "pattern"isoイメージをマウントするマウントmount -ro /home/iso/CentOS-7-x86_64-DVD-1...
サイト管理

youtube 動画の埋め込みテスト

Youtube に投稿した動画の埋め込みのテストさっそく画面を貼り付けたところ。解像度があっていないので汚いwidth と height を投稿時のものにするこんな感じか。動画うの上のタイトルが邪魔だな。
WordPressテーマ開発

06: WordPress – 余分なヘッダの削除

<head> 内に追加される不要なタグを取り除く標準でいろいろ不要だと思うものが<head> タグ内に追加されています。これらを消していきます。SEO的にあった方が良いものもあるのかもしれませんが、わからないものはとりあえず削除の方向で進め...
WordPressテーマ開発

05: WordPress – オリジナルのテンプレートの作成 – 3カラムレイアウト

3カラムのテンプレートに、WordPrsses の記事を表示する部分を実装します次のような機能を実現します。一部、プラグインを使うところは、後日実装します。 ヘッダー タイトル パンくずリスト用のエリア 左サイドバー カレンダーアーカイブ用...
WordPressテーマ開発

04: WordPress – Bootstrapで3カラムレイアウトの作成 – レスポンシブデザイン

Bootstrap を使って 3カラムレイアウトのテンプレートを作成しますオリジナルテーマの作り方を探していると、ほとんどが 2 カラムのレイアウトになっています。熱帯魚のブログを他サイトから引っ越してくる際に、それまで使っていた 3 カラ...
Web関連

schema.org に従った Webページの構造化

Schema.org ってなんだ?って思っていたら構造化されたドキュメントのスキーマを決めたものらしい。Webページに使うと、検索エンジンが意味を理解しやすくなるため SEO 対策になるようです。パンくずリストがあると SEO 対策になるっ...
Web関連

WordPressのオリジナルテーマで使用した html5 のタグについて

今まで、div タグに class でheader や footer などと書いていました。今回 WordPress のオリジナルテーマを作るにあたり、参考にした本やサイトで <header> <article> <footer> などのタ...
WordPressテーマ開発

03: WordPress – Bootstrapで2カラムレイアウトの作成 – レスポンシブデザイン

Bootstrap の grid システムを使って、WordPress のカスタムテンプレートをレスポンシブデザインにしますBootstrap の導入まずは、bootstrap-4.1.3-dist.zip してきます。その中から次のファイ...
WordPressテーマ開発

02: WordPress – 2カラムレイアウトのテンプレートの骨組み作成

Bootstrap でレスポンシブデザインを作っていくための下準備今回は、テンプレートを分割して配置するところまで行います。デザインを調整する際に必要がないため、WordPress として記事を表示する部分は実装しません。とりえず、こんな感...
WordPressテーマ開発

01: WordPress – さくらインターネットのスタンダードプランにWordPressをインストール

クイックインストールで簡単にインストールできます。1時間くらいでできると思います。WordPress でオリジナルテーマを作るにあたり、まずは、さくらインターネットのスタンダードプランにWordPress をインストールしました。あらためて...
サイト管理

壊れても構わないテスト用の記事

もう少しテンプレートでいろいろ試したかったので、追加のテスト用記事として投稿見出し5 のテスト見出し5p にクラスが指定できないかのテストp にクラスを設定してみると思ったら p タグになっていなかった別のタグのテストついでに引用もテスト ...
WordPressテーマ開発

WordPress のプラグイン

自分で試してみたプラグインについて、ここにメモしています。Crayon Syntax Highlighterこの機能が欲しくてWordPress をはじめました。重たいって言われています。重たいのは、preタグの中をtableやdiv、sp...
サイト管理

レイアウトを確認するための投稿

レイアウト確認他のための記事です。ここで h1, h2, h3, h6, p, img を確認しますレイアウトの説明各タグの使い方次のように使い方を決めました h1: タイトル h6: タイトルの下に、記事の説明的なものを書くために使用する...
サイト管理

サイト管理のためのページ

このサイトを管理するためのルールに関するページです。完全に自分のためのページです。ヘッダタグの使い方h1: タイトル 「windows tips」「オンライン3Dアクションゲームの作り方 - day1」などh6: タイトルの下の簡単な説明 ...