코스모스팜 스레드

KBoard 화이클 비디오스킨 문의

새해 복 많이 받으세요~

www.xion.kr 사이트 동영상 게시판을 pc 버전하고 모바일 버전하고 다르게 하고 싶은데,

화이클비디오 스킨 보니까 스크린샷 별로 모양이 다른데요.

그중에 첨부파일 스크린샷5 를 모바일 버전에 적용하고 싶은데 어떻게 하면 될까요?

https://imgur.com/a/bR1o36I

 

감사합니다.

 

 

무제한으로 웹사이트를 만드세요. (코스모스팜 무제한 라이센스)
무제한으로 웹사이트를 만드세요. (코스모스팜 무제한 라이센스)
  • 안녕하세요~^^

    에키님도 새해 복 많이 받으세요 ㅎㅎ

     

    올려주신 이미지는 KBoard 화이클 비디오 스킨의 최신글 레이아웃 스크린샷입니다.

    <스크린샷 1>은 PC 화면에서 일반 게시글 목록 페이지입니다.

    <스크린샷 2>는 썸네일 클릭 시 표시됩니다.

    <스크린샷 3>은 모바일 화면에서 일반 게시글 목록 페이지입니다.

    <스크린샷 4>는 게시글 본문 페이지입니다.

    <스크린샷 5>는 최신글 레이아웃입니다.

     

    모바일 화면에서 일반 게시글 목록 페이지를 최신글 레이아웃처럼 표시하시려면

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드를 추가해보시겠어요?

    @media screen and (max-width: 600px) {
    	.kboard-hwaikeul-video-thumbnail { float: left; width: 30%; }
    	.kboard-hwaikeul-video-container.wide { padding-bottom: 75%; border-radius: 0; }
    
    	#kboard-hwaikeul-video-list .kboard-list .kboard-list-item { padding: 20px 0; overflow: hidden; border-bottom: 1px solid #f0f0f0; }
    	#kboard-hwaikeul-video-list .kboard-list .kboard-list-item .item-padding { padding: 0; border: none; box-shadow: none; }
    	#kboard-hwaikeul-video-list .kboard-list .kboard-list-item .kboard-hwaikeul-video-wrap { margin: 0 0 0 35%; }
    	#kboard-hwaikeul-video-list .kboard-list .kboard-list-item .kboard-hwaikeul-video-wrap .kboard-hwaikeul-video-title { margin: 0; text-align: left; }
    	#kboard-hwaikeul-video-list .kboard-list .kboard-hwaikeul-video-wrap .kboard-hwaikeul-video-info { text-align: left; }
    }

    고맙습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
무제한으로 웹사이트를 만드세요. (코스모스팜 무제한 라이센스)