ecshop 廣告位支援響應式模板修改
2022-03-19
286
相關文章
ecshop 的廣告位一直都是固定尺寸,除非是小圖片,否則根本不適用於需要隨不同設備縮放的響應式環境,因為固定尺寸容易使得元素變形,如果要能順利使用於響應式模板中,有幾個地方需要修改:
1、資料庫欄位改為接受字串
ALTER TABLE `ecs_ad_position` CHANGE `ad_width` `ad_width` VARCHAR(5) NOT NULL DEFAULT '100%'; ALTER TABLE `ecs_ad_position` CHANGE `ad_height` `ad_height` VARCHAR(5) NOT NULL DEFAULT 'auto';
2、取消寬高驗證 admin\ad_position.php
<!-- 分別在 234~244 行與 268~278 註解即可 --> /* 宽度值必须是数字 if (!preg_match("/^[\.0-9]+$/",$ad_width)) { make_json_error($_LANG['width_number']); }*/ /* 广告位宽度应在1-1024之间 if ($ad_width > 1024 || $ad_width < 1) { make_json_error($_LANG['width_value']); }*/
當未定義寬高時使用預設值 admin\ad_position.php
<!-- 78、139 --> $ad_width = !empty($_POST['ad_width']) ? intval($_POST['ad_width']) : '100%'; <!-- 79、140 --> $ad_height = intval($_POST['ad_height'] > 0 ) ? intval($_POST['ad_height']) : 'auto';
3、廣告位表單預設值 admin\templates\ad_position_info.htm
<!-- 12 --> <input type="text" name="ad_width" value="{if $posit_arr.ad_width} {$posit_arr.ad_width}{else}100%{/if}" size="30" /> <!-- 17 --> <input type="text" name="ad_height" value="{if $posit_arr.ad_height} {$posit_arr.ad_height}{else}auto{/if}" size="30" /> <!-- 63~84取消驗證 --> function validate() { validator = new Validator("theForm"); validator.required("position_name", posit_name_empty); // validator.required("ad_width", ad_width_empty); //validator.required("ad_height", ad_height_empty); //validator.isNumber("ad_width", ad_width_number, true); //validator.isNumber("ad_height", ad_height_number, true); validator.required("position_style", empty_position_style); /* if (document.forms['theForm'].elements['ad_width'].value > 10240 || document.forms['theForm'].elements['ad_width'].value == 0) { alert(width_value); return false; } if (document.forms['theForm'].elements['ad_height'].value > 10240 || document.forms['theForm'].elements['ad_height'].value == 0) { alert(height_value); return false; } */ return validator.passed(); }
日後新增廣告位時,圖片的寬度都是容器的100%,高度也會依比例自調整,不會再有圖片變形的問題...
點擊圖片可以放大檢視
點擊圖片可以放大檢視
如果你對ecshop 廣告位支援響應式模板修改有任何問題請到討論區發帖。