新しいタブで開くリンクをサービスポータルに作成する方法Issue <!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: #000000; } span { font-size: 12pt; font-family: Lato; color: #000000; } h2 { font-size: 24pt; font-family: Lato; color: black; } h3 { font-size: 18pt; font-family: Lato; color: black; } h4 { font-size: 14pt; font-family: Lato; color: black; } a { font-size: 12pt; font-family: Lato; color: #00718F; } a:hover { font-size: 12pt; color: #024F69; } a:target { font-size: 12pt; color: #032D42; } a:visited { font-size: 12pt; color: #00718f; } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } デフォルトでは、すべてのリンクが同じウィンドウまたはタブで開きます。この記事では、新しいタブで開くリンクをサービスポータルに作成するためのいくつかのオプションを (さまざまなウィジェットを使用して) 紹介します。 Release<!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: #000000; } span { font-size: 12pt; font-family: Lato; color: #000000; } h2 { font-size: 24pt; font-family: Lato; color: black; } h3 { font-size: 18pt; font-family: Lato; color: black; } h4 { font-size: 14pt; font-family: Lato; color: black; } a { font-size: 12pt; font-family: Lato; color: #00718F; } a:hover { font-size: 12pt; color: #024F69; } a:target { font-size: 12pt; color: #032D42; } a:visited { font-size: 12pt; color: #00718f; } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } すべてのリリース Resolution<!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: #000000; } span { font-size: 12pt; font-family: Lato; color: #000000; } h2 { font-size: 24pt; font-family: Lato; color: black; } h3 { font-size: 18pt; font-family: Lato; color: black; } h4 { font-size: 14pt; font-family: Lato; color: black; } a { font-size: 12pt; font-family: Lato; color: #00718F; } a:hover { font-size: 12pt; color: #024F69; } a:target { font-size: 12pt; color: #032D42; } a:visited { font-size: 12pt; color: #00718f; } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } リンクボタンウィジェットの使用: まずウィジェットのクローンを作成して、カスタマイズを許可します。ウィジェットの [HTML テンプレート] フィールドで、次のような target="_blank" の属性を追加します。<a target="_blank" ng-href="{{options.href}}" class="btn btn-{{options.color}} m-b" role="button">{{data.buttonMsg}}</a> アイコンリンクウィジェットの使用: まずウィジェットのクローンを作成して、カスタマイズを許可します。ウィジェットエディターで [メニュー] アイコンをクリックし、[オプションスキーマの編集] をクリックします。[+] アイコンをクリックして、次のようにウィジェットオプションを追加します。 ラベル:Target名前:targetタイプ:Choice選択肢:_blank、_self など (_top など、リンクタイプとして有効なオプションをさらに追加できます) これで、このウィジェットが使用されるたびに、リンクの target タイプを選択するオプションが追加されました。_blank に設定すると、リンクが新しいタブで開きます。 これが機能するのは、ウィジェットが追加のオプション (target) を受け取るようにすでに構成されているためです。 HTML テンプレートでは、各アンカータグ (<a/>) にはすでに次の属性があります: target="{{::data.target}}" これは、ウィジェットの [サーバースクリプト] フィールドで定義されています。 data.target = options.target || "" HTML ウィジェットの使用: 通常どおり、ページに HTML ウィジェットを追加します。ウィジェットの [HTML] フィールドで、ソースコードに移動してリンクを作成します。 (エディターの <> アイコンを使用)以下の画像またはサンプルコードに示すように、リンクの target 属性に値 _blank を指定します。(<a href="http://yourlink.com" target="_blank">Your link text</a>)