MovableTypeのMTLinkを使ってみた

# はじめに

- ``PowerCMS``を使っていて、外部サイトへのリンクを毎回手入力するのが嫌になってきた
- カスタムフィールドを使って簡単に挿入できるようにする

# システムにカスタムフィールドを作成

- 記事用とウェブページ用の2種類を作成した

## 記事用のフィールド

| 項目 | 内容 |
|---|---|
| システムオブジェクト | 記事 |
| 名前 | 関連サイト |
| 説明 | 外部サイトのリンクを選択してください。リンクを新規に作成したい場合は◯◯まで「リンク名」「リンクURL」を教えてください。 |
| 種類 | リンク（複数選択）|
| 必須 | チェックをいれない |
| ダイナミック | チェックを入れておく |
| ベースネーム | entryrelatedlinks |
| テンプレートタグ | EntryDataRelatedLinks |
| 編集画面に表示 | チェックを入れる |

## ウェブページ用のフィールド

| 項目 | 内容 |
|---|---|
| システムオブジェクト | ウェブページ |
| 名前 | 関連サイト |
| 説明 | 外部サイトのリンクを選択してください。リンクを新規に作成したい場合は◯◯まで「リンク名」「リンクURL」を教えてください。 |
| 種類 | リンク（複数選択）|
| 必須 | チェックをいれない |
| ダイナミック | チェックを入れておく |
| ベースネーム | pagerelatedlinks |
| テンプレートタグ | PageDataRelatedLinks |
| 編集画面に表示 | チェックを入れる |


# システムにウィジェットを作成

- アーカイブタイプが記事（``Individual``）またはウェブページ（``Page``）のときだけ表示するようにした
- 日本語と英語のウェブサイトに対応するため``WebsiteLanguage``の値から小見出しを判別するようにした

```html
<!-- 小見出しをウェブサイトの言語によって切り替えるための VarBlock -->
<MTSetVarBlock name="related_links"><MTIf tag="WebsiteLanguage" eq="ja">関連サイト<MTElse>Related Websites</MTIf></MTSetVarBlock>

<MTIfArchiveType type="Individual">
  <MTIf tag="EntryDataRelatedLinks">
  <div class="section">
    <h3><MTVar name="related_links"></h3>
    <div class="collection">
      <MTEntryDataRelatedLinks>
        <a class="collection-item" href="<MTLinkURL>"><MTLinkName></a>
      </MTEntryDataRelatedLinks>
    </div>
  </div>
</MTIf>  
</MTIfArchiveType>

<MTIfArchiveType type="Page">
  <MTIf tag="PageDataRelatedLinks">
  <div class="section">
    <h3><MTVar name="related_links"></h3>
    <div class="collection">
      <MTPageDataRelatedLinks>
        <a class="collection-item" href="<MTLinkURL>"><MTLinkName></a>
      </MTPageDataRelatedLinks>
    </div>
  </div>
</MTIf>  
</MTIfArchiveType>

```

## 使っているMTタグ

- [MTSetVarBlock](https://www.movabletype.jp/documentation/appendices/tags/setvarblock.html)
- [MTVar](https://www.movabletype.jp/documentation/appendices/tags/var.html)
- [MTIf](https://www.movabletype.jp/documentation/appendices/tags/if.html)
- [MTIfArchiveType](https://www.movabletype.jp/documentation/appendices/tags/ifarchivetype.html)
- [MTLinkName](https://www.powercms.jp/products/document/template-tags/linkname.html)
- [MTLinkURL](https://www.powercms.jp/products/document/template-tags/linkurl.html)

## 使っているCSSフレームワーク

- [Collections - MaterializeCSS](https://materializecss.com/collections.html)


# ブログにリンクを作成する

| 項目 | 内容 |
|---|---|
| 名前 | MTLinkName; 必須 |
| URL | [MTLinkURL](https://www.powercms.jp/products/document/template-tags/linkurl.html); 必須 |
| メモ | [MTLinkNotes](https://www.powercms.jp/products/document/template-tags/linknotes.html) |
| 概要 | [MTLinkDescription](https://www.powercms.jp/products/document/template-tags/linkdescription.html) |
| タグ | [MTLinkTags](https://www.powercms.jp/products/document/template-tags/linktags.html) |
| title属性 | [MTLinkTitle](https://www.powercms.jp/products/document/template-tags/linktitle.html) |
| target属性 | ``MTLinkTarget`` ; ``_blank`` / ``_top`` / ``none`` から選択|
| rel属性 | [MTLinkRel](https://www.powercms.jp/products/document/template-tags/linkrel.html) |
| 画像のURL | [MTLinkImageAddress](https://www.powercms.jp/products/document/template-tags/linkimageaddress.html) |
| RSSのURL | [MTLinkRSSAddress](https://www.powercms.jp/products/document/template-tags/linkrssaddress.html) |
| ランク | [MTLinkRating](https://www.powercms.jp/products/document/template-tags/linkrating.html) |
| 作成日 | [MTLinkAuthoredOn](https://www.powercms.jp/products/document/template-tags/linkauthoredon.html) |
| ステータス | ``下書き`` / ``公開`` |


# 記事／ウェブページで「関連サイト」からリンクを選択する

- 「関連サイト」が表示されていない場合は、「表示オプション」から設定を変更する
- 選択した順番でリンクが表示される（はず）

# まとめ

- 外部リンクのデータベースを作っていくイメージになる（はず）
- 外部リンクがきれてしまった場合も、URLを正しいものに変更する／ステータスを非公開にすればOK
- 複数名で記事を管理する場合に、表示名のゆれがなくなる（はず）