안녕하세요, 이번 포스팅은 워드프레스 Visual Link Preview 플러그인 설치 사용 방법 대해서 설명드리도록 하겠습니다. 워드프레스는 기본적인 기능으로는 티스토리나 네이버에서 링크 삽입 시 생기는 사각형의 링크 형성이 되지 않습니다.
물론 HTML과 같은 코드를 통해서 구현을 하는 것은 가능하지만 이 사각형 링크 박스를 손쉽게 구현할 수 있는 플러그인 Visual Link Preview를 소개해드리려고 합니다.
목차
워드프레스 Visual Link Preview 플러그인
: 그럼 먼저 워드프레스 Visual Link Preview 플러그인에 대해서 설명드리도록 하겠습니다. 워드프레스를 막 시작하신 분이라면 SEO 최적화가 잘 이뤄지기 때문에 시작하신 분들이 많을 겁니다.
저 또한 워드프레스를 시작한 것이 자신의 웹사이트를 가지고 싶은 생각도 있고, SEO 최적화가 타 사이트에 비해서 조금은 더 수월할 것이라고 판단하고 워드프레스를 시작하였습니다.
하지만 여러가지 사항에 대해서 공부가 필요한 사항이 많습니다. 그중에 하나가 Internal Link와 Outside Link 첨부 시 티스토리나 네이버에서 구현되는 것처럼 썸네일과 글이 동시에 보여주는 미리 보기 형태로 표현이 되지 않고 글에 링크를 삽입하는 방법만 사용이 가능합니다.
그런데 이것을 구현할 수 있는 플러그인이 바로 Visual Link Preview입니다. 링크를 삽입하게 되면 기존에 삽입한 썸네일과 해당 글에 대한 텍스트가 사각 박스처럼 보이게 됩니다.
물론 플러그인 설정값을 수정하여 원하는 형태로 구현도 가능합니다.
해당 Visual Link Preview 를 통해서 구현할 수 있는 링크로는 Internal, Outside Link 삽입을 조금은 해당 웹사이트를 이용하는 사람들에게 접근도를 높여 주는 장점을 제공합니다.
- Visual Link Preview 구현 가능 링크
- 워드프레스 내 Internal Link 삽입
- 외부 Outside Link 삽입
- 타 상품 홍보 링크 삽입
해당 플러그인은 단축 코드 및 블록을 사용하여 Classic 및 Gutenberg Block Editor와 모두 호환 이용이 가능하다고 합니다.
데이터베이스 조회가 필요하지 않으므로 페이지에 이러한 블록이 많이 있어도 성능에 영향을 주지 않습니다. 단축 코드 및 블록을 사용하여 Classic 및 Gutenberg Block Editor와 모두 호환됩니다.
워드프레스 Visual Link Preview 플러그인 설치 방법
: 그럼 이어서 워드프레스 Visual Link Preview 플러그인 설치 방법 대해서 설명드리도록 하겠습니다. 스텝별로 하나하나 설명드리도록 하겠습니다.
STEP 1 - 먼저 플러그인 메뉴에 접속을 하셔서, "새로 추가" 항목을 선택을 해주셔야 합니다. 그러고 나서 " Visual link preview"를 검색을 해주시면 됩니다.
STEP 2 - 검색하면 아래와 같이 검색이 되시고 해당 플러그인을 설치를 진행해주시면 됩니다. 설치 이후에 활성화도 해주셔야 합니다.
워드프레스 Visual Link Preview 플러그인 사용 방법
: 위에서 설명 드린 대로 Visual Link Preview 플러그인 설치와 활성화를 해주셨다면 해당 플러그인에 "Setting" or "설정" 항목을 클릭해서 "Use Custom Styling" 세팅을 해주셔야 합니다.
기본적으로는 기본 템플릿(Default Template)인 Simple 템플릿이 적용되어 있을 겁니다. 썸네일과 텍스트의 크기와 색상 등을 지정할 수 있으므로 자신이 원하는 방향으로 수정을 해주시면 됩니다.
- 템플릿 기본 수정 가능 사항
- 썸네일 크기
- 텍스트 크기 및 색상
세팅이 마무리가 되셨다면 이제는 실제로 해당 플러그인을 사용해보시면 됩니다. 구텐베르크 편집기를 사용하시는 분들이라면 워드프레스 글쓰기 에디터에서 "+"를 클릭해서 해당 플러그인을 삽입할 수 있습니다.
그리고 고전편집기를 사용하시는 분들이라면 아래와 같이 Visual Link Preview 버튼이 생긴 것을 확인하실 수 있습니다.
두 가지 모두 해당 메뉴를 이용하시면 Visual Link Preview를 선택하고 자신이 원하는 링크를 삽입하실 수 있습니다.
Visual Link Preview 플러그인을 활용한 링크 삽입 방법을 설명 드리도록설명드리도록 하겠습니다. 저는 고전 편집기를 사용하시는 분들 기준으로 설명드리도록 하겠습니다.
STEP 1 - 위에서 설명 드린 대로 생긴 Visual Link Preview 버튼을 누르시면 아래와 같은 메뉴가 활성화가 되는데 Type은 자신의 블로그나 웹사이트에 있는 링크를 불러오는 경우이고, External Link의 경우에는 외부 링크를 적용하는 옵션입니다.
STEP 2 - 그리고 Post는 Internal Link의 경우에는 그냥 키워드로 검색이 가능하고, External Link의 경우에는 URL을 직접 입력을 해주셔야 합니다.
STEP 3 - 위에서 원하는 사항을 선택하고 완료를 하시면 썸네일과 해당 링크의 텍스트가 같이 보이는 사각형 링크 박스가 형성이 되는 걸 확인하실 수 있습니다.
저는 개인적으로 기본형이 좋지만 원하시면 보이는 형태에 대한 Template 도 수정이 가능하니 참조 하시면 좋을 거 같습니다.
이상입니다. 지금까지 워드프레스 Visual Link Preview 플러그인 설치 사용 방법 대해서 포스팅을 작성하였습니다. 제 포스팅을 통해서 워드프레스 운영하시는데 도움이 되셨으면 합니다. 감사합니다.
2021.07.25 - [너도 파워 블로거 될 수 있어 (Power Blogger)/구글 애드센스 (Google Adsense)] - 티스토리 고래 스킨 적용 방법
티스토리 고래스킨 적용 방법
안녕하세요 이번 포스팅은 티스토리에 유명한 스킨인 고래스킨 적용하는 방법에 대해서 작성하도록 하겠습니다. 고래스킨은 무료이면서 검색엔진에 노출을 최적화할 수 있는 스킨입니다. 티스
davey.tistory.com
2021.11.20 - [너도 파워 블로거 될 수 있어 (Power Blogger)/블로그 기초 & 카카오 스토리] - 티스토리 블로그 저품질 원인 탈출 방법
티스토리 블로그 저품질 원인 탈출 방법
안녕하세요, 이번 포스팅은 티스토리 블로그 저품질 원인 탈출 방법에 대해서 작성하도록 하겠습니다. 어느 날 다음의 유입이 급격히 줄고, 다음 포털에서 자신의 티스토리 노출이 되지 않는
davey.tistory.com
2021.03.11 - [너도 파워 블로거 될 수 있어 (Power Blogger)/구글 애드센스 (Google Adsense)] - 구글 애드센스 수익 높이는 방법
구글 애드센스 수익 높이는 방법
이번에 포스팅할 내용은 구글 애드센스의 수익을 높이는 방법에 대해서 포스팅하려고 합니다. 광고의 클릭에 의한 수익(광고단가(CPC) X 총 클릭 횟수)이 주로 이루는 구글 애드센스의 수익에 대
davey.tistory.com
2021.12.09 - [공유 놀이터] - 카카오 뷰 만들기 채널 개설 - 카카오뷰 창작센터
카카오뷰 만들기 채널 개설 - 카카오뷰 창작센터
안녕하세요, 이번 포스팅은 카카오 뷰 만들기 채널 개설 관련해서 작성하도록 하겠습니다. 최근 카카오에서 새로운 서비스를 출시를 했는데 그게 바로 카카오 뷰입니다. 자신이 편집장이 되어
davey.tistory.com
댓글