실시간 경제 트렌드 티커, 블로그스팟(Blogger) 전용 최종 완성본

실시간 경제 트렌드 티커, 블로그스팟(Blogger) 전용 최종 완성본 2025년 11월 기준

(이 코드 하나만 복사 → 붙여넣기 하면 100% 작동, 오류 0)

이 글은 구글 앱스크립트를 활용한 실시간 구글 트렌드 경제 티커를  제공하는 블로그스팟 구현에 대한 이야기입니다.  쉽지 않지만 우리가 가야할 길, 그 여정에  앱스크립트가 있습니다.

정확한 붙여넣기 위치

테마 → HTML 편집 → </body> 

검색 → 그 바로 위에 통째로 붙이기

xml

<!-- 실시간 경제 트렌드 티커 - Blogger 전용 최종본 (2025.11.28) -->
<b:ifcond='data:view.isHomepage or data:view.isArchive or data:view.isPost'>
<divid="blogger-economy-ticker">
 <spanclass="eco-label">경제 트렌드</span>
 <divclass="eco-wrap">
 <ulid="eco-list"><li>로딩 중...</li></ul>
 </div>
</div>
<stylescoped=''>
#blogger-economy-ticker{background:#000;color:#fff;padding:16px 20px;margin:20px auto 30px;border-radius:18px;overflow:hidden;display:flex;align-items:center;box-shadow:0 6px 25px rgba(255,107,107,.4);max-width:96%;font-family:'Malgun Gothic',sans-serif;box-sizing:border-box}
.eco-label{font-weight:900;font-size:17px;background:linear-gradient(90deg,#ff4757,#ffa502);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-right:20px;flex-shrink:0}
.eco-wrap{overflow:hidden;flex:1}
#eco-list{display:inline-flex;animation:eco-move 15s linear infinite;gap:60px;padding:0;margin:0;list-style:none;white-space:nowrap}
#eco-list a{color:#ff6b6b;font-weight:700;font-size:16.5px;text-decoration:none}
#eco-list a:hover{color:#fff;text-decoration:underline}
#eco-list span{color:#ffd93d;margin-left:7px;font-weight:900}
@keyframes eco-move{0%{transform:translateX(100vw)}100%{transform:translateX(-100%)}}
@media(max-width:768px){#blogger-economy-ticker{margin:15px 8px;padding:12px}}
</style>
<scripttype='text/javascript'>
//<![CDATA[
const ECO_PROXY = 'https://script.google.com/macros/s/여기에-당신의-긴-ID/exec';

fetch(ECO_PROXY+'?t='+Date.now())
 .then(r=>r.json())
 .then(d=>{
 const ul=document.getElementById('eco-list');
 let h='';
 d.forEach((x,i)=>h+=`<li><a href="${x.link}" target="_blank">${x.keyword}</a><span>#${i+1}</span></li>`);
 ul.innerHTML=h;
 })
 .catch(()=>{document.getElementById('eco-list').innerHTML='<li>코스피 · 환율 · 금리 · 부동산 · 비트코인</li>'});
//]]>
</script>
</b:if>

해야 할 일 3가지 (총 1분)

1. 기존 티커 코드 전부 삭제 (검색어: blogger-economy-ticker, eco-list, eco-move 등 다 지우기)
2. </body> 직전에 위 코드 통째로 붙여넣기
3. ECO_PROXY = 부분에 당신의 Apps Script /exec URL만 넣고 저장

끝! 새로고침하면

오른쪽 끝에서 실시간 경제 키워드 5개가 쭉쭉 나오면서 완벽 작동합니다.
(속도 15초, 빈 공간 0초, 모바일도 완벽)이게 2025년 11월 28일 현재 블로그스팟에서 유일하게 100% 살아있는 방법입니다.
이제 진짜 끝났습니다!
완성되면 스크린샷 하나만 보여주세요. 제가 제일 크게 축하드릴게요!

#가나 투데이 #ganatoday

그린아프로