망보드 게시판에서 페이지네이션 스타일을 수정하려면 CSS 코드를 이용하여 수정을 해주셔야 하는데 아래의 페이지네이션 CSS 템플릿 코드를 이용하여 원하시는 형태로 수정하신 후 워드프레스 관리자에 추가해 주시면 보다 쉽게 게시판 페이지네이션 스타일을 수정해서 사용하실 수 있습니다.
1. 망보드 게시판 페이지네이션 CSS 템플릿
- 페이지 버튼 테두리 선 컬러: #EEE - 선택된 페이지 버튼 테두리 선 및 배경 컬러: #555555 - 선택된 페이지 버튼 폰트 컬러: #FFFFFF
1) 페이지네이션 CSS 템플릿1 
body #mb_top .mb-board .mb-style1 .pagination-box td a{background:none !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td:not(.mb-disabled) a:hover{background-color: rgba(238,238,238,0.3) !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow a{padding: 0px !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow img{display:none !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-start span {display:inline-block;width:26px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_left2.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-prev span {display:inline-block;width:26px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_left.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-next span {display:inline-block;margin-left:1px !important;width:25px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_right.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-end span {display:inline-block;margin-left:1px !important;width:25px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_right2.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td a{font-size:13px;font-weight:400 !important;display: inline-block;line-height: 26px;width: auto;height: 28px;min-width: 28px;min-height: 28px;padding:0 1px 0 2px !important;vertical-align: top !important;text-align: center;border:1px solid #EEE;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{display: inline-block;line-height: 26px;width: auto;height: 28px;min-width: 28px;min-height: 28px;padding:0 1px 0 2px !important;vertical-align: top !important;text-align: center;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{background-color: #555555 !important;border:1px solid #555555 !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a:hover{background-color: #555555 !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{color: #FFFFFF !important;}
2) 페이지네이션 CSS 템플릿2
body #mb_top .mb-board .mb-style1 .pagination-box td a{background:none !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td:not(.mb-disabled) a:hover{background-color: rgba(238,238,238,0.3) !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow a{padding: 0px !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow img{display:none !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-start span {display:inline-block;width:26px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_left2.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-prev span {display:inline-block;width:26px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_left.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-next span {display:inline-block;margin-left:1px !important;width:25px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_right.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-end span {display:inline-block;margin-left:1px !important;width:25px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_right2.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td a{font-size:13px;font-weight:400 !important;display: inline-block;line-height: 26px;width: auto;height: 28px;min-width: 28px;min-height: 28px;padding:0 1px 0 2px !important;vertical-align: top !important;text-align: center;-webkit-border-radius:7px;-moz-border-radius:7px;-khtml-border-radius:7px;border-radius:7px;border:1px solid #EEE;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{display: inline-block;line-height: 26px;width: auto;height: 28px;min-width: 28px;min-height: 28px;padding:0 1px 0 2px !important;vertical-align: top !important;text-align: center;-webkit-border-radius:7px;-moz-border-radius:7px;-khtml-border-radius:7px;border-radius:7px;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{background-color: #555555 !important;border:1px solid #555555 !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a:hover{background-color: #555555 !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{color: #FFFFFF !important;}
3) 페이지네이션 CSS 템플릿3 body #mb_top .mb-board .mb-style1 .pagination-box td a{background:none !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td:not(.mb-disabled) a:hover{background-color: rgba(238,238,238,0.3) !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow a{padding: 0px !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow img{display:none !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-start span {display:inline-block;width:26px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_left2.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-prev span {display:inline-block;width:26px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_left.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-next span {display:inline-block;margin-left:1px !important;width:25px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_right.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.page_arrow .btn-end span {display:inline-block;margin-left:1px !important;width:25px;height:26px;background:url(/wp-content/plugins/mangboard/skins/bbs_basic/images/icon_arrow_right2.gif) no-repeat center center !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td a{font-size:13px;font-weight:400 !important;display: inline-block;line-height: 26px;width: auto;height: 28px;min-width: 28px;min-height: 28px;padding:0 1px 0 2px !important;vertical-align: top !important;text-align: center;-webkit-border-radius: 100%;-moz-border-radius: 100%;-khtml-border-radius: 100%;border-radius: 100%;border:1px solid #EEE;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{display: inline-block;line-height: 26px;width: auto;height: 28px;min-width: 28px;min-height: 28px;padding:0 1px 0 2px !important;vertical-align: top !important;text-align: center;-webkit-border-radius: 100%;-moz-border-radius: 100%;-khtml-border-radius: 100%;border-radius: 100%;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{background-color: #555555 !important;border:1px solid #555555 !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a:hover{background-color: #555555 !important;}
body #mb_top .mb-board .mb-style1 .pagination-box td.active a{color: #FFFFFF !important;}
2. 워드프레스 관리자에서 페이지네이션 CSS 스타일 적용방법 워드프레스 관리자 기능을 이용하여 CSS 템플릿 코드를 적용하면 일반 사용자 페이지에만 적용이 되고, 관리자 페이지에는 적용이 되지 않습니다.
1) 워드프레스 관리자 > 모양 > 사용자 정의 메뉴 클릭 2) 추가 CSS 메뉴 클릭
3) 페이지네이션 CSS 템플릿 코드 중에서 1개를 선택해서 Textarea 영역에 입력한 후 공개 버튼 클릭
3. CSS 파일을 이용하여 페이지네이션 CSS 스타일 적용방법 CSS 파일을 이용하여 CSS 템플릿 코드를 적용하면 일반 사용자 페이지 및 관리자 페이지에 모두 적용이 됩니다.
1) 페이지네이션 CSS 템플릿 코드 중에서 1개를 선택한 후 메모장 또는 텍스트 편집기를 이용하여 pagination.css 파일로 저장
2) 저장한 CSS 파일을 "/wp-content/plugins/mangboard/assets/css/pagination.css" 경로에 업로드
|
