WordPress-子テーマによるフォントの変更

Twenty Fifteen を例に、子テーマを使用してフォントをカスタマイズする。
1. 子テーマ用のフォルダ作成
/wp-content/themes に、子テーマ用のフォルダとして
twentyfifteen-child
を作成する。
2.style.css
上記のフォルダに、次の style.css を作成する。

コメントは、子テーマの情報として認識されので、各項目はサイトに合わせて書き換えること。特に必要なのは以下の2つ:

  • Theme Name … 子テーマの名前(例:Twenty Fifteen Child)
  • Template … 親テーマのフォルダ名(例:twentyfifteen)

スペルミスをするとうまく認識されないので、きちんと確認してください。
3. function.php
続いて子テーマフォルダ内に functions.php というPHPファイルを作成する。
functions.php のコードは以下の通り。

4. 子テーマを有効化
以上で子テーマが使えるようになったので、これを有効化する。
ダッシュボードから「外観→テーマ」と進んで、Twenty Fifiteen Child を有効化する。


参考URL:
子テーマを作ってWordPressの既存テーマをカスタマイズする方法

以上

Jupyter notebook を PDF 出力(Ubuntu編)

Jupyter notebook で作成した ipynb ファイルは、様々な形式に変換できる。
サポートしている形式は以下の通り。

  1. HTML
  2. LaTeX
  3. PDF
  4. Reveal.js HTML slideshow
  5. Markdown
  6. reStructuredText
  7. executable script
  8. notebook

個人的には、HTMLとPDFだけで十分ではあるが・・・

例えば「test.ipynb」をHTMLに変換するには、コマンドラインから

とするとHTMLがtest.ipynbと同じディレクトリにtest.htmlが作成される。
css部分が巨大なので、1万ステップを超えるファイルになってしまうので、body部分のみを出力したい場合は、次のようにする。

PDF出力も、HTMLをPDFに変更した同じコマンドを使用する。

しかし、この形式に変換るにはLaTexを使用するので、先ずはLaTexのインストールが必要となる。
LaTexのインストール手順は以下の通り。

これでLaTexのインストールは完了していると思われるのだが、「xelatex」がPATHに登録されていないとのエラーが発生する。
致し方ないので、xelatexもインストールしてみる。

理由は分からないが、これで無事PDFが出力できるようになったが、イマイチ腑に落ちない。

Anaconda-Navigateから jupyter lab が使用できない

windows7にインストールした、Anaconda3のAnaconda-Navigateから
jupyterlabのlaunchボタンをクリックすると、一応デフォルトの
ブラウザが立ち上がり、jupyter notebook のアイコンが一時的に
表示されるのだが、直ぐにそれも消えて真っ白な画面に戻り、
何時まで経っても何の反応もない。

色々調べてみると、
GitHub
には、概略次のような記述がある。

「動作が確認されているのは次のもの。

  • 最新の Firefox
  • 最新の Chrome
  • 最新の Safari

古いバージョンでも動作するかもしれないが、何れも保証はない。

JupyterLab は、CSS 変数を使用しているので、それをサポートしていない IE 11+ や Edge 14 はサポート対象外。」

デフォルトのブラウザを換えたくないので、jupyter側のブラウザをChromeに変更する。
手順は、Qiitaを参考にした。

(1) /users/(あなたのユーザ名)/.jupyter/jupyter_application_config.py
が存在するかを確認。なければ、コマンドプロンプトより次のコマンドを実行する。

(2) jupyter_application_config.pyをテキストエディタで開き
c.NotebookApp.browser = ”を探す。
この下に次の行を追加し、保存する。

以上

phpAdminの設定

Apacheが突然動作しなくなった。
原因が全く掴めないので、xamppを再インストールすることに。

前回から約4年が経過し、随分内容に変化が見られるが
自分の環境で静かに動いてくれればよいので、MySQLに以前通りの
passwordを設定したのみ。

ところが、この所為でphpAdminが動作不能に。
前のバージョンでは、ログイン画面が出てパスワード聞いてきたのに
いきなり「パスワードが一致しない」と!
そりゃそうだわな、ログインもしてないし、パスワードも入力してないんだから。

ググって、いろいろ調べるも、どれもこれも古い情報ばかり。
検索条件を「一年以内」に絞って探し当てたのが
「AdminWeb」サイトの
「rootのパスワード設定後にphpMyAdminのログインに関する設定を行う」
と云う記事。

こんな風に変化しているとは驚きです。

グラフィクスをファイルへ保存

グラフィクスのファイル保存方法

R で作成したグラフィクスのファイルを保存するには
以下の2方法があります。

(1) savePlot

画面にグラフィクスを作成後、savePot関数を呼び出す。

savePlot("filename.ext"), type="type")

(2) バッチスクリプトの使用

  1. png(…) や jpeg(…) などの関数を呼び出し、新しいグラフィクスファイルを開く。
  2. plotやその他の関連関数を呼び出し、グラフィクスイメージを作成する。
  3. dev.off()を呼び出し、グラフィクスファイルを閉じる。
png("filename.ext", width=w, height=h) # w:幅, h:高さ

【例】myPlot.png を作成する

png("myPlot.png", width=648, height=432) # サイズの指定は任意

plot(x, y, main="Scatterplot of X, Y")   # main はタイトル

dev.off()

各プラットフォームで使用できる関数のリストは

help(Devices)

で確認できます。

Mathjax Latex の数式を左揃えにする

Mathjax Latex を使用すると、数式が綺麗に表示できます。
ちょっと残念な点は、この数式が「中央揃え」になることです。

通常、ノートの中央に数式を書くことはないですよね。
と言うことで、左揃えにする方法をググって
「MathJax – 数式を左寄せにする方法」
の、「CSSによる左寄せ」を参考にさせてもらいました。
(Latexのコマンドは使用できないようです。)

テーマのCSSを直接変更すると、テーマのバージョンアップの都度
CSSを変更しなければならないので、子テーマにCSSを設定する
事にしました。

【子テーマの作成】

次の手順に従います。

  • 子テーマディレクトリを作成する
  • style.cssを作成する
  • functions.phpを作成する

(1) 子テーマディレクトリの作成

http://hoge/huga/wp-content/themes/ の下に、

と言うディレクトリを作成する。
(自分が使用しているテーマに合わせ、変更してください。)

(2) style.css の作成

テーマが twentyseventeen の場合、次のように作成する。
コメント部分が重要です。
自分の環境に合わせ修正する必要があります。

(3) functions.php の作成

各テーマ共通です。

Mathjax Latex のテスト

Mathjax Latex のインストールについては、下の参考リンクを見てください。
参考リンク:http://webshufu.com/mathjax-latex/

数式を表示するには、[mathjax]をロードする必要がありますので
数式の直前に[mathjax]を使指定してください。

2つ目以降の式には、[mathjax]をロードする必要はありません。

【例1】


$$(三角形の面積)=\frac{(底辺)\times(高さ)}{2}$$

【例2】

$$N=\frac{r(r+1)^{n} }{(r+1)^{n}-1}$$

【例3】インライン表示

[latex]式[/latex] を使用すると、インライン表示 \(E=mc^2\) も可能です。

Pukiwiki-1.5.1にSyntaxHighlighterを設定する

正式にはサポートされなくなった(?)のか
Pluginが消えてしまった。

仕方がないので、Pukiwiki-1.4.7で使用していたPluginを
そのまま使用してみた。

【導入手順】
(1) プラグイン sh.inc.phpをダウンロードし、解凍後、
Pukiwikiのpluginフォルダに配置してください。
(なお、このプラグインは、現在リンク切れになっているので、筆者のパソコンに設定してあったものです。
利用する場合は、自己責任でどうぞ)
(3) SyntaxHighlighterをダウンロードし、解凍します。
解凍したフォルダ内の「scripts」、「styles」の両フォルダを、pukiwiki フォルダ内の skin/sh フォルダにそのままコピーします。
(4) pukiwiki.ini.php の56行目付近を次のように変更します。

//define('PKWKEXP_DISABLE_MULTILINE_PLUGIN_HACK', 1); // 1 = Disabled この行をコメントアウトします
define('PKWKEXP_DISABLE_MULTILINE_PLUGIN_HACK', 0); // 1 = Disabled  この行を追加します

これで、ハイライト表示が可能になるが、見映えを改善するため
pukiwiki 内の、skin/sh/styles にある「shCore.css」に次の変更を加えます。

(1) 表示領域の右側に、無条件に縦スクロールバーが表示されるので
それを表示しないようにする

55行目付近

.syntaxhighlighter {
  width: 100% !important;
  margin: 1em 0 1em 0 !important;
  position: relative !important;
  overflow: auto !important;
  font-size: 1em !important;
  overflow-y: hidden !important;  /* この行を追加する */
}

(2) フォントスタイルを変更する

47行目付近

font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;

font-family: "Meiry UI",メイリオ,"Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;

好みのフォントを追加する。

【使い方】

#sh(brush){{

ここにコードを配置する

}}

brush の種類は、こちら を見てください。

UTF-8へのコード変換

コードを変換(UTF-8へ)

ubuntu(bash)において、拡張子が .html のファイルのエンコードをEUCからUTF-8へ変換する。

find -name "*.html" | xargs nkf --overtwrite -w

文字コード

  • -j : ISO-2022-JP
  • -s : Shify-JIS
  • -e : EUC-JP
  • -w : UTF-8
  • 「charset=euc-jp」を含む行の削除

    # 3行目を削除し上書き保存する
    sed -i -e "3d" *.html
    
    # 複数行を削除する場合の例
    # 5~10行目を削除し上書き保存する
    sed -i -e "5,10d" *.html
    

    「charset=”UTF-8″」を追加

    # 3行目に追加する
    sed -i -e '3i <meta charset="utf-8">' *.html
    
    # PHPのDOMを使用する場合は次のようにする
    sed -i -e '3i <meta http-equiv="content-type" content="text/html; charset=utf-8" />' *.html
    

    Bootstrap テーブル見出しの中央配置

    Bootstrapにおける、テーブル見出しは「左上配置」になり、bootstrapを使う意味がないような気になります。
    縦・横中央揃えを指定できるようなクラスも無いようで・・・
    rowspanやcolspanでセルを結合した場合は、下の画像の通り、特にひどい状態になります。

    縦・横中央に配置するには、CSSで強制的に配置してやらないとダメなようなので、
    Firebugで要素を調査したところ、次のように設定すると改善できるようです。

    .table > tbody > tr > th,
    .table > tfoot > tr > th,
    .table > thead > tr > th {
      vertical-align: middle;
      text-align: center;
    }
    

    結果は、以下の通りになりました。

    なお、tableタグには次のclassを指定してください。

    <!-- table-borderedは任意です -->
    <table class="table table-bordered">