by Rain Chu | 11 月 18, 2021 | PHP, woocommerce, wordpress
WooCommerce 預設安裝好會在結帳畫面中,出現「配送道不同的地址」的選項,並且預設是勾選起來的,常常有客戶需要把這個選項關閉,或是隱藏他,做法很多種,我這邊是以複製該 template 到自己的子佈景主題中,然後修改 PHP 的程式碼為主
- 先複製 wp-content/plugins/woocommerce/templates/checkout/form-shipping.php 到 wp-content/themes/[themes-child]/woocommerce/checkout/form-shipping.php
sudo cp /var/www/html/wp-content/plugins/woocommerce/templates/checkout/form-shipping.php /var/www/html/wp-content/themes/themes-child/woocommerce/checkout/form-shipping.php
2. 修改 form-shipping.php 的內容,將預設選項移除,以及將整個欄位隱藏
原先的程式碼如下
<h3 id="ship-to-different-address">
<label class="woocommerce-form__label woocommerce-form__label-for-checkbox checkbox">
<input id="ship-to-different-address-checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox input-checkbox" <?php checked( apply_filters( 'woocommerce_ship_to_different_address_checked', 'shipping' === get_option( 'woocommerce_ship_to_destination' ) ? 1 : 0 ), 1 ); ?> type="checkbox" name="ship_to_different_address" value="1" /> <span><?php esc_html_e( 'Ship to a different address?', 'woocommerce' ); ?></span>
</label>
</h3>
修改後的程式碼如下
<h3 id="ship-to-different-address" style="display:none" >
<label class="woocommerce-form__label woocommerce-form__label-for-checkbox checkbox">
<input id="ship-to-different-address-checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox input-checkbox" <?php checked( apply_filters( 'woocommerce_ship_to_different_address_checked', 'shipping' === get_option( 'woocommerce_ship_to_destination' ) ? 1 : 0 ), 0 ); ?> type="checkbox" name="ship_to_different_address" value="0" /> <span><?php esc_html_e( 'Ship to a different address?', 'woocommerce' ); ?></span>
</label>
</h3>
其中在 <h3> tag 中,加入 style=”display:none” ,在 ‘shipping’ === get_option 中,把傳回的數值調整成0,代表預設不會勾選,這樣就可以隱藏運送到不同的地址的選項了
參考資料
by Rain Chu | 11 月 12, 2021 | woocommerce, wordpress
WooCommerce PDF Invoices & Packing Slips
解決 WooCommerce PDF Invoices & Packing Slips 無法顯示中文字
其實這套免費的 PDF 發票、撿貨單,超多人使用,但可惜的一點是沒法顯示亞洲的字型,但其實她們也都知道有這些問題,早就都留有解決方案,解決的步驟如下
1.原廠的解決方案
先看原廠的寫的中文支援解決方案文章,
2.建立template
將 Plugin 中的 wp-content/plugins/woocommerce-pdf-invoices-packing-slips/templates/Simple/ 下面的資料全部複製一份到 wp-content/themes/my-(child)theme-folder/woocommerce/pdf/my-template/
3.下載中文字型(ttf)
可以用原廠推薦中文字型,可以採用 adobe 或是 google 的開放字型,但要注意的是目前只支援 ttf 檔案格式的字型,下載完畢後要解壓縮並且放到 wp-content/themes/my-(child)theme-folder/woocommerce/pdf/my-template/fonts 中
4.修改 my-template 中的 style.css
找到 template 下的 style.css 並且多加入下面的程式碼
/* Load font */
@font-face {
font-family: 'MyFont';
font-style: normal;
font-weight: normal;
src: local('MyFont'), local('MyFont'), url(<?php echo $this->get_template_path(); ?>/fonts/myfont.ttf) format('truetype');
}
@font-face {
font-family: 'MyFont';
font-style: normal;
font-weight: bold;
src: local('MyFont Bold'), local('MyFont-Bold'), url(<?php echo $this->get_template_path(); ?>/fonts/myfont-bold.ttf) format('truetype');
}
@font-face {
font-family: 'MyFont';
font-style: italic;
font-weight: normal;
src: local('MyFont Italic'), local('MyFont-Italic'), url(<?php echo $this->get_template_path(); ?>/fonts/myfont-italic.ttf) format('truetype');
}
@font-face {
font-family: 'MyFont';
font-style: italic;
font-weight: bold;
src: local('MyFont Bold Italic'), local('MyFont-BoldItalic'), url(<?php echo $this->get_template_path(); ?>/fonts/myfont-bolditalic.ttf) format('truetype');
}
並且找到 style.css 中的 body 區段,並且將字型指向 MyFont
body {
background: #fff;
color: #000;
margin: 0cm;
font-family: 'MyFont';
/*font-family: 'Open Sans', sans-serif;*/
/* want to use custom fonts? http://docs.wpovernight.com/woocommerce-pdf-invoices-packing-slips/using-custom-fonts/ */
font-size: 9pt;
line-height: 100%; /* fixes inherit dompdf bug */
}
5.啟用新的 template
要回到進入外掛後台,並且在 template 中選剛剛建好的模板,並且啟用 Enable font subsetting,可以降低 PDF 文件大小
參考資料
相關文章
by Rain Chu | 11 月 12, 2021 | PHP, woocommerce, wordpress
雖然說網路上開店最棒的優勢就是可以 24 x 7 的不間斷賺錢,但是如果是線下升級成線上的店家們,會需要配合公司政策,一天開店八小時,假日不開店或是配合結帳時間,月底不收單等
WooCommerce 實現關店的想法
- 建立關店時間表
- 依照時間表判斷是否要開店
- 關店的狀態是要把 WooCommerce 的訂單按鈕都關閉以及隱藏起來
- 顯示訊息告知使用者現在關店中
WordPress Plug or Themes PHP 撰寫
以下示範每個月25號到月底作帳時間內,不讓客戶下單的寫法
// 啟動商店的假日檔
add_action ('init', 'qqqtips_woocommerce_holiday_mode');
// Disable Cart, Checkout, Add Cart
// 將下單相關的按鈕都關閉
function qqqtips_woocommerce_holiday_mode() {
//remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
//remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
//remove_action( 'woocommerce_proceed_to_checkout', 'woocommerce_button_proceed_to_checkout', 20 );
//remove_action( 'woocommerce_checkout_order_review', 'woocommerce_checkout_payment', 20 );
add_filter( 'woocommerce_is_purchasable', '__return_false'); //
add_action( 'woocommerce_before_main_content', 'qqqtips_wc_shop_disabled', 5 );
add_action( 'woocommerce_before_cart', 'qqqtips_wc_shop_disabled', 5 );
add_action( 'woocommerce_before_checkout_form', 'qqqtips_wc_shop_disabled', 5 );
}
// Show Holiday Notice
// 每月25號關帳,次月1號打開
function qqqtips_wc_shop_disabled() {
$qqq_today = number_format(date('d'));
if( $qqq_today >= 25 && $qqq_today <= 31) {
wc_print_notice( '店家已經關帳,請下個月再來!', 'error');
}
}
參考資料
Open Close Store Hours for WooCommerce
相關文章
by Rain Chu | 11 月 10, 2021 | woocommerce, wordpress
在 woocommerce 中,收到客戶的訂單,常常需要列印一張出貨訂單附給客戶,或者是寄一個EMAIL,裡面含有出貨明細,又或者是要用到物流,需要列印物流資訊,貼在紙箱外殼中,找了 一下好用的 woocommerce plugs 覺得這套簡單且功能強大,就拿出來推薦給大家下。
自動將發票 PDF 附加到 WooCommerce 電子郵件
從訂單管理頁面可以下載 PDF 發票/裝箱單
批量生成PDF發票/裝箱單
完全可定制的 HTML/CSS 發票模板
讓客戶可以從“我的帳戶”頁面下載發票
可以自定義發票編號順序
可用語言:捷克語、荷蘭語、英語、芬蘭語、法語、德語、匈牙利語、意大利語、日語、挪威語、波蘭語、羅馬尼亞語、俄語、斯洛伐克語、斯洛文尼亞語、西班牙語、瑞典語和烏克蘭語
by Rain Chu | 11 月 9, 2021 | wordpress
推薦使用 SVG Support
WordPress 在最近的版本,因為 SVG 的漏洞,預設是禁止使用 SVG 的圖形檔案的,但客戶們的 LOGO 以前都習慣用 SVG 的檔案格式,因為向量檔可以讓 LOGO 無損的呈現,我們可以透過自己修改 functions.php 來讓 WordPress 支援 SVG 檔案,但這樣要怕會有安全問題,雖然你可以藉由限制讓使用者無法自由的上傳 SVG 檔案,但我認為最快的方法還是利用別人開發好的 Plug-in 來實現 SVG
功能較佳,所以這次推薦 SVG Support。
瞭解 SVG 漏洞
最主要的問題是,SVG 文件是可以添加 JavaScript 的,一但有添加 JavaScript 的能力時候,就可以寫程式去抓取 cookie 造成隱私權漏洞或是執行有害的程式碼。
參考資料
Manually Enable SVG File Uploads
by Rain Chu | 11 月 5, 2021 | Linux, Ubuntu, wordpress
Linux Net-tools
Ubuntu Linux 安裝起來後,常常需要查詢自己的 IP Address ,方便 SSH 或是 FTP 連線,但不知為何,常用的 ifconfig 的指令沒有內建進來,常常需要額外去安裝,安裝不是簡單的使用 apt install ifconfig,而是需要安裝網路工具箱 apt install net-tools。
sudo apt install net-tools
安裝完成後,就可以使用 ifconfig 查詢 IP 資訊了
近期留言