html 수정

 

전화 버튼을 추가합니다.

다음 4개의 소스를 수정해주세요.

 

- 스킨관리 > PC 메인 스킨

- 스킨관리 > PC 서브 스킨

- 스킨관리 > Mobile 메인 스킨

- 스킨관리 > Mobile 서브 스킨

 

 

 

            <div class="header_m">
                <h1><span><a href="/main"><img src="{$farm_skin_set[logo]}" alt="" /></a></span></h1>
                <button id="toggle_left">Toggle Left Side</button>
                <button id="toggle_right">Toggle Right Side</button>
            </div>

 

->

 

            <div class="header_m">
                <h1><span><a href="/main"><img src="{$farm_skin_set[logo]}" alt="" /></a></span></h1>
                <button id="toggle_left">Toggle Left Side</button>
                <button id="toggle_right">Toggle Right Side</button>
                <a href="tel:{$shop_base[help_tel]}" id="h_tel">Tel</a>
            </div>

 

 

 

---

 

 

css 수정

 

토글버튼을 숨김처리 합니다.

전화버튼을 추가합니다.

다음 두개의 소스를 수정해주세요.

 

- 스킨 관리 > PC 메인 스킨 > CSS소스 > pc_skin_752_56.css

- 스킨 관리 > Mobile 메인 스킨 > CSS소스 > m_skin_752_56.css

 

 

/* Layout */
#viewport {min-height:100%;background:#ffffff}

#header {position:relative;z-index:200;background:#6dbcdb;box-sizing:border-box}
#header * {box-sizing:border-box}
#header .header_m {box-shadow:inset 0 -1px 1px rgba(0, 0, 0, 0.2);position:relative;min-height:50px}
#header .header_m h1 {width:100%;margin:0;padding:0 60px;font-size:0}
#header .header_m h1 span {display:table;width:100%}
#header .header_m h1 a {display:table-cell;height:50px;vertical-align:middle;text-align:center}
#header .header_m h1 img {width:auto;max-height:50px}
#header .header_m button {position:absolute;top:0;bottom:0;width:50px;height:50px;margin:auto;border:none;background:none;font-size:0}
#header .header_m button:before {font-family:'icomoon';position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;color:#ffffff}
#header .header_m #toggle_left {left:0}
#header .header_m #toggle_left:before {content:'\e902';width:40px;height:40px;font-size:40px}
#header .header_m #toggle_right {right:0}
#header .header_m #toggle_right:before {content:'\e905';width:28px;height:28px;font-size:28px}
#header .header_p {display:none}

 

->

 

/* Layout */
#viewport {min-height:100%;background:#ffffff}

#header {position:relative;z-index:200;background:#6dbcdb;box-sizing:border-box}
#header * {box-sizing:border-box}
#header .header_m {box-shadow:inset 0 -1px 1px rgba(0, 0, 0, 0.2);position:relative;min-height:50px}
#header .header_m h1 {width:100%;margin:0;padding:0 60px;font-size:0}
#header .header_m h1 span {display:table;width:100%}
#header .header_m h1 a {display:table-cell;height:50px;vertical-align:middle;text-align:center}
#header .header_m h1 img {width:auto;max-height:50px}
#header .header_m button,
#header .header_m #h_tel {position:absolute;top:0;bottom:0;width:50px;height:50px;margin:auto;border:none;background:none;font-size:0}
#header .header_m button:before,
#header .header_m #h_tel:before {font-family:'icomoon';position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;color:#ffffff}
#header .header_m #toggle_left {left:0}
#header .header_m #toggle_left:before {content:'\e902';width:40px;height:40px;font-size:40px}
#header .header_m #toggle_right {display:none;right:0}
#header .header_m #toggle_right:before {content:'\e905';width:28px;height:28px;font-size:28px}
#header .header_m #h_tel {right:0}
#header .header_m #h_tel:before {content:'\e90f';width:28px;height:28px;font-size:28px}
#header .header_p {display:none}

 

 

 

---

 

 

위와 같이 수정이 완료되었습니다.

디자인팜에서 전화기능을 쉽게 추가할 수 있도록 개선될 예정입니다.