워드프레스 아바다 테마에서 메뉴 로딩 시 메뉴가 깨진 것처럼 보이다가 로딩되는 경우가 있습니다. 사이트 속도가 느린 경우, 특히 모바일에서 이런 현상이 두드러질 수 있습니다. 이러한 문제가 발생하는 경우 확인 사항에 대해 살펴보겠습니다. 워드프레스 아바다 테마의 메뉴 로딩 시 오류가 발생하는 경우 대처 방법 Avada 테마는 10년 동안 판매 1위를 기록하고 있는 베스트셀링 워드프레스 테마로서 현재까지 82만 개 이상이 판매되었습니다. 다국어 테마의 효시인 아바다는 많은 기능을 탑재하고 있어 최적화를 제대로 하지 않으면 사이트가 무거워질 수 있습니다. 아바다 테마로 만든 사이트에서 메뉴가 느리게 로드되면서 특히 모바일에서 메뉴가 깨져 보인 후에 정상적으로 표시되는 문제가 발생할 수 있습니다. 캐시 플러그..

워드프레스에서 기본 에디터인 블록 에디터(구텐베르크)를 사용하여 글을 작성할 때 소제목(헤딩)을 활용하면 독자들이 읽기에 편하기 때문에 SEO에도 유리하게 작용할 수 있습니다. 헤딩 태그를 사용하여 글을 작성한 경우 목차(TOC) 플러그인을 설치하면 자동으로 목차가 생성됩니다. 헤딩 스타일은 테마마다 조금씩 다르지만, 간단한 CSS로 소제목 스타일을 변경할 수 있습니다. 이 블로그에서 워드프레스 소제목 스타일을 변경하는 방법에 대한 글을 작성한 적이 있습니다. 이 글에서는 다음과 같은 헤딩 스타일을 만드는 방법에 대해 살펴보겠습니다. 아스트라, OceanWP, 제너레이트프레스 테마를 기준으로 설명했지만 다른 워드프레스 테마에서도 적용이 가능합니다. 워드프레스 Astra, OceanWP, GenerateP..

워드프레스 테마와 플러그인, 각종 웹사이트 템플릿, 그래픽 파일과 동영상 템플릿, 뮤지 파일 등을 디지털 자산을 판매하는 엔바토 마켓(Envato Market)에서 매월 각 마켓에서 한 항목을 선정하여 무료로 다운로드하도록 제공하고 있습니다. 그래픽 파일을 판매하는 그래픽리버(graphicriver)에서 미니멀 플랫 인물 아이콘 세트를 8월 한 달 동안 무료로 다운로드할 수 있습니다. 미니멀 플랫 인물 아이콘 세트 무료 다운로드 (Minimalistic Flat Persons Icons Set 1) 이 플랫 아이콘 세트에는 18개의 아이콘이 포함되어 있으며 원형 아이콘과 둥근 모서리로 된 아이콘, 두 종류가 있습니다. Download it for free! 버튼을 클릭하여 zip 파일을 다운로드할 수 있..

무료 구글 클라우드 구글 f1-micro 인스턴스의 경우 메모리가 0.6GB(정확히는 581MB)에 불과하므로 쉽게 메모리가 소진될 수 있습니다. 만약의 사태에 대비하여 스왑 메모리를 추가할 수 있습니다. 스왑 공간(Swap space)이란 리눅스에서 시스템 또는 서버의 물리적 메모리(RAM)의 용량이 가득 차게 될 경우 사용되는 가상 메모리 공간을 말합니다. 무료 구글 클라우드 f1-micro 인스턴스에서 스왑 메모리 추가하기 구글 클라우드 무료 인스턴스를 사용하는 경우 다음 명령을 실행하여 스왑 공간을 추가할 수 있습니다. sudo fallocate -l 1G /swapfile sudo chmod 600 /swapfile sudo mkswap /swapfile sudo swapon /swapfile ..

저는 약 7년 동안 TV 없이 살다가 몇 년 전 가족들의 성화에 못 이겨 TV를 구입하고 올레TV를 신청하여 이용해 오고 있습니다. TV 없이 7년을 살다 TV를 없애고 TV를 안 보고 산 지 7년이 되었습니다. 하지만 이제 다시 TV를 놓기로 했습니다. 개인적으로 TV 없이 사는 것이 훨씬 이득이라고 생각합니다. "TV 없이 답답해서 어떻게 사냐?"라고 반문 avada.tistory.com 아직도 TV를 그다지 많이 보는 편은 아니지만 가끔 머리를 식힐 겸 OCN 채널에서 방영하는 영화들을 시청하곤 합니다. 대부분 했던 영화를 반복적으로 방영하기 때문에 사실 볼 만한 영화는 별로 없습니다. OCN 채널 확인하기 최근 OCN 채널 번호가 21번(KT)에서 다른 번호로 변경되어 바뀐 채널을 찾지 못하고 있..

워드프레스에서 글을 작성할 때 이미지를 삽입하면 이미지는 정렬 없음 상태가 됩니다. 이미지를 가운데 정렬하도록 설정하려면 컨트롤의 '정렬 변경' 아이콘을 선택하고 중앙 정렬 옵션을 선택해야 합니다. 이 작업이 의외로 번거로울 수 있습니다. 모든 이미지를 가운데 정렬시키고 싶은 경우 간단한 CSS 코드로 가능합니다. 워드프레스 본문 이미지 가운데 정렬하기 워드프레스 블록 에디터(구텐베르크)를 사용하는 경우 이미지 블록을 사용하여 추가한 모든 이미지를 중앙 정렬하고 싶다면 다음과 같은 CSS 코드를 사용할 수 있습니다. /* 모든 이미지 중앙 정렬 */ .single .wp-block-image img { display: block; margin: 0 auto; } 또는, 다음과 같은 코드로도 가능합니다. ..

워드프레스 사이트에서 유사한 제품의 장단점을 비교하는 제품 비교표나 특정 카테고리의 제품들을 나열하는 제품 리스트를 만들고 싶은 경우 페이지 빌더에서 제공하는 가격표(Pricing Table) 요소를 사용하거나 Gutencon과 같은 플러그인을 사용할 수 있습니다. 가격 비교 사이트용 테마로는 REHub 테마가 있습니다. 워드프레스 제품 리스트/제품 비교표 플러그인 다음과 같이 특정 카테고리 제품들을 정리하여 장단점과 사용자 평점, 가격 등을 표시하는 제품 리스트를 만들고 싶은 경우가 있습니다. 위의 그림은 해외호스팅 업체들을 비교한 리스팅인데요, 국내에서는 쿠팡 상품들을 리스트로 표시할 때 위와 같은 레이아웃을 이용하는 경우가 많습니다. 또한, 다음과 같이 세로로 제품들의 장단점을 비교하는 테이블도 많..

워드프레스 OceanWP 테마의 Minimal 데모를 사용하여 벤치마킹 사이트와 비슷하게 세팅하는 작업을 의뢰받아 수행했습니다. 벤치마킹 사이트에서는 썸네일에 카테고리 라벨이 표시되어 있었습니다. 위의 그림과 같이 카테고리 배지가 썸네일 위에 배치되어 있었습니다. 워드프레스 카테고리 라벨을 썸네일에 표시하기 (+OceanWP 테마) 이 기능이 OceanWP 테마에서 제공되는지 체크해보았지만 Blog 설정 페이지에서 카테고리 메타 정보를 표시할지 여부를 지정할 수 있는 옵션은 있지만 카테고리 타이틀을 썸네일에 표시하는 기능은 찾을 수 없었습니다. 벤치마킹 사이트를 살펴보니 엘리멘터 페이지 빌더용 플러그인을 설치하여 블로그 페이지를 만든 것을 확인할 수 있었습니다. 카테고리 이름을 썸네일(특성 이미지) 위에..

워드프레스 OceanWP 테마에서 제공하는 데모 중에서 Minimal 데모는 헤더가 수직으로 배열되어 왼쪽 사이드바에 헤더가 표시됩니다. 이 미니멀 데모를 로드하니 데모 페이지와 달리 실제 사이트에서는 헤더 부분(좌측 사이드바)이 표시되지 않아서 조금 당황스러운 상황이 되었습니다. OceanWP에 지원을 요청해도 주말이라 답변을 제대로 받을 수 없었습니다. 조금 살펴보니 사용자 정의하기의 헤더/푸터 섹션에서 헤더 템플릿과 푸터 템플릿을 지정하는 옵션이 있었습니다. 워드프레스 OceanWP 테마 수직 헤더 설정하기 OceanWP 테마를 설치한 경우 워드프레스 관리자 페이지 > OceanWP > OceanWP Panel > Install Demos에서 데모를 선택하여 설치할 수 있습니다. 데모를 설치한 후에..

MSN 봇 또는 BING 봇은 사용자 사이트의 콘텐츠를 색인화하여 빙 검색엔진에서 검색 시 결과를 표시합니다. 빙 봇이 너무 자주 방문하여 트래픽이 많이 소모되는 경우 빙 검색엔진 봇의 크롤링 속도를 낮출 수 있습니다. 빙(Bing) 검색엔진 봇 크롤링 속도 낮추기 빙 봇의 크롤링 속도는 두 가지 방법으로 조정할 수 있습니다. 빙 웹마스터 도구에서 빙 봇 크롤링 속도 조정하기 마이크로소프트 빙 웹마스터 도구에 사이트가 등록된 경우 빙 웹마스터 도구에서 크롤링 속도를 낮출 수 있습니다. 구글 서치 콘솔과 연동하여 쉽게 Bing 웹마스터 도구에 사이트를 등록할 수 있습니다. https://avada.tistory.com/2669 빙(Bing) 검색엔진 등록 - 구글 서치 콘솔 연동 엣지 브라우저의 점유율이 ..