게시글 내에 첨부파일 다운로드 버튼을 디자인하고싶습니다

워드프레스 KBoard 게시판에서 게시글 내에 첨부파일 다운 버튼을 디자인하고싶습니다

저번에 한번 문의글올렸는데 이해가 제대로 안되서...

죄송하지만 조금더 자세하게 설명부탁드리겠습니다 ㅜㅜ

URl은 woosukac.kr입니다

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
워드프레스 에러 기술지원 서비스 전문가에게 맡기세요
  • 안녕하세요~^^

    아래의 코드가 버튼의 디자인 CSS 속성입니다.

    #kboard-default-document .kboard-button-action { margin: 0 0 5px 0; padding: 4px 5px; font-size: 12px; font-weight: normal; line-height: 12px; text-align: left; border: 1px solid #ededed; background: none; background-color: transparent; border-radius: 2px; letter-spacing: normal; cursor: pointer; vertical-align: middle; text-shadow: none; box-shadow: none; }
    #kboard-default-document .kboard-button-action span { position: static; display: inline; margin: 0; padding: 0; font-size: 12px; }
    #kboard-default-document .kboard-button-download { color: gray; }

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 쪽에 코드를 추가하고

    속성을 적절히 수정해주세요.

    뭔가 더 알려드리고 싶지만

    어떻게 바꾸고 싶으신건지 모르겠어서 답변을 드리기가 어렵습니다.

     

    예를 들어 글자 크기를 키우고 싶다면 아래 처럼 수정을 해주시면 됩니다.

    #kboard-default-document .kboard-button-action span { position: static; display: inline; margin: 0; padding: 0; font-size: 15px; }

    12px -> 15px 이렇게 폰트 사이즈를 키운거죠.

     

    고맙습니다.

  • 답변 너무나도 감사합니다.

    수정하고 싶은 방향은 글자크기를 키우는것과 글씨두께를 주며 현재 첨부파일 클릭 박스가 작은데 그것에 색을 넣어주면서 키우는것입니다.

    이 방법알려주시면 감사하겠으며 

    알려주신대로  워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 쪽에 코드를 추가할려고하는데

    사용자 정의하기 다음 CSS쪽 이 어디인지를 잘 모르겠습니다...

  • 사용자 정의하기에 CSS 추가하기가 보이지 않는다면

    워드프레스 관리자 -> 외모 -> 테마 편집기 페이지에서

    style.css 파일에 코드를 추가할 수 있습니다.

    style.css 파일 내용 하단에 CSS 코드를 추가해보세요.

     

    그리고 워드프레스 버전이 옛 버전이라면 업데이트를 해주시는 게 좋을 듯합니다.

     

    아래 처럼 하시면,

    폰트 크기를 키우고 배경 색상을 변경할 수 있습니다.

    #kboard-default-document .kboard-button-action span { position: static; display: inline; margin: 0; padding: 0; font-size: 15px; background-color: lightgray; color: white; }

     

    고맙습니다.

  • 말씀해주신 대로 업데이트 완료하였습니다.

    워드프레스 관리자 -> 외모 -> 테마 편집기 페이지에서

    style.css 파일에 코드를 들어가보았는데요

     

    /*
    Theme Name: Avada Child
    Description: Child theme for Avada theme
    Author: ThemeFusion
    Author URI: https://theme-fusion.com
    Template: Avada
    Version: 1.0.0
    Text Domain:  Avada
    */
    @import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);
    @import url(//fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

    ul, li, a {border: 0; padding: 0; margin: 0;}
    ul.tab_w {width: 100%; list-style: none;}
    ul.tab_w li {float: left; width: 14.2857%; height: 48px; padding: 7px 0 0 0; color: #d6d6d0; text-align: center; background-color: #5e83b8; font-size: 1.15em;}
    ul.tab_w li:hover {background-color: #3366a8; color: #fff; cursor: pointer;}
    ul.tab_w li.active {background-color: #3366a8;}

     

     

     

    이렇게 검색이되어서 하단에

    #kboard-default-document .kboard-button-action span { position: static; display: inline; margin: 0; padding: 0; font-size: 15px; background-color: lightgray; color: white; }

    을 넣었습니다.

     

    /*
    Theme Name: Avada Child
    Description: Child theme for Avada theme
    Author: ThemeFusion
    Author URI: https://theme-fusion.com
    Template: Avada
    Version: 1.0.0
    Text Domain:  Avada
    */
    @import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);
    @import url(//fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

    ul, li, a {border: 0; padding: 0; margin: 0;}
    ul.tab_w {width: 100%; list-style: none;}
    ul.tab_w li {float: left; width: 14.2857%; height: 48px; padding: 7px 0 0 0; color: #d6d6d0; text-align: center; background-color: #5e83b8; font-size: 1.15em;}
    ul.tab_w li:hover {background-color: #3366a8; color: #fff; cursor: pointer;}
    ul.tab_w li.active {background-color: #3366a8;}

    #kboard-default-document .kboard-button-action span { position: static; display: inline; margin: 0; padding: 0; font-size: 15px; background-color: lightgray; color: white; }

     

    이렇게요

    그런데 변화가 없습니다...

    한번더 설명부탁드릴게요 ㅜㅜㅜ

  • 안녕하세요.

    차일드 테마의 style.css 파일을 불러오지 않는고 있는 것 같습니다.

    차일드 테마 만들면서 차일드 테마의 style.css 파일을 불러오도록 설정하지 않으신 듯합니다.

    그렇다면 아래 파일에 추가를 해주셔야 합니다~^^

    http://woosukac.kr/wp-content/themes/Avada/style.css

     

    그런데 제일 편한 건

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 이쪽에 추가하시는 겁니다.

    고맙습니다.

워드프레스 에러 기술지원 서비스 전문가에게 맡기세요