워드프레스에서 CSS 코드를 추가하는 방법은 다양합니다. 크게 다음과 같은 방법으로 사용자 CSS를 추가할 수 있습니다. 워드프레스 자체 기능 사용하기 - 사용자 정의하기 테마 내의 기능 사용하기 (CSS 코드를 추가하는 옵션을 제공하는 경우) 차일드 테마의 스타일시트에 추가하기 사용자 정의하기 내의 추가 CSS 기능 사용하기 워드프레스에서는 자체적으로 커스텀 CSS를 추가할 수 있는 옵션을 사용자 정의하기에서 제공합니다. 워드프레스 관리자 페이지 > 테마 디자인 > 사용자 정의하기 > 추가 CSS를 클릭하면 사용자 정의 CSS를 추가할 수 있습니다. 테마에서 제공하는 옵션 사용 (테마에 따라 제공되지 않을 수 있음) 두 번째 방법으로 테마에서 커스텀 CSS를 추가할 수 있는 옵션을 제공하는 경우가 있습..

워드프레스를 원활히 운영하기 위해서는 PHP memory limit 등의 PHP 설정값을 조금 높게 설정해주면 좋습니다. 예전에는 128M나 256M 설정으로 충분했지만, 사용하는 테마나 플러그인에 따라 더 높은 설정값이 요구되기도 합니다. (일반적으로 256M 이상이면 문제가 없을 것입니다.) PHP 설정값을 확인한 후에 max_execution_time, memory_limit, upload_max_filesize 등의 설정값이 낮은 경우 상향 조정해주도록 합니다. 웹호스팅 서버에 따라 설정하는 방법이 조금씩 차이가 있습니다. wp_memory_limit 및 max_execution_time 설정 변경하기 블루호스트에 가입한 경우 먼저 "블루호스트에서 PHP 버전과 PHP 환경 설정값 변경하기 (새로..

워드프레스 멀티사이트를 이용하면 하나의 워드프레스 설치로 여러 개의 워드프레스 사이트를 운영할 수 있습니다. 도메인 매핑 기능을 사용하여 각 서브 사이트마다 다른 도메인(서브도메인 포함)을 지정하는 것이 가능합니다. 서브도메인은 이용하는 웹호스팅 상품에 따라 제한이 있을 수 있습니다. 예를 들어, 국내 웹호스팅 업체인 카페24 웹호스팅의 경우 퍼스트클래스 상품부터 서브도메인이 지원됩니다. 블루호스트와 사이트그라운드 같은 해외 호스팅에서는 서브도메인을 모든 상품에서 생성이 가능합니다. (Bluehost Shared Hosting의 경우 최저가 상품에서는 25개까지 서브도메인을 지원하고, 그 이상 상품에서는 무제한으로 생성이 가능합니다.) 테마포레스트(Themeforest) 테마의 경우 서브도메인에 대해서는..

워드프레스의 body 태그에 사용자 역할(Role)을 클래스로 추가하면 역할에 따라 특정 페이지의 레이아웃을 다르게 만들 수 있습니다. 예를 들어, 특정 요소는 관리자로 로그인한 상태에서만 표시되고 게스트나 다른 사용자는 볼 수 없도록 하려는 경우에 body에 추가된 사용자 역할 클래스를 활용할 수 있습니다. body 태그에 사용자 역할을 추가하려는 경우 다음 코드를 사용자 함수 파일에 추가하도록 합니다. // Add user role class to body tag // 사용자 역할(회원 등급) 클래스를 body 태그에 추가하기 function add_role_to_body($classes) { global $current_user; $user_role = $current_user->roles; ret..

어제 아는 분의 부탁으로 워드프레스 사이트에 하단에 고정된 배너를 만드는 작업을 해보았습니다. 모바일 기기에서 아래 그림과 같이 배너가 표시되는 형식으로 플러그인을 사용하지 않고 비교적 간단한 HTML 코드를 활용했습니다. 색상과 아이콘은 참고로 보내준 그래픽과 동일하게 만들었습니다. 실제로 모바일에서 보면 괜찮지만 이렇게 보니 빨간색 때문에 눈에 부담이 되는 것 같네요. 색상은 CSS로 변경 가능합니다. [참고*사이드바에 고정된 퀵뷰/퀵메뉴(카톡 배너 등)를 표시하는 방법은 여기를 참고해보세요.*] 모바일 기기 하단에 고정된 배너 표시하기 - 사용자 코드 사용 이렇게 하단에 표시되는 배너나 사이드에 표시되는 퀵뷰를 만들기 위해 플러그인을 사용할 필요는 없습니다. [참고*쉽게 구현하고 싶은 경우 플러그인..

어떤 사이트가 워드프레스로 제작되었는지 여부가 궁금한 경우가 있습니다. 그리고 워드프레스로 제작되었다면 사용된 테마가 무엇인지도 알고 싶을 수 있습니다. 이러한 기능을 제공하는 사이트가 몇 군데 있습니다. 대표적인 사이트로 https://whatwpthemeisthat.com/이라는 곳이 있습니다. 하지만 이제는 워드프레스 사이트에 사용된 테마를 제대로 감지하지 못하는 것 같습니다. 사이트가 워드프레스로 제작되었는지 여부 확인 어떤 사이트가 워드프레스로 제작되었는지 여부를 확인하는 방법으로 여러 가지가 있습니다. 먼저 사이트주소 뒤에 /wp-admin을 붙여서 접속했을 때 관리자 로그인 화면이 표시되면 확실히 워드프레스로 제작된 사이트입니다. 하지만 일부 사이트에서는 일부러 로그인 페이지의 주소를 변경하..

워드프레스에서 기본적으로 알림판에서 테마와 플러그인을 편집할 수 있는 메뉴가 제공됩니다. 테마 편집기와 플러그인 편집기는 비활성화하는 것이 보안에 바람직할 수 있고 테마 편집기를 통해 잘못 편집할 경우 발생할 수 있는 오류를 방지할 수 있습니다.테마 편집기 테마 디자인 > 테마 편집기를 클릭하면 현재 설치된 테마의 소스 파일을 편집할 수 있습니다. 테마를 편집할 경우 차일드 테마를 만들어서 작업하는 것이 좋습니다. 위의 그림에서는 베스트셀링 테마인 아바다의 차일드 테마 내 함수 파일(functions.php)을 편집하는 경우를 보여줍니다. 차일드 테마를 이용하지 않고 본래 테마 파일을 직접 수정하면 추후에 테마가 업데이트될 경우 수정 사항이 모두 사라지게 됩니다. 알림판의 테마 편집기를 통해 편집할 때,..

워드프레스에서 멀티사이트를 구성하면 하나의 워드프레스 설치로 여러 개의 워드프레스를 운영할 수 있습니다. 이 방법을 사용하면 각 하위 블로그에 도메인을 매핑하는 것이 가능하므로 하나의 호스팅으로 여러 개의 도메인으로 된 사이트를 운영할 수도 있습니다. 워드프레스 멀티사이트에서 테마 / 플러그인 설치하기 개인적으로는 멀티사이트를 그리 선호하는 편은 아닙니다. 웹호스팅이 좋지 않으면 멀티사이트로 구성할 경우 사이트 속도가 매우 느려질 수도 있습니다. 실제로 그런 경우를 간혹 목격합니다. 멀티사이트로 워드프레스 다국어 사이트 구성 작업 그리고 멀티사이트를 지원하지 않는 플러그인도 있습니다. 또, 멀티사이트를 운영하다 보면 이상한 오류가 간혹 발생하기도 합니다. 하지만 이런 단점에도 멀티사이트를 사용하는 것이 ..

워드프레스의 특정 메뉴 항목에 다른 CSS 스타일을 적용하고 싶은 경우가 있을 수 있습니다. 그런 경우 원하는 메뉴 항목에 CSS 클래스를 지정할 수 있습니다. 특정 메뉴 항목에 CSS 클래스 지정하기 메뉴 항목에 CSS 클래스를 지정하려면 외모 > 메뉴에서 해당 메뉴를 선택하도록 합니다. 그런 다음 오른쪽 상단의 "화면 옵션"을 클릭합니다. 고급 메뉴 속성 보기에서 CSS 클래스를 체크하도록 합니다. 이제 CSS 클래스를 지정하기를 원하는 메뉴 항목을 클릭하면 CSS 클래스를 지정할 수 있는 입력란이 있습니다. CSS 클래스를 추가한 다음 외모 > 사용자 정의하기 > 추가 CSS에 CSS 코드를 추가할 수 있습니다. 또는, 차일드 테마를 이용하거나 테마 옵션에서 CSS 입력란을 제공하는 경우 테마 옵션..

무료 워드프레스 테마 중 하나인 Adventurous 테마에서 각 페이지에 대하여 사이드바 위치를 지정하는 옵션이 제공됩니다. 무료 테마에서는 보통 이런 옵션이 제공되지 않지만 Adventurous는 유료 테마의 무료 버전(일종의 Lite 버전)이므로 이 옵션이 탑재되어 있는 것 같습니다. 일부 유료 테마에서도 사이드바의 위치를 개별적으로 지정하는 옵션이 제공됩니다. 베스트셀링 테마인 아바다(Avada)에서는 개별 페이지에 대하여 사이드바의 위치를 지정하는 옵션은 제공되지 않고, 대신 페이지마다 다른 사이드바를 지정할 수 있는 옵션이 제공됩니다. Fusion Page Options > Sidebars에서 사이드바에 표시할 사이드바를 지정하는 것이 가능합니다. 아바다에서는 테마 옵션에서 전체적으로 사이드바..