갤러리에서 가로이미지 갯수와 세로 사이즈를 변경해보도록 하겠습니다.
먼저 갤러리 가로 이미지 갯수 변경 방법입니다.
먼저 자료실게시판 → 갤러리게시판으로 변경을 해주어야 합니다. 관리자 화면에서 "Mangboard > 게시판관리"를 클릭해주세요. 해당 게시판의 갤러리 Shortcode를 복사합니다.
관리자 화면에서 "페이지 > 모든페이지"를 클릭해주세요. 해당 페이지를 클릭한 뒤, Shortcode를 붙여넣기 합니다.
이제 갤러리 게시판으로 변경되었습니다. 이제 반응형에 따라 갤러리 게시판의 이미지 갯수가 한줄에 몇개씩 나열될지 수정하는 코드로 가보겠습니다.
"public_html/wp-content/plugins/mangboard/skins/"스킨이름"/gallery.php" 해당위치의 파일을 에디터를 이용해서 열어줍니다.
코드 상단의 "$responsive_class = 'col-543';"을 바꿔주시면됩니다.
543이란... PC에서 갤러리 게시판 가로 이미지 갯수 5개, Tablet에서 갤러리 게시판 가로 이미지 갯수 4개, Mobile에서 갤러리 게시판 가로 이미지 갯수 3개로 설정해라 라는 뜻입니다.
$responsive_class = 'col-432'; 를 적용해보겠습니다.
PC에서는 아래와 같이 이미지가 4개씩 보입니다.
Tablet에서는 3개씩 보입니다.
Mobile에서는 2개씩 보입니다.
갤러리 게시판 반응형 클래스에 대한 설정은 위와 같이 아주 간단합니다. 브라우저 크기에 따라 이미지 갯수가 설정되는 방식이며 현재 설정되어있는 클래스 이외에 다른 반응형을 원하시면 직접 바꾸셔도 됩니다.
"public_html/wp-content/plugins/mangboard/assets/css/style.css" 해당 위치의 파일에서 수정 가능합니다.
갤러리 세로 사이즈 변경 방법입니다.
"public_html/wp-content/plugins/mangboard/skins/"스킨이름"/includes/skin-model.php" 해당위치의 파일을 에디터를 이용해서 열어줍니다.
$desktop_model['list_gallery']의 이미지 height를 수정해주시면됩니다. 플랫폼 환경에 따라 이미지 높이를 다르게 설정하려면 "tablet_height":"100px","mobile_height":"110px" 추가로 소스를 적어주시면됩니다.
| 
Hometory
