티스토리 고정 팝업에 이어, 이번에는 워드프레스 고정 팝업 만드는 방법에 대해서 알려드리겠습니다.
방식은 굉장히 비슷하지만, 코드 형태를 조금 바꿔야 하는 부분이 있기 때문에 잘 따라오시기를 바랍니다.
워드프레스 고정 팝업 버튼 만드는 방법
워드프레스 관라자 페이지에 접속합니다. 모양 탭 or 외모 탭에서 사용자 정의로 들어가고 추가 CSS 탭으로 들어갑니다.
그럼 위 메모장에 있는 코드를 복사해서 발행함 버튼을 누르시면 일단은 CSS 입력은 끝났습니다.
워드프레스 고정 팝업 생성하는 방법
워드프레스는 클래식 편집기 말고, 기본 제공되는 편집기를 통해 작성하였습니다.
가장 모양탭에서 패턴으로 들어갑니다. 그리고 새 패턴 추가 버튼을 누릅니다.
그럼 이렇게 패턴을 생성할 수 있게 나오고
워드프레스 HTML 코드를 다운 받은 후 안에 든 코드를 입력해 저장해줍니다.
그리고 글 발행을 통해 팝업 버튼을 누르면, 만들었던 패턴이 생성되고, 아래처럼 코드가 들어갑니다.
target은 url이며, 한글로 된 이 전 글로 이동은 원하시는 url의 제목을 작성하면 됩니다.
그리고 티스토리와 동일하게, 글 가장 하단 부분에 생성시켜서 적용시키면 됩니다. 또한, 본문에는 적용이 되지 않은 것처럼 보일 텐데요.
글을 발행하거나 미리보기를 통해서만 고정 팝업이 생성됩니다.
이상으로 워드프레스 고정 팝업 버튼 만드는 방법에 대해서 알아봤습니다.
텍스트가 본문에 남는 게 마음에 들지 않으신 분들은, 글자색을 배경색과 맞추면 됩니다. 저는 흰색이라 흰색으로 맞췄습니다.
감사합니다. 많은 도움이 되었으면 좋겠네요.