專注於企業網站架設,分享WordPress教學和Elementor教學
不用充值便可免費試用3天的Cloudways超快獨享主機,獨家優惠碼:LOYSEO,前2個月可優惠30%,感謝你的互惠互助

架設網站教學

如何檢查網站元素?

要查看網站由哪些不同元素組成,或者是測量網頁裡各元素的尺寸,您可以使用瀏覽器的元素檢查工具。每個瀏覽器啟動檢查工具的流程不太相同,接下來我們逐一看看谷歌瀏覽器、火狐、Opera、IE瀏覽器的。谷歌瀏覽器只需右鍵單擊網站的任何區域,在右鍵菜單裡選擇檢查/Inspect即可打開,你也可以使用鍵盤快捷鍵:Ctrl+Shift+I。如果要查看網頁裡包含的錯誤情況,可以點選元素旁邊的控制台選項卡查看。

Robots.txt文件教學

什麼是Robots.txt文件?它有什麼作用? Robots.txt 是網站裡的一個文件,它告訴搜索引擎抓取工具(蜘蛛)禁止或允許抓取網站的哪些內容。主流搜索引擎(包括Google、Bing 和Yahoo)都能夠識別並尊重Robots.txt的要求。如需查看網站是否有Robots文件,請訪問網址:網域/robots.txt,譬如https://loyseo.com/robots.txt,下

WooCommerce: 如何刪除“Default Sorting/默認排序” 下拉選項

如果WooCommerce的產品排序功能對你而言是沒用的(即下圖中的default sorting下拉選項),你可能想把它從頁面上刪除。接下來這個PHP 代碼段簡直比CSS還簡單清爽,你只需要把我的代碼段添加到Code Snippet外掛中。 WooCommerce: 隱藏 “Default Sorting” 下拉選項PHP Snippet 1: 從wo

WooCommerce:如何給產品列表的“默認排序”刪除、重命名、添加的排序選項

我們之前已經說過:如何完全刪除WooCommerce 商店、產品列表頁面中顯示的“默認排序”下拉選項。但是,有時你可能只需要刪除默認選項中的一個,或者重命名這些選項,甚至是添加新的排序選項。像往常一樣,多虧了WooCommerce 掛鉤和過濾器,幾行PHP 代碼就可以實現這個目標。 PHP 代碼段#1:在WooCommerce產品列表中刪除某個排序選項/** * @snippet Re

WooCommerce: 在後台尋找沒有重量的產品

如果你的運費取決於產品的重量,可能也會出現忘記給某些產品添加重量的情況,這樣一來,在WooCommerce結賬頁面上,運費可能就要被少算了。因此,我們看看如何在WordPress儀表板>產品列表上展示一個通知,列出沒有重量的產品,以及提供快速編輯它們的鏈接,就像下圖這樣。 PHP Snippet: 在WooCommerce後台尋找沒有重量的產品

WooCommerce: 如何在商店中先展示有貨商品

我們已經學到如何在WooCommerce Shop頁面的“默認排序“下拉菜單中添加一個自定義的“產品排序“選項。然而,我所面臨的任務是根據一個自定義的“元鍵/Metakey “來顯示商品。現在,如果你不知道“元鍵/Metakey “是什麼,不用太擔心。例如,”_stock_st

WooCommerce:在購物車頁面上顯示產品庫存

我們已經講過如何在商店頁面上顯示產品的庫存數量和狀態,今天我們將對購物車頁面做類似的事情,以便我們可以直觀地向購物客戶顯示產品的庫存狀態和數量。 (見下圖) 請注意:為了使代碼段起作用,您必須在WooCommerce設置中啟用“庫存管理/stock management”,並且購物車中的每個產品都必須選中“管理庫存/managing stock”,如果允許缺貨下單,則必須選中“允許但通知客戶”,否則

WooCommerce:在後台按庫存對產品進行排序

我們已經學過瞭如何將前台的產品按有貨在先和無貨在後進行排序,但對於後台的管理員和商店經理來說,如何做到完全相同呢?有時商店存在大量“已售/無貨“的產品,產品表看起來亂亂的(有貨和無貨穿插混合),本文介紹的方法可以實現:當訪問產品列表時,即:/wp-admin/edit.php?post_type=product,所有產品將按庫存狀態(有貨->無貨)排序。一旦下面的代

WooCommerce:在結帳頁面上顯示產品圖片

WooCommerce 結賬頁面的訂單審查部分顯示了產品名稱、數量和費用,但沒有產品圖像,產品圖像對於識別/區分相似產品或產品變體非常有用。這個簡單的代碼段將幫助你在訂單審查頁面中展示產品的特色圖片。通過添加下面的PHP代碼段,您可以在結帳頁面中的產品名稱快速顯示產品特色圖片PHP代碼段:添加產品特色圖片到woocommerce的結帳頁面的訂單審核表中請注意,下面的片段將生成一個尺寸為50

WooCommerce:在商店頁面上顯示庫存狀態/數量

在本教學中,我的目標是在WooCommerce商店、產品列表頁面中,在每個產品下方展示“庫存數量或狀態”。這跟在單個產品頁面顯示的庫存是完全一樣的,請前往/wp-admin/admin.php?page=wc-settings&tab=products§ion=inventory“設置庫存顯示格式”。 WooCommerce:在商店頁面上展示庫存數量PHP 代碼段:在

WordPress:如何更改WordPress登錄頁面的Logo

本篇教學將教你如何更換或自定義wordpress登錄頁面上的logo(如下圖所示示例),默認的logo是wordpress官方的logo,我們要用短代碼的方式將它更換掉。自定義了登錄頁面的logo,並且點擊logo鏈接到自己的網站而不是wordpress.org PHP / CSS 代碼段:自定義wordpress登錄頁面的logo和logo鏈接/** * @snippet Replace

WooCommerce:在購物車和結算頁面顯示所購產品總重量

在使用WooCommerce的跨境電商獨立站中,如果你想在購物車和結算頁面向客戶展示它所加購的產品的總重量,那麼,可以在Code snippet外掛中插入下面的php代碼段,不需要任何額外外掛就能實現這個功能,真棒棒~ 代碼如下: 說明:我在使用這個代碼段後,在頁面上看到重量信息時,頁面佈局有點錯亂,這個時候需要有一點CSS代碼知識,這個應該跟主題外掛的使用有關,所以此處我沒辦法給出一個統一的答案

2021年最好的WordPress頁面編輯器是誰?用數據分析一下

Elementor、Divi、Beaver Builder、Visual Composer、WPBakery、Brizy…我深度用過Elementor、WPBakery,為了試試能否撼動Elementor的地位,我體驗了Divi、Brizy,翻閱各種國外的對比文,然後拿Ahrefs給他們做了流量數據分析,最終,王者依舊是我的心頭好:Elementor。本文不細說功能,他們都是拖拽式積

B2B企業獨立站:如何用Astra主題製作

本文全篇17800+字,一步步講解如何用:Cloudways主機、 Astra主題製作B2B企業獨立站,零經驗的你也能建個靠譜的企業獨立站,只要肯花點時間照著步驟做就能行~ 本文選用的Astra主題,速度快、質量有保證,配套的功能外掛也都是選擇了用戶多、評價好的外掛,對起步階段的企業Soho自架設網站很有幫助~ 架設網站要花多少錢?網域費用:65元左右/年主機費用:800元左右/年主題費用:159

如何在WordPress中刪除谷歌字體、本地託管谷歌字體(3種簡單方法)

許多WordPress主題都會用Google字體,然而,Google字體並不存儲在網站本地,它是一個第三方資源,這會影響網站的加載速度,讓網站變慢,尤其當你的網站面向的是國內用戶時,更需要禁用Google字體。起初,我用Code snippets的代碼段來移除主題的谷歌字體,然而發現依舊有漏網之魚,我又不願意去細究代碼,所以,就找到了兩個簡單的方法來刪除網站中的谷歌字體,以利於提升網站速度。如

Avada教學– 同時與Elementor對比

本文是用Avada的實操教學來講解“為啥勸你不要用Avada”的勸退系列。不用Avada,我們能省下很多時間和腦細胞還有教學費。 Avada是Themeforest上熱賣top1的主題,幾年前我在接觸WordPress架設網站時,接觸的第一個主題就是它。國內看到的最多的WordPress架設網站教學,也是基於Avada,包括很多企業網站架設教學的推薦主題也是Avada,那個時候頁面編輯還是用的後端編輯器,做完

如何給產品頁面添加詢盤表單標籤頁

默認Woocommerce產品頁面是沒有詢盤聯繫表單的,用免費外掛Custom Product Tabs for WooCommerce可以給產品頁面添加詢盤聯繫表單標籤頁。下圖是添加完詢盤表單標籤頁的最終效果,這是我在Astra企業網站架設教學中的示例。教學思路:用外掛Custom Product Tabs for WooCommerce添加一個標籤頁,其中放入用Ninja forms製作的聯繫

如何通過數據庫修改WordPress網站用戶名與密碼

如果你忘記了你的WordPress網站的用戶名和密碼,只要能進數據庫,都能分分鐘修改密碼。此外,如果你使用了我在B2B企業網站架設教學中的製作的模板站,也需要用這個方法修改用戶信息和密碼。首先,請在主機的管理面板中找到數據庫的管理入口,通常是phpmyadmin。以Siteground主機為例,在Sitetools中,進入左側菜單:Site>MySQL,就能找到數據庫管理入口。如果你用的主機

Brizy頁面編輯器使用體驗,順便對比Elementor

Brizy跟Elementor一樣,都是WordPress頁面編輯器。 Elementor很棒,但Brizy提供了一個直觀的雲模板庫功能,也就是用Brizy做的頁面模板或模塊模板,都可以同步到雲端,然後在其他網站上都能同步下來直接使用,為此我買了Brizy Pro來體驗。感受:Brizy雲模板庫的功能確實不錯,Elementor雖然有外掛Templately能夠提供同樣的雲模板庫功能,但是不能直觀

ChemiCloud主機:選購注意事項、架設網站教學、速度測評

我執著於尋找性價比高、速度快、服務好的WordPress主機用於企業網站架設。 Chemicloud是我在用Ahrefs挖掘WordPress主機,以及Siteground、GreenGeeks的同行時找到的,它是一家年輕的主機商,成立於2016年,目前4歲,通過Ahrefs探查它的自然用戶流量,月均2000+,Trustpilot用戶評價4.9/5分,來自111名用戶評價,0差評。鑑於它的價格屬

如何將WordPress菜單固定在頁面頂部

通常付費的WordPress主題都會提供菜單固定在頁面頂部的功能,英文名sticky header,而如果使用免費WordPress主題,那則不一定提供導航固頂功能。此時,我們可以使用外掛來實現:將WordPress菜單固定在頁面頂部。安裝外掛並激活:Sticky Menu, Sticky Header (or anything!) on Scroll 我們在WordPress後台的settin

Hostinger主機:架設網站教學與評測

Hostinger是一個成立於2004年、大眾點評4.4分(滿分5分)、價格較低的WordPress架設網站服務器。本文將詳細介紹:對比Hostinger的主機套餐、購買Hostinger的過程、使用Hostinger如何架設網站、基於Hostinger的網站速度測試等等。 Hostinger分了全球各種子網站,而且同配置主機價格也不一樣,所以難免眼花(我已經眼花了)。 Hostinger主機怎麼樣我評

如何高性價比的購買Elementor Pro與避坑

擁有Elementor Pro讓架設網站就跟拼圖一樣方便了,那如何省錢的購買Elementor Pro呢?如何避開坑呢?下面分享自己的實踐經驗。 (還不了解Elementor的點這裡) 避坑:不要用Elementor Pro破解版破解版的主要風險在於:安全風險。一方面,作為不懂代碼的我們,不知道破解的人在安裝包裡植入了什麼,我親身經歷過黑鏈植入(是的,我曾經也想著用用免費的); 另一方面是,外掛不能

如何安裝WooCommerce

當你使用WordPress搭建一個企業網站時,尤其是B2C企業賣貨網站(又或者叫做跨境電商),大概率會用到WooCommerce來管理產品、訂單、配送、收款等等。本系列的WooCommerce教學是基於官方文檔以及我的操作實踐,在閱讀本文前,建議先閱讀我的B2B企業網站架設教學,先搭建一個B2B企業網站,然後再深入WooCommerce的電商功能。友情提醒:在接下來的操作實踐中,你可以直接右鍵翻譯界

如何在WooCommerce中管理產品類別、標籤和屬性

在使用WordPress進行企業網站架設時,如果你的產品類目和產品較多,那使用WooCommerce來管理產品是提高效率的最佳選擇,本篇是WooCommerce教學系列之一,將詳細講解如何在WooCommerce中管理產品分類、標籤和屬性。產品類別產品類別是對具有相似功能的產品進行分組的主要方法。如果你需要,還可以添加子類別。例如,如果你是銷售服裝的,則可能添加產品類別:“ T卹”,“帽衫”和“

如何用WooCommerce管理和添加產品

在使用WordPress進行企業網站架設時,如果你的產品較多,那使用WooCommerce來管理產品是提高效率的最佳選擇,本篇是WooCommerce教學系列之一,將詳細講解如何在WooCommerce中添加和管理產品。

Cloudflare教學:如何網域解析與開通免費的CDN

Cloudflare不僅能提供網域解析服務,還能提供一鍵開通的免費CDN,以便增加網站安全和提升網站訪問速度,本文將介紹如何將你的網域解析服務器更換為Cloudflare的,並使用Cloudflare的免費CDN。步驟概要: 註冊一個Cloudflare賬號; 添加你的網站到Cloudflare中,獲取Cloudflare的網域解析服務器(NS); 前往你的網域註冊網站,修改網域解析服務器(NS

WooCommerce如何添加可變產品

如果你的企業網站架設的是零售商城,你很大可能會用到WooCommerce的可變產品,它是WooCommerce中的一種產品類型,允許你提供產品的一組變體,並控制每個變體的價格、庫存、圖像等。它們可以用於像襯衫、鞋子、口紅這樣的產品,你可以提供大號、中號和小號以及不同的顏色,下圖是一個鞋子商品的展示示例,本篇是WooCommerce教學系列之一,將詳細講解如何在WooCommerce中添加可變產品。

如何使用WooCommerce的12個小工具(Widgets)

WooCommerce小工具可以讓你在WordPress企業網站架設時,添加不同產品功能到頁面上,譬如展示最新產品、產品分類、搜索產品、產品價格篩選等等。如下圖所示,這些小工具位於WordPress後台的外觀》小工具頁面中,你可以將它們添加到網站主題設定的區域中。下圖中右側的主側邊欄、頁面小工具區域1等便是區域,網站主題是指你安裝並啟用的WordPress主題,不同主題提供的區域有所不同,並且不同主

如何為WooCommerce可變產品屬性啟用色板選項

我們在企業網站架設時,如果搭建的是零售商城,譬如出售鞋子、衣服,那麼一定會用到可變產品色板選項功能,讓你的客戶可以直觀的選擇尺碼、顏色、樣式等等。本篇教學講解如何使用外掛Variation Swatches for WooCommerce實現產品色板功能。

如何解決國內WordPress網站無法更新和安裝外掛的問題?

最近我開始折騰國內的LOYSEO企業網站架設教學分享網站,目的是為了體驗一下百度SEO?,趁著雙11買了很划算的騰訊主機(700元多3年2核4G3M帶寬),買了網域做了備案,在寶塔面板中安裝WordPress後,後台界面提示更新WP,結果更新失敗,原因是國情使然,於是谷歌一下便找到了非常簡單的解決方法——手動安裝一個WP China Yes外掛,請點擊此處前往外掛官網下載,因為WordPress插

如何從速賣通(AliExpress)快速導入產品到WooCommerce商店

在企業網站架設中,如果你做的是B2C dropshiping企業獨立站,那這款一鍵導入速賣通商品到你的WooCoommerce商店的外掛就非常棒了,它的名字是Aliexpress dropshipping for Woocommerce by theShark。這個外掛免費版可以每月導入160個產品,每週導入50個產品,如果要導入不限量產品,就購買付費版吧。首先,請你到網站後台安裝外掛界面,輸入w

WooCommerce如何設置與添加可下載產品

在使用WordPress架設網站時,如果你銷售實物的同時還提供電子文件,譬如賣實體書的同時還提供電子書,又或是像我一樣銷售主題、外掛、模板,那就能用上WooCommerce的可下載產品功能了。本篇是WooCommerce教學系列之一,將詳細介紹WooCommerce如何設置與添加可下載產品。可下載產品的功能設置進入: WooCommerce > Settings > Prod

10個WordPress常用代碼段(Code Snippets)

運用代碼段(Code Snippets)外掛管理代碼,可以不用額外安裝更多外掛,來解決WordPress架設網站過程中的一些常見功能需求,譬如安裝Google analytics跟踪代碼。下文中記錄了我在企業網站架設和個人博客中常用到的代碼段。如何在WordPress文章/頁面上禁止加載WooCommerce .js(javascript)和.css文件? woocommerce會在每個頁面都默認加載幾

適合Elementor編輯器的最佳搜索過濾外掛

在企業網站架設過程中,添加搜索過濾器能夠為用戶提供便捷和提高滿意度。本文中,我們在網上蒐集了WordPress的最佳搜索過濾外掛,並介紹了它們的優缺點及使用指南。當一個網站上的產品和文章越多,瀏覽起來就越困難,對於房地產、電商和餐館列表等網站來說尤其如此。想像一下,您正在網上瀏覽本地的餐館名單,以便找到一家披薩店。如果你不得不單獨瀏覽每一家餐館的列表去查看是否提供披薩、服務好不好、價格如何,那這個

如何在WooCommerce中設置運費(免費功能)

這篇WooCommerce教學,我們使用WooCommerce自帶的免費的運費配置功能來講解如何設置運費。基本思路是:1.設置配送區域,2.向這些配送區域添加配送方法,3.在配送方法中添加運費費率。你可以按需創建多個配送區域,並為每個配送區域添加多種配送方法和運費費率。免費的運費配置功能是有限的,如果本文無法滿足的你的運費配置需求,可以查看付費運費外掛的配置教學:如何配置WooCommerce運

如何實現下載文件前必須提交郵箱

我在企業網站架設服務時,有些客戶希望download頁面的產品目錄、測試報告等文件的下載需要用戶先提交郵箱,然後以郵件的形式發送文件的下載地址到用戶提交的郵箱裡,本文就來介紹如何在WordPress中實現這個功能,且不需要購買付費外掛。實際效果演示首先,我們看一下該功能的實際效果,如下圖所示,這是一個download頁面,內含3個文件,當用戶點擊文件下的Free download按鈕時,頁面內會展

WordPress頁面教學

這篇WordPress頁面教學介紹瞭如下內容:什麼是頁面,頁面具有哪些功能,如何製作頁面,如何將頁面添加到網站菜單中,如何給頁面添加SEO標題、關鍵詞、描述。

如何配置WooCommerce運費費率表Table Rate Shipping

本篇教學是針對Woocommerce的付費外掛Table Rate Shipping(運費費率表)的,我們在進行B2C的購物型企業網站架設時,可以使用到它配置複雜的運費計算規則。如果運費規則簡單,那可以使用WooCommerce自帶的功能配置運費。運費費率表外掛能夠創建複雜的、適用於全球配送範圍的運費規則。您可以根據產品的配送區域,配置多個運費費率表,也可以針對每個地區設置多個運費費率表,還可

Elementor Pro的許可證密鑰可以更換綁定的網域嗎?

可以的。如果您已經購買Elementor Pro,並且想要將許可證從一個網站轉移到另一個網站,有如下兩種操作方法。 1.在原網站的WordPress後台中,斷開Elementor授權,然後在新網站中激活。 2.登錄Elementor賬戶中心,進入授權網站頁面,將原網站停用,然後在新網站激活。那已經被停用Elementor Pro授權的網站會有什麼影響嗎?針對已經做好的網頁,內容設計都不會受到影

WooCommerce優惠券教學

WooCommerce優惠券功能可以幫助我們向客戶發放折扣、優惠,能夠實現商品的促銷。如果想要使用WooCommerce優惠券功能,請按如下步驟啟用該功能: 進入: WooCommerce > Settings > General 勾選 Enable the use of coupon codes,然後保存添加優惠券添加優惠券碼和介紹進入: Ma

如何解決WooCommerce產品標籤篩選顯示數量不全、無法排序的問題

我遇到一個問題:在WooCommerce產品列表的側邊欄中,Product tags標籤雲的tags顯示不全,後台有50多個標籤,但實際只展示了40多個,由於我是代碼手殘黨,所以找大佬要到了解決方案: 首先,安裝code snippet外掛,然後,添加如下代碼段,其中$args['number'] = 100中的100即為顯示的標籤數量上限,請按需修改這個數值。如果希望產

WooCommerce支付教學:如何添加PayPal標準支付

從收款角度來說,企業網站架設分為兩種,一種不需要客戶在線付款(屬於B2B企業網站,以獲得詢盤為目標),一種需要客戶在線付款(屬於B2C企業網站,多見於零售批發)。本篇是WooCommerce教學之一,介紹的是WooCommerce B2C企業網站常用的用戶付款方法:PayPal標準付款——它能在用戶下單後,將用戶從你的網站帶到paypal去為訂單付款。需要知道的是,如果你的商城是面向國內用戶的,那

如何在WooCommerce產品列表中展示變體產品的最低價格

我們在用WooCommerce進行企業網站架設時,如果銷售的某產品存在多種屬性且價格不同,那麼在產品列表和產品詳情中查看到該產品價格將會是一個區間,格式是:最低價~最高價。如果你希望在產品列表頁中僅展示產品的最低價,而在產品詳情頁還保持區間價展示,那麼下面這段代碼就能夠實現你的需求。首先,請安裝Code Snippet外掛然後,添加一個snippet,將下方代碼複製進去添加完後就是下圖所示的模樣

9個最適合Elementor的免費主題【官方推薦】

本文將介紹官方推薦的最適合Elementor的13款免費主題,LOYSEO博主把它們都用了一遍。隨著Elementor Theme Builder(主題構建器)的發布,您可以使用任何主題並用Elementor Pro設計網站的頁眉、頁腳、文章詳情頁模板和文章列表頁模板。因此沒有Elementor Pro的用戶,可能希望找到:具有用於控制佈局和設計功能的主題。 Hello Elementor 如果

如何隱藏WooCommerce購物車頁面中的價格、總計等列

本文講述:如何用自定義css,隱藏WooCommerce購物車(cart)頁面的產品表中的某些列,譬如隱藏價格列(Price)、總計列(Subtotal)。請進入WordPress網站後台的菜單:外觀>>自定義>>額外CSS,並添加如下CSS,來實現上圖的需求。如上圖所示,添加完代碼後,就能看到購物車中的價格、總計列消失了。你還可以通過code snippet添加cs

WordPress教學– WordPress新手指南(2022)

在本WordPress教學中,您將找到使用WordPress創架設網站所需的一切。從安裝到備份,我們涵蓋了所有內容。此外,本頁底部的有我撰寫的最新WordPress教學列表。首先,我們了解一下WordPress的歷史,如果不想看,那就直接點擊右側的內容目錄跳到你想看的欄目,或者點擊此處前往安裝WordPress教學2003年5月27日,WordPress首次面世。創始人是馬特·穆倫維格和邁克·

Linode主機:優惠券、開通主機、安裝寶塔面板教學

本文將介紹:linode優惠券12張,最高額度有60美金;如何註冊linode;如何在linode開通CentOS7主機;如何在主機中安裝寶塔面板。 Linode優惠券– 新用戶60美金信用額Linode優惠券優惠券碼僅限新註冊用戶使用優惠券碼優惠額度LINODE10 $10 DOCS10 $10 PodcastInIt2017 $20 bootstrapped2017 $

如何用Migrate Guru免費外掛進行WordPress網站搬家或克隆

使用Migrate Guru免費外掛可以實現WordPress網站搬家或克隆,且不論是跨主機操作還是本機操作。本質上,它能夠複製一個網站到目的地而原站不受影響,所以網站搬家也可以說是網站克隆。簡單介紹一下操作的思路:在原網站安裝外掛Migrate Guru,然後輸入新網站的配置信息並提交,待驗證通過後,軟件便會自行搬運網站。第1步,在原網站安裝外掛Migrate Guru並激活它。第2步,

超快獨享主機
Cloudways
免費試用3天,無需充值
費用月結| 不用一次性付整年
*註冊優惠碼Promo code:LOYSEO
*用Gmail郵箱,註冊易通過