現在のURLと一致するa要素を表示する

a-blog cmsは、現在表示しているページでそのページへのリンク(アンカー要素(<a>))が存在したら、そのリンクを外す仕様になっています。 現在表示中のページから同じページへのリンクは基本的には必要ないという考え方です。

デフォルトの設定

この機能の設定は、/js/config.jsの以下の箇所にあります。設定を変更する場合は、適用しているテーマ内にJavaScriptファイルを別途作成してください。詳しくは「組み込みJSについて:設定を編集する」を参照してください。

viewingMark: 'a.js-viewing-receptor', // 1.3.0 未満のバージョンからアップデートする場合には 'a' と指定してください。
viewingId: 'viewing',
viewingClass: 'viewing',
viewingEraseMark: 'a:not(.js-viewing-indelible)', // display:blockの要素は取り除かれません
viewingReplacement: '',
viewingRemoveAttr: ['href', 'charset', 'type', 'hreflang', 'rel', 'rev', 'target'],
viewingNonTarget: ['block', 'inline-block', 'flex', 'grid', 'table'],

機能紹介

現在表示中のページと同じリンクのアンカー要素が外れないようにする

現在表示しているページと同じリンクのアンカー要素(<a>)を消す機能を無効にするには、テンプレートファイルを編集します。リンクを表示したいアンカー要素(<a>)にjs-viewing-indelibleというclass名を記述します。サイトの管理上の支障などがなければ、このclass名はとくに変更する必要はありません。

// viewing
viewingEraseMark    : 'a:not(.js-viewing-indelible)',

現在表示中のページと同じリンクのアンカー要素(<a>)が外れても表示が崩れないようにする

またアンカー要素にスタイルが当たっていた場合、その要素が組み込みJSによって外されることによって表示が崩れることがあります。そういった表示崩れを防止するために.js-viewing-receptorというclassが用意されています。
このクラスをアンカー要素に設定することで、そのアンカーの親要素にデフォルトで.viewingというclassが付与されます。そのクラスに対して任意にCSSを記述して表示崩れを防止できます。

// viewing
viewingMark    : 'a.js-viewing-receptor',

使い方

テンプレート内でアンカー要素(<a>)を表示したい部分を編集する

リンクを表示したいアンカー要素(<a>)に、config.jsで設定しているclass名を記述します。

例)テンプレートに記述するソース(viewingを無効にする場合)

<a href="{url}" class="js-viewing-indelible">{name}</a>

これで現在のページと同じリンクの記述も、アンカー要素(<a>)が表示されるようになります。

テンプレートの記述変更をせずに、全てのアンカー要素(<a>)を表示する

上記のclassを記述せずに現在のページと同じリンクを表示したい場合は、config.js 内の以下の部分を削除またはコメントアウトします。この場合、全てのアンカー要素(<a>)が対象になります。

// viewing
viewingMark         : 'a.js-viewing-receptor', // 1.3.0 未満のバージョンからアップデートする場合には 'a' と指定してください。
viewingId           : 'viewing',
viewingClass        : 'viewing',
viewingEraseMark    : 'a:not(.js-viewing-indelible)', // dispaly:blockの要素は取り除かれません