아래의 방법을 순서대로 시도해 보시기 바랍니다.

1. CSS 수정 경로

- 워드프레스 관리자 -> 외모(Appearance) -> 사용자 정의하기(Customize) -> 추가 CSS 메뉴에 아래 코드를 입력합니다.

2. 모바일 가로 폭 확장 코드

모바일 기기(가로 768px 미만)에서 리스트 아이템의 폭을 넓히는 일반적인 코드입니다.

@media screen and (max-width: 768px) {

#kboard-modern-gallery-list .kboard-modern-gallery-item {

width: 100% !important;

margin: 0 0 20px 0 !important;

}

}

3. 이미지 크기 및 레이아웃 최적화

- 위 코드는 한 줄에 이미지 하나가 꽉 차게 나오도록 설정합니다.

- 만약 한 줄에 두 개씩 보여주고 싶다면 width 값을 48% 정도로 조절하고 여백을 조정해 보세요.

- 전체 화면 이탈 방지를 위해 아래 코드를 함께 추가하면 도움이 됩니다.

html, body {

width: 100% !important;

overflow-x: hidden !important;

}

4. 주의사항

- 사용 중인 테마의 기본 설정에 따라 클래스명이 일부 다를 수 있습니다.

- 위 코드를 적용해도 변화가 없다면, KBoard 설정 내의 '커스텀 CSS' 필드에 직접 입력하여 우선순위를 높일 수 있습니다.

직접 수정이 어려우시거나 특정 부분의 세밀한 조정이 필요하신 경우, 코스모스팜 고객지원 커뮤니티를 통해 해당 페이지 주소와 함께 문의하시면 더 정확한 CSS 가이드를 받으실 수 있습니다.