워드프레스

워드프레스 필수 플러그인 4종(무조건 설치)

워드프레스 필수 플러그인 4종으로 보안, 성능 향상, SEO 최적화, 백업등 워드프레스 설치 후 무조건적으로 설치해야 하는 추천 플러그인 4가지를 간단하게 요약해 정리해 보았습니다. 워드프레스 필수 플러그인 4종 아래 4가지 플러그인은 워드프레스 설치 후 필수적으로 설치하는 것을 권해드립니다. 보안 관련 플러그인 SEO 최적화 플러그인 성능 향상(캐시 관련) 플러그인 백업 플러그인 워드프레스 보안 관련 플러그인 워드프레스 오픈 소스로 전 세계에서 가장 많은 사람들이 블로그 또는 웹사이트로 이용하고 있는 만큼 보안 취약점이 존재합니다. 워드프레스는 티스토리와 다르게 사용자가 직접 보안 관리를 해주어야 하는데요. 이를 해결하기 위해서 워드프레스 보안 플러그인으로 Wordfence Security, iThemes Security, Sucuri Security 등이 있습니다. 이 중 'Wordfence Security'가 가장 인기가 많고 많은 사용자를 보유하고 있으며 워드프레스 보안 유지를 위해 다양한 기능을 제공하고 있습니다. Wordfence Security의 주요 기능 Wordfence Security는 방화벽을 통해 웹사이트를 보호하고, 악성 코드나 해킹 시도를 차단하며 웹사이트 내에 존재하는 멀웨어를 검사해 제거합니다. 그리고 실시간 모니터링해 비정상적인 로그인 시도를 차단하고 해킹 시도나 보안 이슈를 즉시 탐지하며 보안 이슈 발생 시…

2023-02-27
자바스크립트-스크롤-맨-위로-가기-버튼

자바스크립트 스크롤 맨 위로 가기 버튼(부드럽게)

자바스크립트 스크롤 맨 위로 가기 버튼, 페이지 중간 또는 하단에서 버튼을 클릭하면 스크롤을 맨 위로 이동시키는 간단한 코드로 window.scrollTo() 메서드를 사용했으며 부드러운 이동을 위해 window.requestAnimationFrame() 메서드를 이용했습니다. 스크롤 맨 위로 가기 버튼 1. html페이지에 아래와 같이 버튼 요소를 추가합니다. <button onclick="backToTop()" id="btn-back-to-top" title="위로 가기">Top</button> 2. CSS파일에 아래 스타일 코드를 입력합니다. #btn-back-to-top { display: none; position: fixed; bottom: 20px; right: 30px; z-index: 9999; border: none; outline: none; background-color: #555; color: white; cursor: pointer; padding: 15px; border-radius: 10px; } #btn-back-to-top:hover { background-color: #333; } 3. 마지막으로 아래 코드를 자바스크립트 파일에 추가해 줍니다. // 스크롤 이벤트 리스너 window.addEventListener('scroll', () => { // 스크롤 위치가 100px 이상일 때 위로 가기 버튼을 보이게 함 if ( document.body.scrollTop > 100 || document.documentElement.scrollTop > 20 ) { document.getElementById('btn-back-to-top').style.display = 'block'; } else { document.getElementById('btn-back-to-top').style.display = 'none'; } }); // 클릭 시 페이지 맨 위로 스크롤 (애니메이션 효과 추가) function backToTop() { const position = document.documentElement.scrollTop || document.body.scrollTop;…

2023-02-20
구글 블로그 제목 태그

구글 블로거 포스팅 제목 태그 h1로 수정하기

구글 블로거 포스팅 제목 태그를 h1로 수정하고 블로그 제목은 메인 홈에서는 h1태그 유지 포스팅이 있는 페이지에서는 div태그로 변경합니다. TIP 아래 설명은 블로거 테마에 따라 다를 수 있으며 해당 내용은 기본 테마 중 "Essential"를 기준으로 작성되었습니다. 블로거에서 제공하는 기본 테마(구형제외)들은 거의 대동소이하니 참고하시길 바랍니다. 구글 블로거 포스팅 제목 태그 포스팅 제목 태그부터 수정해 보도록 하겠습니다. 관리자 페이지로 접속해 메뉴 중 "테마"를 선택합니다. 그리고 "맞춤설정"을 클릭 후 "백업"부터 하고 아래 "HTML편집"을 선택해 줍니다. "HTML편집" 페이지로 이동되면 단축키 "Control + F"키를 누른 후 post-title entry-title를 입력해 찾아줍니다. 대략 줄번호 3866번째 줄에 있으니 참고하세요. 아래 원본 코드를 다음 코드로 수정합니다. <h3 class='post-title entry-title'> <!-- 중략 --> </h3> 수정할 코드 <b:tag expr:name='data:view.isSingleItem ? "h1" : "h3"' class='post-title entry-title'> <!-- 중략 --> </b:tag> 최종적으로 변경된 코드는 아래 이미지와 같습니다. 구글 블로거 블로그 제목 태그 블로그 제목 태그도 수정하도록 하겠습니다. 블로그 제목 태그는 홈(메인) 페이지에서는 h1태그를 그대로 유지하고 포스팅이 있는 페이지에서만 div태그로 변경해 h1태그가 2개가(중복) 되는 것을…

2023-01-10