웹사이트 내용
- 확실한 아이덴티티 컬러를 결정하고, 전반적인 디자인에 반영할 필요.
- 게시물 작성법 A-Z를 다루는 매뉴얼 필요.
- 섹션별 메인 추가 : NEWS, TV, RADIO 등
- 신규 Widget Area 설치 필요
- SI(Station Identity) 확립. 웹사이트 탑재.
- 소개 페이지 개편
- 방송국 소개 : Custom CSS를 적용하고, Full-Width로 멋지게.
- 부서 소개 / 국원 소개를 나눌 필요가 없다. 적당한 박스형 레이아웃으로. 국원 사진도 좀 넣자.
- 라디오방송 관련 정보 추가
- 라디오방송 청취 방법(+캠퍼스 스피커 지도)
- 라디오방송 시간표
- 음악방송/휴방 기간 안내
- 철지난 행사 포스터는 내리자
- ‘행당뉴스 PRIME’ 명칭에 대한 고민
- 카드뉴스 탑재
- 관련 플러그인 설치하고, News 섹션 Primary Sidebar 설치
- 잘못 분류된 ‘학내보도’ 기사들을 ‘생활정보’로 정정
- 불필요한 페이지 삭제
- 과거 Legacy 사이트에서 뜯어온 게시판 구현용
CSS 수정
제목(h1~h6) 태그의 줄간격 조정하기 // line-height, 1에서 1.2로 수정제목(h1~h6) 태그의 폰트 색상, 쌩 블랙이 적당한가? //#222로 수정본문(p) 태그 색상, Black(#000000)보단 약간 Gray를 찾아보자 // #444로 수정blockquote 개선Mobile : HUBS 로고 삐져나오는 현상 해결Mobile : Genesis Tabs 하단에 공간 많이 남는 문제 해결 (Media Queries 수정)
CSS tip: To reset a min-height or min-width declaration, set it to “0”, not “auto”. For max-height/width, the initial value is “none”.문단 좌우정렬, 줄바꿈 기준 변경
text-align: justify;
word-break: normal;
word-wrap: break-word;메인 화면 Featured Contents 제목 넘칠 경우 Ellipsis(…)으로 처리
.featured-content .entry-title 클래스 대상
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;카테고리 표시, 일자·작성자 표시에 통합본문(p) 줄간격 1.8로 수정본문(p)폰트 변경, 자간 좁히기‘맑은 고딕’, letter-spacing: -0.04em조선일보 참조 : ‘맑은 고딕’,’Malgun Gothic’,나눔고딕,돋움,Dotum,굴림,Gulim,’Apple SD Gothic Neo’,sans-serif
- 각 섹션별로 다른 사이트로고 (ex. HUBS NEWS, HUBS TV…)
- Genesis Tab에 카테고리 표시 : NEWS, TV 등등 // 현재 수정 반영 완료. 옵션 활성화하면 바로 보임
- Genesis Tab 수정사항 있을 때마다 ‘Show Post Info’에 아래 코드 붙여넣어야 함
<post_categories sep= / before= > - CSS 수정내역
.home-top .widget.ui-tabs .entry 클래스 대상
background: rgba( 0, 0, 0, 0.8 );
font-size: 14px;
padding: 10px 10px 8px;
position: absolute;
z-index: 9;
right: 0px;
top: 0px;
우측 상단에 붙게 됨. 태블릿/모바일 화면은 따로 대책 강구.
- Genesis Tab 수정사항 있을 때마다 ‘Show Post Info’에 아래 코드 붙여넣어야 함
- 본문에 웹사이트 자체링크(WordPress)를 걸었을 경우 생성되는 링크박스 수정
Tablet, Phone 해상도에서 Header-Right 위젯 display: none; 처리
PHP 수정
- Breadcrumb의 ‘YOU ARE HERE’는 필요 없을 듯
- 페이스북 페이지 위젯은 반응형으로 표시
사이트 레이아웃
컨텐츠 조회 페이지에 대해 Secondary Sidebar 사용 검토.단, Contents 영역에 대해 가로 50px 늘리고, Primary Sidebar에 대해 50px 줄여주는 조치 필요. Homepage에서 Primary Sidebar가 줄어들어서 생기는 위젯 깨짐도 대응해야 함.
위젯 컨트롤 할 수 있는 방안 마련Dynamic Widgets 활용Mobile 뷰에서 일정 해상도까지는 Primary/Secondary Sidebar가 각각 가로폭 50% / 50%로 나오게 하는 방안 검토구현 완료. 적용 대기중Mobile 뷰에서 Primary/Secondary Sidebar 제거보류
혹은 개개의 div에 대해 선택적으로 제거하는 것도 검토display: none !important;
Mobile : 사이트 상단로고 아래 소셜미디어 링크 숨김- 게시물 제목은 언론사 웹사이트처럼 Full-Width로 나오는게 덜 답답해보이지 않을까
- 특정 카테고리의 Archive는 커버이미지가 상단에 나오는게 좋지 않을까 (특히 라디오)
- 웹사이트 Footer 수정. 한대신문처럼 기능적으로. (로고 + 방송국 정보 + 주요메뉴)
단순 기능추가
- 특성 이미지가 지정되지 않았을 때 표시되는 기본 이미지가 필요
- 카드뉴스를 손쉽게 볼 수 있도록 하는 Gallery 기능 필요
- 관련글 기능 개선
- 자동선택 알고리즘이 별로다. 차라리 수동지정이 나을 듯.
- Facebook 위젯 교체. 레이아웃 깨지 않게 반응형으로 교체하거나 이미지로 대체.
- Secondary Sidebar 상단에 작성자 프로필 사진 표시
- 뉴스의 경우 담당기자 표시
- WP User Avatar 플러그인 : <avatar> shortcode 사용
- TV/라디오의 경우 그냥 Primary Sidebar에 특성이미지 표시하는게 나으려나
- Featured Image 플러그인 : <Featured Image> shortcode 사용
- 장기적으로는 제작진 모두 표시할 수 있도록 기능개선 필요
- 뉴스의 경우 담당기자 표시
고급 개발과제
- 게시물 작성/조회시 동일한 CSS 환경에서 볼 수 있어야 함(에디터 CSS 일치)
- 선곡표의 DB화
Noto Sans 웹폰트는 카페24 CDN에 내장 (구글 접속 어려운 환경 감안)// 웹서버 계정에 탑재완료- 온라인으로 LIVE 라디오방송을 청취할 수 있어야
- D3.js를 활용한 실시간 선거정보 페이지 구현
- 각 방송국원별 Portfolio Page가 있었으면 좋겠다.
- 메뉴바 : 네이버 모바일 웹처럼 좌우 스크롤 방식으로 전환
참고자료
WordPress PHP 함수 레퍼런스
https://codex.wordpress.org/Function_Reference