유저스크립트로 사이드 메뉴에 즐겨찾기 추가하기
이프로부족

Lv.1 이프로부족 (172.♡.210.64)

2024년 3월 31일 PM 06:49

조회 595 공감 0

크롬 익스텐션을 이용한 유저스크립트를 다모앙 사이트에 추가해서 여러가지 기능들을 추가할 수 있는데

메모 기능이나, 몇가지 기능들을 추가해서 쓰고 있습니다.

그 중에서 즐겨찾기 기능을 추가해서 소개 드려요.

즐겨찾기에 추가/삭제 기능들도 원래는 사용자 인터페이스를 만들어야 하는데, 정식 기능이 아니라 그냥 소스 코드에 직접 입력하는 방식으로 우선 두겠습니다.


전체 기능은 기존에 작성했던 팁 게시판 글에 업데이트 해 놨습니다.

https://damoang.net/tutorial/397






북마크에 해당하는 소스 코드는 다음과 같습니다.


function initBookmark() {

const bookmark = [

['/free', '모두당'],

['/development', '개발한당'],

['/ai', 'AI당'],

];

var html = `

<div class="dropdown-header">

즐겨찾기

</div>

<div id="sidebar-site-menu" class="mb-3">


`;

for (var i=0; i < bookmark.length; i++) {

var e = bookmark[i];


var itemHtml = `

<div class="nav-item">

<a class="nav-link" href="https://damoang.net/${e[0]}" data-placement="left" target="_self">

<i class="bi-clipboard nav-icon"></i>

<span class="nav-link-title">

[${i+1}] ${e[1]}

</span>

</a>

</div>

`;

html += itemHtml;

}

html += `

</div>

`;

// .na-menu .nav의 첫 번째 자식 요소를 선택합니다.

var firstChild = document.querySelector('.na-menu .nav > :first-child');

firstChild.insertAdjacentHTML('beforebegin', html);


// 단축키 설정

// 기본 도메인 설정

const baseDomain = window.location.origin;

document.addEventListener('keydown', function(event) {

  // 눌린 키에 해당하는 URL 경로를 Map에서 가져옵니다.

  var key = parseInt(event.key);

  

  if (0 < key && key < bookmark.length) {

var path = bookmark[key-1][0];

    window.location.href = `${baseDomain}${path}`;

  }

});

}


$(document).ready(function(){

initBookmark(); // 즐겨찾기 메뉴 추가

});

댓글 (0)

  • 아직 댓글이 없습니다. 첫 댓글을 작성해보세요!

댓글을 작성하려면 이 필요합니다.