徐嘉裕(Neil Hsu)的工作心得網誌!

使用php->header下載檔案最常遇見的問題就是下載回來的檔案損毀，或是格式損毀，最主要的原因就是：UTF-8的BOM字元產生的檔頭錯誤。解決方法就是使用ob_clean()+flush();方法如下： $file = $url;    //下載檔案的完整路徑包含檔名(實體路徑) header('Content-Description: File Transfer'); header('Content-Type: application/octet-stream'); header('Content-Disposition: attachment; filename='.basename($file)); header('Content-Transfer-Encoding: binary'); header('Expires: 0'); header('Cache-Control: must-revalidate'); header('Pragma: public'); header('Content-Length: ' . filesize($file)); ob_clean(); //清除緩存 flush(); readfile($file); exit; 經過神農氏嘗百草精神測試後這支程式確定是不會出錯了，有需要的朋友參考看看 參考資料來源： http://lab.aoetek.com/index.php/2018/04/25/2018042501/ 工作心得撰寫： 徐嘉裕 Neil hsu

Xoops是使用Smarty樣板引擎，雖然有些判斷在php端就能處理，但是像系統佈景區塊之類的還是用Smarty的code來處理會比較方便，不用再另外寫一堆PHP程式，這裡分享一個在Smarty->foreach 迴圈抓出第一圈跟最後一圈的方法，使用first及last參數即可。 例如像下圖，需要抓出迴圈的第一圈跟最後一圈然後定義CSS做樣式樣的變化! 方法如下 <{foreach item=blockmenulayers from=$block.category name=blockmenulayers}> <div class=' <{if $smarty.foreach.blockmenulayers.first eq true}>firstbox<{/if}> <{if $smarty.foreach.blockmenulayers.last eq true}>lastbox<{/if}>   panel-titlebox '> 內容內容內容內容內容............ </div> <{/foreach}> 說明： <{if $smarty.foreach.blockmenulayers. first eq true}>firstbox<{/if}> //如果是第一圈first值為true顯示firstbox <{if $smarty.foreach.blockmenulayers. last eq true}>lastbox<{/if}> //如果是最後一圈last值為true顯示lastbox 所以class隨迴圈顯示的值就會是! 第一圈->firstbox 最後一圈->lastbox 扣除第一圈跟最後一圈->panel-titlebox 這樣就有三種css樣式可以定義了，讓版面更靈活美觀!! 有需要的朋友參考看看 工作心得撰寫： 徐嘉裕 Neil hsu

在開發不規則佈景時需要用到隨物件調整CSS的top位置的功能，原本都是用JQuery計算在輸出的，後來發現原來css也能做數值運算，用calc() 這樣就能在smarty迴圈中定義的css並給予計算，然後自動調整物件的top位置，基本上來說只要式css的物件樣式都能計算 例如： top: calc(60px + <{$a}>px); <{$a}>為迴圈數預設為1，這樣每回圈一次top的數值+1輸出即為61,62,63...... 也還能作其他的計算 width: calc(50% + 8px) /* 意思是 50% 的寬度 + 上 8px */ width: calc(50% + -8px) /* 意思是 50% 的寬度 + 上 -8px，也等於 '50% - 8px' */ +：加 -：減 *：乘。其中一個運算參數必須是數字 (number) /：除。除數必須是數字，除數不可為零，會造成 HTML 解析錯誤。 有需要的朋友參考看看! 參考教學： https://5xruby.tw/posts/css-calc/ 工作心得撰寫： 徐嘉裕 Neil hsu

在開發xoops佈景時如果標題字數太長，我們通常會設個預設高度然後用overflow: hidden;隱藏被折行的內容，正常條件下這部分是沒問題的，但如果佈景標題想做些特別的設計，像是在文字右邊加上一些裝飾圖文，如果沒有限制輸出字元總數就會很麻煩! 舉例來說，如果要做文字右邊為斜角裝飾，文字區塊為display: inline;線內元素，文字沒段行之前都是正常的像下圖這樣 但如果文字段行後，原本的斜角就會跑到段行的結束點去 這樣畫面就不好看了，原因如下圖說明： 解決方法只能用jQuery函數str.substr()限制輸出字元總數，讓文字不要折行，這樣右邊距就不會跑到折行的下方，方法如下! 1、在佈景的<{$block.title}>標籤前面加上class定義好讓jQuery取值 <span class='blocktitle blocktitleto<{$block.id}>' name='<{$block.id}>'><{$block.title}></span> 備註說明：<{$block.id}>為區塊的id，我們用它來當作class的前綴 2、在佈景的js檔加上以下code //顯示字元限制 $(document).ready(function(){ $(".blocktitle").each(function(index) { $idname = $(this).attr("name"); var str=$(".blocktitleto"+$idname).text(); $(".blocktitleto"+$idname).text(str.substr( 0 , 25 )); }); }); 備註說明str.substr( 0 , 25 ) 藍字為擷取字串起始點，紅字為擷取字元總數 然後來看看剛剛被折行的區塊是否正常顯示 因為字元有輸出限制所以沒折行，右邊的斜線裝飾框就能正常顯示在區塊的右邊距了! 備註說明：如果是自行開發模組不用那麻煩，只要在php輸出