ガイド内の画像をクリック特定のページに飛ばす方法

自分メモシリーズ

画像をクリックすると新しいタブが開くガイドを作成する方法の概要：

1. ガイドステップに画像ブロックを追加します。
2. HTMLソースを調べるか、Pendoのタグ付けAIDを使って画像IDを見つける。
3. 画像IDを使って、新しいタブを開くコードブロックを追加します。
4. JavaScriptを使用して、新しいタブでURLを開くクリックイベントを画像に添付します。
5. オプションで、CSSを使用して、画像にマウスカーソルを合わせたときのマウスアイコンを手に変更します。

Code Block

   (function () { 
        let url = "https://www.youtube.com/watch?v=4W8gWOh0t7U"//replace with your url  
        let imgLink = pendo.dom('#pendo-image-32a50899')[0] //replace with your Pendo image ID  
        pendo.attachEvent(imgLink, 'click', function () { 
            window.open(url, '_blank'); 
        }) 
    })() 

（オプショナル）
画像にカーソルを合わせた時にマウスアイコンを手の形にするCSS

/*replace with your Pendo image ID*/     
#pendo-image-32a50899:hover {  
        cursor: pointer; 
    }