코네(kone.gg) 개념순(빨간 따봉만) 모아보기 사용설명서
1. 준비물

PC 크롬(Chrome) 브라우저 권장

확장 프로그램 Tampermonkey 설치

크롬 웹스토어에서 “Tampermonkey” 검색 후 설치

2. 가장 중요한 선행 설정(필수)

Tampermonkey는 크롬 설정에 따라 유저스크립트 인젝션이 막힐 수 있습니다. 아래 설정을 먼저 켜 주세요.

2-1) 크롬 “개발자 모드” 켜기

주소창에 입력: chrome://extensions/

우측 상단의 개발자 모드(Developer mode) 를 ON

완료

이 설정이 꺼져 있으면 스크립트가 실행되지 않거나, Tampermonkey 상단에 “개발자 모드를 켜라”는 배너가 뜹니다.

2-2) Tampermonkey 사이트 권한 확인(필요 시)

chrome://extensions/ → Tampermonkey 선택

사이트 액세스에서 kone.gg가 허용되도록 설정

보통 “특정 사이트에서 허용” 또는 “모든 사이트에서 허용” 중 하나로 해결됩니다.

3. 스크립트 설치 방법

3-1) Tampermonkey 대시보드 열기

브라우저 오른쪽 위 Tampermonkey 아이콘 클릭 → 대시보드(Dashboard)

3-2) 새 스크립트 만들기 “새 스크립트 추가(Create a new script)” 클릭

에디터에 있는 기본 내용을 전부 삭제

아래 스크립트를 전체 복사해서 붙여넣기

저장(Ctrl+S) 이미 예전에 다른 버전(v1.1~v1.3 등)을 설치했다면, 기존 스크립트는 OFF(비활성화) 하거나 삭제하고 v1.4 하나만 남기는 것을 권장합니다.

// ==UserScript== // @name kone.gg /s/all - 개념순(빨간따봉만) v1.4 (stable + auto paging) // @namespace kone-concept-sort // @version 1.4.0 // @description 드롭다운 DOM을 건드리지 않고, 개념글(빨간 따봉)만 표시 + 하단 도달 시 다음페이지 자동 로드 // @match https://kone.gg/s/all* // @match https://www.kone.gg/s/all* // @run-at document-idle // @grant GM_addStyle // ==/UserScript== (function () { 'use strict'; const KEY = 'tm_kone_concept_mode_v14'; const LOG = '[TM 개념순 v1.4]'; GM_addStyle(` .tm-concept-hidden { display:none !important; } .tm-concept-fab { position: fixed; left: 20px; top: 140px; z-index: 2147483647; padding: 10px 12px; border: 1px solid rgba(0,0,0,.12); border-radius: 12px; background: rgba(255,255,255,.95); backdrop-filter: blur(6px); font-size: 13px; cursor: pointer; user-select: none; box-shadow: 0 6px 20px rgba(0,0,0,.08); } .tm-concept-fab strong { font-weight: 700; } `); const log = (...a) => console.log(LOG, ...a); const safe = (fn) => (...args) => { try { return fn(...args); } catch (e) { console.error(LOG, e); } }; const debounce = (fn, ms=150) => { let t; return (...args) => { clearTimeout(t); t = setTimeout(()=>fn(...args), ms); }; }; function isOn() { return localStorage.getItem(KEY) === '1'; } function setOn(v) { localStorage.setItem(KEY, v ? '1' : '0'); } function getCardRoots() { const anchors = Array.from(document.querySelectorAll('a[href^="/s/"]')) .filter(a => a.getAttribute('href') && a.getAttribute('href').length > 3); const candidates = anchors.filter(a => a.hasAttribute('title')); const use = candidates.length ? candidates : anchors; const roots = new Set(); for (const a of use) roots.add(a.closest('div.relative') || a.parentElement || a); return Array.from(roots); } function parseRGB(s) { const m = String(s).match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/i); if (!m) return null; return [parseInt(m[1],10), parseInt(m[2],10), parseInt(m[3],10)]; } function isConceptCard(cardRoot) { const svg = cardRoot.querySelector('svg.lucide-thumbs-up'); if (!svg) return false; const badge = svg.closest('div') || svg.parentElement; const text = (badge?.textContent || '').trim(); const n = parseInt(text.replace(/[^\d]/g, ''), 10); if (!Number.isFinite(n) || n <= 0) return false; const cls = (badge?.className || '') + ' ' + (badge?.closest('[class*="text-red"]')?.className || ''); if (/text-red|dark:text-red|text-shadow-red|red-/.test(cls)) return true; const c = badge ? getComputedStyle(badge).color : ''; const rgb = parseRGB(c); if (!rgb) return false; const [r,g,b] = rgb; return (r >= 160 && g <= 120 && b <= 120); } const applyFilter = debounce(safe(() => { const cards = getCardRoots(); if (!isOn()) { for (const c of cards) c.classList.remove('tm-concept-hidden'); return; } let kept = 0; for (const c of cards) { const keep = isConceptCard(c); c.classList.toggle('tm-concept-hidden', !keep); if (keep) kept++; } log('필터 적용:', kept, '/', cards.length); }), 120); function findNextButton() { const els = Array.from(document.querySelectorAll('button, a')); const next = els.find(el => (el.textContent || '').trim() === '>' && !el.disabled); return next || null; } let loadingNext = false; async function gotoNextPageIfNeeded() { if (!isOn() || loadingNext) return; const nearBottom = (window.innerHeight + window.scrollY) >= (document.body.scrollHeight - 250); if (!nearBottom) return; const next = findNextButton(); if (!next) return; loadingNext = true; log('다음 페이지 이동 시도'); const beforeFirst = (document.querySelector('a[href^="/s/"][title]')?.getAttribute('href')) || ''; next.click(); const start = Date.now(); while (Date.now() - start < 3000) { await new Promise(r => setTimeout(r, 100)); const afterFirst = (document.querySelector('a[href^="/s/"][title]')?.getAttribute('href')) || ''; if (afterFirst && afterFirst !== beforeFirst) break; } applyFilter(); loadingNext = false; } function mountFAB() { let fab = document.querySelector('.tm-concept-fab'); if (fab) return fab; fab = document.createElement('div'); fab.className = 'tm-concept-fab'; const render = () => { fab.innerHTML = `개념순: <strong>${isOn() ? 'ON' : 'OFF'}</strong><div style="opacity:.7;margin-top:4px;">(빨간 따봉만)</div>`; }; render(); fab.addEventListener('click', () => { setOn(!isOn()); render(); applyFilter(); log('토글:', isOn() ? 'ON' : 'OFF'); }); document.body.appendChild(fab); return fab; } const mo = new MutationObserver(safe(() => { if (isOn()) applyFilter(); })); mo.observe(document.documentElement, { childList: true, subtree: true }); window.addEventListener('scroll', debounce(gotoNextPageIfNeeded, 120), { passive: true }); window.addEventListener('resize', debounce(gotoNextPageIfNeeded, 120), { passive: true }); log('로드됨'); mountFAB(); if (isOn()) applyFilter(); })();

5. 사용 방법

https://kone.gg/s/all 접속 화면 왼쪽(상단 근처)에 “개념순: ON/OFF” 버튼이 생깁니다.

버튼을 눌러 ON으로 바꾸면: 빨간 따봉(추천) 표시된 글만 화면에 남고 나머지 글은 자동으로 숨겨집니다.

아래로 계속 스크롤하면: 페이지 하단 근처에서 자동으로 **다음 페이지(>)**를 눌러 예전 개념글까지 계속 이어서 불러옵니다.

6. 자주 발생하는 문제 해결

Q1) 버튼이 안 보이거나 아무 반응이 없어요 크롬 chrome://extensions/에서 개발자 모드 ON 확인 Tampermonkey에서 스크립트가 Enabled(켜짐) 인지 확인 사이트 주소가 kone.gg/s/all 인지 확인

Q2) 누르면 사이트가 “Application error”로 죽어요 기존에 설치한 다른 개념순 스크립트(v1.1~v1.3)가 같이 켜져 있을 가능성이 큽니다. Tampermonkey에서 예전 스크립트는 모두 OFF 하고, v1.4 하나만 켜세요.

Q3) “개념글”인데도 숨겨져요 / 개념글이 아닌데 남아요 사이트에서 “빨간 따봉” 표시 방식이 바뀌면 판별 기준이 달라질 수 있습니다. 이 경우 개발자도구에서 따봉 영역의 HTML/CSS(색상/클래스)를 확인해 판별 로직을 업데이트해야 합니다. 7. 안전/주의 사항 이 스크립트는 브라우저에서만 동작합니다(서버/계정에 영향을 주지 않음). 페이지를 자동으로 넘기므로, 오래 두면 많은 페이지를 탐색할 수 있습니다(브라우저 리소스 사용 증가 가능).

게시물 50개로 불러들이면 편하다.

친절하지는 않지만 그냥 끄적여본다.