• 워드프레스 글 본문 이미지가 사용자 화면에서 출력되지 않는 경우가 있습니다

    한 클라이언트로부터 다음과 같은 요청이 왔습니다. 워드프레스에서 새 글을 작성하고, 이미지를 추가 하였습니다. 글 작성 완료 후 공개하기를 했는데, 관리자 화면에서는 이미지가 잘 보이는데 사용자 화면에서는 이미지가 보이지 않습니다. 도대체 무슨 문제인가요? 그래서 먼저 다음과 같이 글 작성 완료된 화면을 살펴 보았습니다. 다른 글과 차이점을 찾지 못해 이 글을 다음과 같이 사용자 화면에서 보았습니다. 위 그림처럼 정말 이미지가 보이지 않더군요. 처음에는 단순히 이미지 경로가 잘못 되었나보다 생각하고 워드프레스 관리자 화면에서 이미지 경로를 확인해 보았는데, 이 문제는 아니었습니다. 혹시 파일명이나 파일 용량 문제인가 확인해 보았지만, 역시 이 문제도 아니었습니다. 그래서 실제 사용자 화면에서 이미지 경로가 어떻게 표시되는지 확인해 보았습니다. 그랬더니 위 그림의 이미지 src처럼 도메인 앞(hif.co.kr)에 i2.wp.com 이라는 정체를 알 수 없는 URL이 추가된 것을 확인할 수 있었습니다. 도대체 이 코드가 어떻게 들어간 것인지 도무지 알 수가 없었습니다. 혹시 […]

  • 온세게시판에 네이버 동영상 올리는 방법

    온세게시판(BBS e-Board Pro)을 설치해서 워드프레스 홈페이지 제작을 한 경우가 있었는데, 그 업체로부터 온세게시판에 네이버 동영상을 올리는 방법을 알려 달라는 요청이 있어 이 글에 정리해 보았습니다. 1. 네이버 동영상 코드 복사 다음과 같이 네이버 동영상이 있는 페이지를 방문합니다. 위 그림의 붉은색 동그라미가 위치해 있는 아이콘을 클릭하면 그 아래에 창이 나타납니다. 그 창에 있는 옵션 중 코드 복사 input box 끝에 있는 [복사] 버튼을 누릅니다. 그러면 해당 코드가 복사 됩니다. 2. 온세게시판에 복사한 코드 추가 다음은 복사한 코드를 온세게시판에 추가하는 것을 알아 보겠습니다. 이 작업은 온세게시판의 글쓰기 화면에서 수행해야 하기 때문에 다음과 같이 글쓰기 화면에서 진행하도록 하겠습니다. 위 그림은 온세게시판의 에디터 설정을 워드프레스 내장 에디터로 선택한 화면입니다. 이 경우 워드프레스 내장 에디터 화면에서 글 작성을 할 수 있는데, 동영상 코드를 추가할 때는 [비주얼] 모드 대신 [텍스트] 모드을 […]

  • 워드프레스 4.2.x 멀티 사이트에서 사이트 추가 되지 않는 문제 발생

    최신 버전인 워드프레스 4.2.x에서 멀티 사이트 설정 후, 네트워크 관리자에서 사이트 추가를 시도하면 서브 사이트의 테이블이 생성되지 않는 문제가 있습니다. 네트워크 관리자에서 새로운 사이트 추가 위 그림에서 [사이트 추가] 버튼을 누르면 다음과 같은 화면이 나타납니다. 위 그림처럼 blank 화면이 나타납니다. 다시 네트워크 관리자 화면에서 사이트 설정 화면을 확인해 보면 다음과 같습니다. 위 그림처럼 사이트가 추가 되었다고 나오지만, 위 화면 왼쪽 메뉴를 보면 서브 사이트가 정상적으로 추가되지 않은 것을 확인할 수 있습니다. 현재 상태에서 DB 테이블을 살펴보면 다음과 같습니다. 위 그림의 테이블을 보면, 보통 서브 사이트 추가 시 생성되는 테이블들(보통 wp_2_options로 생성되는)이 보이지 않고, 테이터 정렬 방식이 utf8mb4_general_ci 로 된 것을 확인할 수 있습니다. DB 설정이 기존과 달라 좀 찾아 보았더니 워드프레스 4.2.2 에서 기본언어셋이 utf8 -> utf8mb4 로 변경 되었다는 것을 알 수 […]

  • www 없이 설치된 워드프레스 멀티사이트 도메인에 www 추가하는 방법

    www 없이 설치된 워드프레스 멀티사이트 도메인(http://mydomain.com)에 www를 추가(http://www.mydomain.com)하는 방법을 알아 보겠습니다. 추가 방법은 다음과 같습니다. 진행에 앞서 만일을 위해 DB를 백업할 것을 권장합니다. 1. wp-config.php 파일 수정 수정 전 define(‘DOMAIN_CURRENT_SITE’, ‘mydomain.com’); 수정 후: define(‘DOMAIN_CURRENT_SITE’, ‘www.mydomain.com’); 2. Search Replace DB script 다운로드, 압축 해제, 업로드 이 작업을 위해 Search Replace DB 스크립트가 필요합니다. 이 스크립트는 다음 URL에서 다운로드 받을 수 있습니다. https://interconnectit.com/products/search-and-replace-for-wordpress-databases/ * 주의 Search Replace DB 스크립트는 2015년 5월 현재 V 3.0.0 BETA와 V 2.1.0 STABLE 버전이 있는데, 하단 내용은 V 2.1.0 STABLE 버전을 기준으로 작성 되었습니다. 이 스크립트를 다운로드 받고 압축 해제 한 다음, FTP 프로그램을 이용하여 다음과 같이 wp-config.php 파일이 위치한 PATH에 업로드 합니다. 업로드 완료된 결과는 다음과 같습니다. 3. Search Replace DB script 실행 웹 브라우저에 http://mydomain.com/searchreplacedb2.php 을 입력한 다음, 다음 단계를 […]

  • 반응형 홈페이지에 맞추어 출력되는 동영상 삽입하기

    Advanced Responsive Video Embedder 라는 플러그인은 유튜브나 Vimeo 동영상 삽입을 위한 플러그인입니다. 예제 보기 : http://makebct.cafe24.com/?p=188 1. 유튜브 공유-소스코드로 동영상 삽입하기 기존 유튜브의 ‘공유’ 기능을 통해 아래와 같은 코드를 본문에 작성하여 동영상을 삽입해 왔습니다.

    2. Advanced Responsive Video Embedder 플러그인으로 동영상 삽입하기 [새 글 쓰기]를 클릭하여 글 작성창에 보면 아래와 같이 ‘Advanced Responsive Video Embedder’ 플러그인의 [Embed Video]라는 버튼이 보입니다. 동영상을 삽입할 위치에 커서를 위치시킨 후, [Embed Video] 버튼을 클릭하면 다음과 같은 동영상 삽입 창이 보여지고, 다음 그림에 보이는 것과 같이 원하시는 동영상의 주소를 입력하고 나머지 항목을 입력합니다. 동영상이 있는 페이지의 웹주소창의 주소를 입력해도 되고, 공유에서 지원하는 짧은 주소를 입력해도 됩니다. 3. 동영상 출력 위의 두 가지 방법으로 동영상을 본문에 삽입하였을 경우 아래의 그림과 같이 별 차이가 없어 보입니다. 하지만 모바일 환경에서 보면 다릅니다. 유튜브의 ‘공유’ 코드를 이용해 삽입된 동영상의 경우 세로 […]

  • 워드프레스 멀티사이트를 운영중 이었는데, 자동 업데이트 되면서 사이트 접속이 안됩니다

    워드프레스 멀티사이트를 운영중인데, 자동 업데이트 되면서 사이트 접속이 안 되는 문제가 있다고 해결 요청이 왔습니다. 접속이 막힌 경우 다음과 같은 메시지가 출력됩니다. 참고로 국문 사이트의 경우는 ”이 사이트는 보관되었거나 정지되었습니다.” 메시지가 출력됩니다. 이 때 가장 빠르게 해결하는 방법은 다음과 같이 직접 DB 단에서 수정하는 것입니다. 위 그림에서 archived 필드가 보이는데, 사이트 접속이 되지 않은 경우 1이 설정되고, 정상적인 경우 0으로 설정됩니다. 즉, 위 그림은 멀티사이트 접속 문제를 해결한 상태이기 때문에 모두 0으로 표시된 것이고, 처음 상태는 모두 1이었습니다.

  • 모바일 웹테스트 서비스 – Troy

    다음(DAUM)에서 만든 기기별 모바일 웹테스트 서비스 트로이를 소개합니다. TROY Responsive Web test라는 제목으로 서비스되고 있으며, 국내에서 많이 쓰이는 모바일 기기를 위주로 다양한 모바일 기기에서 웹사이트가 어떻게 출력되는지 테스트해 볼 수 있습니다. http://troy.labs.daum.net

  • 1000개의 무료 벡터 아이콘세트

    무려 1000개에 달하는 벡터 기반의 무료 아이콘 세트를 소개합니다. PNG, EPS, AI 파일로 제공됩니다. http://sixrevisions.com/freebies/icons/free-icons-1000/

위로이동