かもメモ

自分の落ちた落とし穴に何度も落ちる人のメモ帳

はてなブログ Markdown コード内にバッククオートを表示したい

` ← バッククオートをインラインコード内に表示する方法

表示したいバッククオートの後ろに半角スペースを付けると上手く表示できる。

`` `

👉 `

バッククオートを含んだ文字列をインラインコードに表示する方法

先頭にバッククオートを表示する場合

そのまま書けばOK

``foo`

👉 `foo

末尾にバッククートを表示する場合

2重のバッククオートで囲み表示したいバッククオートの後に半角スペースを含める

``bar` `` 
// 文字列の先頭にスペースを入れてもOK 
`` bar` ``

👉 bar` bar`

バッククオートで囲んだ文字列を表示する場合

2重のバッククオートで囲んだ中に表示するバッククオートで囲んだ文字列 + 半角スペース で表記する

```hoge` ``
// 前後にスペース入れたほうが見やすい
`` `hoge` ``

👉 `hoge` `hoge`

文字列中にバッククオートがある場合

code内に表示する文字列全体を2重のバッククオートで囲めばOK

``foo`bar` hoge `fuga`mofu``

👉 foo`bar` hoge `fuga`mofu

 

2つ以上の連続したバッククオートを表示したい場合

超 どこで使うねん感ある…
表示したい連続したバッククオートより多いバッククオートで囲めばOK
※ 表示するバッククオートが文字列中にある場合でも連続したバッククオートより多いバッククオートで囲まないとダメ

``` `` ```
``` ``foo ```
``` bar`` ```
```hoge``fuga```

👉 ``
👉 ``foo
👉 bar``
👉 hoge``fuga

 
結論としては、表示したいバッククオートより多い数で囲んで、バッククオ―トで終わる文字列だったら最後に半角スペースをつけるって感じに覚えておけばOKっぽい!


jadeがpugになって変わった所のメモ

HTMLのコーディングの際にjadeを愛用しています。
jadeがpugになってから、所々仕様が変わっていたのでメモ

Mixinの呼び出し方が変わった

mixin 関数名() ではなく+関数名()になった。

jade

mixin foo('引数')


pug

+foo('引数')

文字列中の変数展開の方法が変わった

jadeの時は"で囲まれた文字列の中に#{変数名}で文字列展開ができていましたが、
pugからは文字列展開をする場合は`で文字列を囲み${変数名}とするか、jadeでも使えていた+演算子で文字列と変数を連結するかになってました。
これはちょっとjadeのときの方が便利だった感じがします...

jade

a(href="#{link}")
p(class="foo#{bar}hoge")
p(class="foo" + bar + "hoge")


pug

a(href=`${link}`)
p(class=`foo${bar}hoge`)
p(class="foo" + bar + "hoge")

for, each の先頭の-が不要になった

逆に-を付けて - each とか - for としてしまうとpugではシンタックスエラーになってしまうようです。

jade

- each val in obj
  = val

- for val in arr
 = val


pug

each val in obj
  = val

for val in arr
 = val

詳しくは公式のリファレンスに載っています。
Migrating to Pug 2

 
CODEPENにjadeで書いてたものがpugに置き換わってて死んでたので気づきました。
これからはpugを使っていく事になると思うので気をつけようと思いました。


WordPress サイトのフロントページにしている固定ページを動的に取得したい

WordPressで企業サイトなどを作っている時に固定ページをフロントページ(サイトトップ)に設定する事も多いと思います。
かなりレアケースな気もしますが、フロントページに設定しているページオブジェクトやページIDが必要になるテーマを作成する時のメモ。
f:id:kikiki-kiki:20161211123954p:plain

固定ページを決め打ちで変更しない場合

他のページでフロントページに紐づく情報が取りたい時に、フロントページが決まっていて変更がないのであれば、get_page_by_path()を使ってフロントページに指定されているページオブジェクトを取得することができます。
例えば、/homeでアクセスできる固定ページをフロントページにしている場合は下記で取得することができます。

<?php
$frontPageObj = get_page_by_path('home');

下記では取得できない。

<?php
$frontPage = get_page_by_path('/'); // => null
$frontPage = get_page_by_path( home_url() ); // => null

get_page_by_path()関数は /home_url() といったサイトのトップのURLを引数にしても、null になってしまいます。
なので、ページのスラッグを固定値で指定しなければならず、フロントページにする固定ページを変更すると、その都度get_page_by_path()関数に渡すスラッグを変更する必要があるので、フロントページが変更される可能性があると少し面倒です。

get_option()でフロントページのページIDを取得できる

get_option( 'page_on_front' ): returns the ID of the static page assigned to the front page
is_home() | Function | WordPress Developer Resources

get_option( 'page_on_front' )フロントページに設定してあるページのIDを取得することが出来るので、下記のコードでフロントページのページオブジェクトを取得することができます。

<?php
$pageID = get_option( 'page_on_front' );
$frontPage = get_post( $pageID );

この方法ならフロントページが変更になっても、変更したページを取得することが可能です。

get_option()で投稿ページに指定しているページIDも取得できる

引数をpage_for_postsにすれば、投稿ページ(home)に指定しているページIDも取得することができます。

<?php
$homeID = get_option( 'page_for_posts' );
$homePage = get_post( $homeID );

 
久しぶりにWordPress案件をしてたので、ページを取得する関数だったget_page()は廃止されて、投稿もページもget_post()で取得できるようになってたの今更を知りましたw


[参考]

小さなお店&会社の WordPress超入門 ―初めてでも安心! 思いどおりのホームページを作ろう!

小さなお店&会社の WordPress超入門 ―初めてでも安心! 思いどおりのホームページを作ろう!