워드프레스 포스트 조회수 확인하기

워드프레스 포스트 조회수 확인하기

들어가며 참고한 글 개인적으로 플러그인 사용을 선호하지 않아서, 플러그인 없이 개별 포스트에 카운터를 달 수 있게 작업했습니다. 위 글에 나온 소스를 적용하면, F5 누르면 누를 때마다 조회수가 올라가는 불상사가 벌어지기에, 그 부분만 수정했습니다. functions.php 수정 function getPostViews($postID) { $count_key = 'post_views_count'; $count = get_post_meta($postID, $count_key, true); if ($count == '') { delete_post_meta($postID, $count_key); add_post_meta($postID, $count_key,...
인터넷 익스플로러가 싫어요

인터넷 익스플로러가 싫어요

뭐 사실 인터넷을 제대로 쓰기 시작하면서 단 한 번도 좋아한 적은 없는 브라우저입니다만, 웹을 배우면서는 싫어하는 브라우저가 된 이젠 언급하기도 지치는 익스플로러입니다. 티스토리 스킨 만들던 초창기엔 인터넷 익스플로러는 지원하지 않는다는 문구를 친절히 넣어뒀지만, 어느샌가 그것도 귀찮아 그냥 되건 말건 신경도 안 쓰고 살았습니다. 그래도 티스토리 쓰던 시절엔 jQuery로 짠 소스가 많아서 페이지를 볼 순 있었는데,...
[티스토리] 인기글인지 확인하기

[티스토리] 인기글인지 확인하기

위 사진처럼 카테고리 글 목록, 검색 결과 등 글 목록이 표시되는 모든 부분에서 해당 글이 인기 글인지 확인할 수 있도록 하는 스크립트입니다. 응용하시면 본문에서도 활용 가능합니다. <s_sidebar_element> <!-- 이 블로그 인기글 --> <div class="popularPost"> <h3>이 블로그 인기글 </h3> <ul> <s_rctps_popular_rep> <li> <a href="[##_rctps_rep_link_##]" class="ImSoHot">[##_rctps_rep_title_##]</a> <span class="cnt">[##_rctps_rep_rp_cnt_##]</span> <s_rctps_rep_thumbnail> <img src="[##_rctps_rep_thumbnail_##]"/> </s_rctps_rep_thumbnail> <a href="[##_rctps_rep_category_link_##]">[##_rctps_rep_category_##]</a> </li> </s_rctps_popular_rep> </ul>...
[CSS, 자바스크립트]Material Ripple 효과 구현하기

[CSS, 자바스크립트]Material Ripple 효과 구현하기

요소를 클릭했을 때, 물결(Ripple)이 퍼져 나가는 것 같은 효과를 줄 수 있습니다. HTML <a href="#" class="material-ripple">Click Me!</a> <a href="#" class="material-ripple" data-color="ff99ff">Custom Color</a> 엘리먼트에 material-ripple이란 class만 추가하시면 됩니다. ripple 효과에 특정 색상을 원하시면 data-color이란 속성을 만드신 후에 색상 코드를 추가하시면 됩니다.* 16진수 색상을 이용해주시고, #은 제외하고 넣어주세요. CSS @keyframes materialRipple { 0% { transform: translate(-50%, -50%)...
[CSS] 열리는 문 만들기

[CSS] 열리는 문 만들기

문을 두드려보세요! (닫으실 때도 문을 누르셔야 닫힙니다.) 깃허브 갤러리 정리하다 Knock Knock 티저 보고 생각나 급하게 만들어본 문입니다. ㅋㅋㅋ 문은 3d로 만들어보려다 데스크탑에선 딱 맞췄는데 화면이 작아지니까 입체로 만들려고 덧댄 부분들이 뒤틀리더라고요 ㅠㅠ 이건 시간 내서 제대로 해봐야 하지 않을까 싶습니다. Knock Knock 티저 비디오에서 문 두드리는 소리를 가져왔고, 문도 티저 이미지에서 ?만 잘라내서 사용했습니다....
유튜브 썸네일 추출하기 (JPG, PNG)

유튜브 썸네일 추출하기 (JPG, PNG)

애초에 유튜브 썸네일 확장자는 jpg라 이걸 억지로 png로 바꾸는 게 큰 의미가 있을까 싶긴 하지만, 예전 유튜브 썸네일 추출기를 업데이트해봤습니다. 깃허브 Export 이미지 (JPG, PNG) 사용법 1. 추출하고 싶은 비디오의 링크를 "주소를 입력해주세요"라 적힌 칸에 붙여 넣습니다. 2. "Export" 버튼을 클릭합니다. JPG 3. 추출된 첫 번째 이미지를 우클릭합니다.4. "다른 이름으로 이미지 저장"을 클릭한 후 저장합니다....
190805 블로그 제작 일지

190805 블로그 제작 일지

서버 .htaccess같은 파일은 외부에서 접근 자체를 막는 등 보안과 관련된 작업을 좀 진행했습니다. 워드프레스 테마 확실히 이젠 테마만 쥐고 있기보단 무슨 글을 쓸지 궁리를 해야 할 것 같은데, 마땅히 쓸만한 글이 생각나질 않네요 ㅠㅠ 홈 화면 슬라이더 슬라이더에 애니메이션을 추가했습니다. 예전엔 투명도만 변경되며 슬라이드가 넘어갔는데, 이젠 좌 / 우측으로 넘어다니는 애니메이션이 추가됐습니다. 딱히 쉽지만은 않았는데,...
[CSS] 텍스트 꾸미기

[CSS] 텍스트 꾸미기

TWICE TWICECHAEYOUNG 위 예시처럼 텍스트 배경에 그래디언트를 넣거나 이미지를 넣을 때 사용합니다. #element { -webkit-background-clip: text; color: transparent; } 보이는 것처럼, 꽤 간단하게 사용할 수 있습니다. -webkit-background-clip이지만, Firefox에서도 작동합니다. 텍스트를 선택하면 배경이 변경되니, 위 예시처럼 user-select: none과 함께 사용하시는 걸 추천합니다. 또한, 위 예시처럼 복잡한 이미지를 배경으로 넣으면 굉장히 산만한 효과를 연출할 수 있기 때문에,...
190731 블로그 제작 일지

190731 블로그 제작 일지

눈에 띄지 않는 자질구레한 업데이트가 많습니다. 예전에 적은 팁 중 옮길 게 있는가 확인하려고 티스토리를 들락날락하는 중인데, 속도도 훨씬 빠르고, 렉도 훨씬 덜해서 굉장히 만족스럽네요. ㅎㅎ 헤더에 블로그 제목 추가 PC에선 확인하시기 힘든 업데이트입니다. ㅠㅠ 예전엔 배너가 화면에 보일 땐 헤더가 텅 비어있다. 배너가 사라지면 제목이 헤더 중앙에 나타났는데, 이젠 배너가 화면에 보일 땐 블로그...
910111213
카카오페이 qr코드 모바일이시라면 클릭