角括弧[]で囲んであるショートコードを表示できるようにしたい。

HTMLとかCSS
この記事は約5分で読めます。

おはにちばんは、ふみえです(。・ω・)ノ゙

皆さんいかがお過ごしでしょうか??

ついでに苦労したのでおまけで書いてみます。

 

ふつうに

[blogcard url="リンクしたいURL"]

って書いたら

勝手にリンクが作られてしまって

リンクしたいURL

↑こんな感じになっちゃう。

文字で紹介することができません・゚・(つД`)・゚・

どうしたものかしら。

 

スポンサーリンク

[]で囲んでるのがダメっぽい!

blogcard url=”リンクしたいURL

って書いただけなら

普通に文字で表示されます。

でも[]で囲んだ瞬間、リンクになっちゃいます。

角括弧じゃなくて普通の()で囲んだらちゃんとした情報が伝えられないし。

 

[]

の中に

blogcard url=”リンクしたいURL

って入力してね(@’ω’@)ノ

 

って書いても分かりにくいし・・・。

 

ちなみに[]の名前は「角括弧」

[]は「角括弧」または「ブラケット」というらしいです。

確かに角ばった括弧です。

はい(;´・ω・)

 

思いついたのは写真で説明すること

悩んだ末に思いついたのは

スクショを撮って貼ればいいじゃんっ!

こんな感じでっ!

URL

 

 

ほらっ!

これなら勝手にリンクが作られないっ!

我ながら頭いいー♪

 

でもコピペ用には使ってもらえないという・・・。

どうすればいいのよ・゚・(つД`)・゚・

 

 

ショートコードのエスケープ

さっきも書いたけど[]で囲んで

[blogcard url="リンクしたいURL"]

っていうのを投稿に入力したら

ワードプレス君は

「あっ、リンクを作らないといけない!」

って思ってすぐさまリンクを作っちゃうんです。

リンクを貼る時には便利だけど紹介するときはとっても不便です(`ω´)

 

ショートコード

調べていくと角括弧[]で囲んで使うのを

ショートコード」というらしいです。

だいぶからくりが分かってきましたよ(*’ω’*)

 

便利な機能を作って、名前を付けてどこかに保存しとけば

その機能の名前を[]で囲んで書くだけで、その便利な機能が使えるみたいです。

私が何か機能を作って名前をfumie01にしてたら

投稿を入力するところに[fumie01]って書くだけで使えるようになるみたいです(/・ω・)/

作り方は知りません。

例えば・・・

エクセルで、範囲に名前を付けとけば

関数の範囲指定の時に名前だけで範囲が選ばれるみたいな?

私はIMEパッドの単語登録で

「かお」で(´ω`)こんなのがでるようにしてるけど

そんな感じ?

 

ようするに

リンクを作るために書いてた

[blogcard url="リンクしたいURL"]

↑これがショートコードっぽくて、

そのショートコードのおかげで

カッコいいリンクが貼れるのです(多分)

(ホント多分です)

(違ってる可能性大です)

 

エスケープ

書いた瞬間ショートコードだと判断しちゃうんだったら

それはショートコードじゃなくてただの文字なんだ、

と認識させればいいだけです(*`・ω´・b

 

調べてみたら[]で囲ってるけど囲ってないようにさせる裏技があるみたい!

それが「エスケープ」です!

名前の通りショートコードという縛りから逃げちゃうのかな(・ω・)ノ

 

ワードプレスにもエスケープさせる方法があるみたいです!

ショートコード - WordPress Codex 日本語版

勝手にリンク貼っちゃったけど・・・。

これによると、

[blogcard url="リンクしたいURL"]

って書きたいときは

[[blogcard url="リンクしたいURL"]]

って書けばいいみたいです!

確かにその通りにうまくできました(●´ω`●)

 

※勝手に応用してみたけど、

[[blogcard url="リンクしたいURL"]]

って書くために投稿を書くところでは

[[[      ]]]

3重の角括弧で囲んでいます。

たぶん表示されるときに角括弧が1個減るんだと思います(・ω・)ノ

 

まとめ

  • []で囲まれてる謎の文字列が「ショートコード」
  • ショートコードじゃないって認識させるのが「エスケープ」

うむ。こんな感じかな(*`・ω´・b

名前が正しいかはわかんないけど

 

[[謎の文字列]]

って書くと

[謎の文字列]

って表示されます(+・`ω・)b

 

ショートコードとかエスケープっていう名前が分かっちゃえば答えはすぐに出てきました。

でも名前を知らなかったから、やりたいことをあれこれ言葉を変えながら検索しないといけなかったので大変でした(;ω;)

 

今回も最後まで読んでくださってありがとうございました(^ω^)

1
この記事を書いた人

山口県に住んでるぽっちゃりキャバ嬢。左利き。好きな食べ物はいなり寿司。 好きな音楽は洋楽EDM。自称コスメヲタ。いつか下着のお店を作りたいと思いブログを始めたものの、最近はコスメレポばかり(つω`*)

ふみえをフォローする
HTMLとかCSS
スポンサーリンク
この記事をシェア(/・ω・)/
ふみえをフォローする
関連記事と広告(●´ω`●)
関連記事と広告(●´ω`●)

ブログランキングに参加してます(●´ω`●)

PVアクセスランキング にほんブログ村

未経験でもお店を持ちたいっ!

コメント

  1. ちゃんと読む前にコメント書いちゃいました!まさにショートコードの入れ替え方法でしたね(>_<)
    失礼いただいました。では!

  2. いくつかの記事に渡って「Pz-LinkCard」を紹介いただいてありがとうございます。

    ショートコードを紹介しようとするとカードになってしまうので、画像にするのもひとつのお勧めですが、当サイトではショートコードを blogcard では無いものに変更しています。

    例えば a とかにしておくと、[a url=”xxx”] で自分は記述は出来て、紹介するときは [blogcard url="xxx"] って書いてもカードにならないウラワザです。

    参考になれば幸いです。では。

    • ふみえ より:

      こんばんは(つω`*)
      コメントありがとうございます。
      []で囲んであるやつの名前はショートコードで合ってたんですね(^ω^)
      それだけが気がかりだったんです。

      それと、ぽぽづれさんが言ってることが分かりました!
      普段は[blogcard url="xxx"]っていう名前のショートコードでリンクを作ってないから、紹介する時に何の小細工もなしに、[blogcard url="xxx"]って普通に書いても何も表示されないんですね!
      ってことはショートコードの名前って変えることができるんだ・・・。

    • 角括弧(かくかっこ)を2つ書くとエスケープ(逃げる)出来たんですね…!Σ(゚ロ゚)o゙
      むしろ知らなかった。ありがとうございます!

タイトルとURLをコピーしました