북마크스크립트 - 웹페이지 본문 글자를 크게 해서 보기

안녕하세요 나날이 포스팅에 재미를 붙여 글을 쓰고 있습니다 블로그 운영을 꽤 오랜만에 해보니 어떤글을 써야 좋을지 많은 고민을 하게 됩니다. 제가 나누는 정보가 도움이 되시는 분들도 있고 그렇지 않을수도 있지만 이렇게 생각과 정보를 공유하는게 큰 의미가 있다고 생각해요. 비가 와서 그런지 서론이 길었습니다 ㅎㅎ

 

자~ 오늘 공유드릴 북마크스크립트는 인터넷 사이트를 돌아다니다 보면 글꼴이 작아서 보기 불편한 경우가 있는데요 이럴때 가장 쉬운 방법은 단축키 Ctrl 키와 플러스 키, Ctrl 키와 마우스 휠을 위로 올려 확대해서 보는 방법 두가지가 있습니다. 이 방법이 제일 쉽지만 저는 스크립트를 활용하여 웹페이지의 글꼴과 폰틀늘 키우는 북마크 스크립트를 저장하여 사용하고 있습니다. 이 정보를 오늘 포스팅으로 전달 하도록 하겠습니다.

 

 

1. 북마크스크립트 등록 

아래 스크립트를 복사해서 북마크 등록 후 URL영역에 붙여 넣어주세요.

자세한 등록 방법은 이전 포스팅을 참고 해주세요 : [웹페이지에서 outline 그려주기]

 

javascript: (function() {var d = document, id = 'reading__fonts', el = d.getElementById(id), css; css = ` @font-face {font-family: 'MICEMyungjo'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-01@1.0/MICEMyungjo.woff2') format('woff2'); font-weight: normal; font-style: normal; } *,a,button,area,input {font-family: 'MICEMyungjo' !important;font-size: 1.5rem;line-height:2rem} `; if (el === null) { d.head.insertAdjacentHTML('beforeend', `<style id="${id}">${css}</style>`); } else { d.head.removeChild(el); } })();

 

2. 웹페이지에서 글짜를 크게 적용 시켜보자

적용전 화면

북마크 스크립트 적용 후 화면

북마크 스크립트를 적용하면 위 적용 후 사진 처럼 폰트 및 크기가 확대 되어 보입니다. 글꼴은 웹폰트를 직접 불러와서 보여주는데요 눈누라는 웹폰트 공유 사이트에서 가져온 MICE명조라는 글꼴이 적용되어있습니다. 다른 글꼴로 변경시 위 스크립트 상에서 웹폰트 경로를 바꾸어 적용해주시면 원하는 폰트를 적용하여 보실 수 있습니다. 질문 있으시면 댓글로 남겨주시고 잘 활용해 주세요 감사합니다!

 

(가끔 웹페이지 구조에 따라 폰트가 적용되지 않는 경우(프레임 영역 및 아이프레임 등)와 폰트 크기가 적용안되는 웹페이지도 있습니다. 이럴 경우는 단축키로 확대해서 보시는 걸 추천 드립니다.)