티스토리 라이트박스 제거 후 디자인 꾸미기

티스토리 블로그를 운영하시는 여러분들께 소중한 정보를 전달해드립니다. 이번 글에서는 미니멀 디자인을 추구하는 사용자들을 위해, 티스토리 라이트박스를 제거하고 꾸미는 방법에 대해 적어봅니다.

티스토리 라이트박스 란?

티스토리 라이트박스는 티스토리 블로그에서 이미지를 확대하여 보여주는 기능입니다. 사용자가 작성한 글에 포함된 이미지를 클릭하면, 해당 이미지가 팝업 형태로 화면에 크게 나타납니다. 이렇게 확대된 이미지는 원본 크기와 세부 사항을 더욱 선명하게 보여 주는 역할을 합니다.

1. 라이트박스 제거하기

<script>
document.addEventListener("DOMContentLoaded", function() {
  var s=document.getElementsByTagName("span");
  for (var i = 0; i < s.length; i++) { s[i].removeAttribute('data-lightbox'); }
});
</script>

Source:
Delete data-lightbox by devjit.tistory.com

2. 라이트박스 새로 꾸미기

변경 전:

크게 보려면 사진을 클릭👆

변경 후:

만약 ▶️ 만 보일 때는 여기를 클릭해서 보면 됨. 클릭 한 번으로 이미지를 확대하여 자세히 관찰할 수 있어 사용자들의 경험을 향상시켜 줌.

3. 스킨 설정 변경법

---