WordPress 更改未在移動設備上顯示? 常見問題解答和修復。
已發表: 2021-12-07披露:這篇文章包含附屬鏈接。 當您單擊此帖子中的產品鏈接時,我可能會收到補償。 有關我的廣告政策的說明,請訪問此頁面。 謝謝閱讀!
內容
- 為什麼我的 WordPress 更改未在移動設備上顯示?
- 確保您的 WordPress 主題具有響應性。
- 插件。
- 如何在 WordPress 上更新我的移動網站?
- 為什麼我的網站在移動設備上看起來不一樣?
- 移動優化。
- 並非所有瀏覽器都支持響應式設計。
- 如何使我的 WordPress 網站適合移動設備?
- WordPress 更改未在移動設備上顯示。 概括。
為什麼我的 WordPress 更改未在移動設備上顯示?
如果您對 WordPress 網站進行了更改並且它們沒有出現在移動設備上,那麼您可以檢查一些事項。
在某些情況下,出於設計原因,您的更改可能會在移動設備上隱藏。
但是,如果您確定您的更改應該出現在移動設備上,但實際上並沒有,您可以採取一些措施來解決問題。
確保您的 WordPress 主題具有響應性。
響應式主題將根據正在查看的設備的大小自動調整其佈局。
如果您的主題沒有響應,您的更改可能不會出現在移動設備上。 您可以通過在移動設備上查看您的網站來檢查響應能力。
還要確保您的更改不會出於設計原因而對移動設備隱藏。
要查看是否是這種情況,您可以更改 WordPress 儀表板中的“屏幕選項”選項,或者嘗試在其他瀏覽器(如 Chrome 或 Firefox)上查看該網站,這可能會訪問隱藏的選項。
插件。
如果更改出現在其他瀏覽器上,則可能是插件導致了問題。
如果您的主題是響應式的並且您已經檢查了它的所有設置,請嘗試停用所有插件,然後一次重新激活它們,以檢查哪個插件可能導致衝突。
您還可以創建一個具有相同主題的新 WordPress 站點,以查看更改是否仍然出現。 如果他們這樣做,那麼問題可能與插件有關。
如果您已嘗試所有這些故障排除步驟,但您的更改仍未出現在移動設備上,請聯繫您的託管服務提供商或 WordPress 開發人員尋求幫助。
他們可能能夠幫助確定問題的根源並加以糾正。
如何在 WordPress 上更新我的移動網站?
在 WordPress 上更新您的移動網站實際上可以是一個非常簡單的過程,但是,前提是您了解 PHP 並且熟悉使用它。
如果沒有,請聯繫您的主題開發人員並尋求他們的幫助。
但是,如果您了解 PHP,那麼您需要做的就是按照以下步驟操作:
1. 登錄您的 WordPress 儀表板。
2. 單擊“外觀”菜單,然後選擇“編輯器”。
3. 在編輯器屏幕中,從右側列表中選擇“header.php”文件。
4. 編輯文件並將以下代碼片段添加到文件頂部:
<?php if (is_mobile()) { ?>
<link rel=”stylesheet” href=”http://www.yourdomain.com/wp-content/mu-plugins/mobile_stylesheet.css” type=”text/css” media=”screen and (max-device-width : 480px)”/>
<?php } ?>
5. 刷新您的移動網站,或者將新鏈接複製到您手機的瀏覽器中以檢查它是否按預期工作。
6. 最後,保存您的更改並使用 FTP 或您通常用來更新 Web 服務器上的文件的任何方法將它們上傳到服務器。
為什麼我的網站在移動設備上看起來不一樣?
您的網站在移動設備上看起來不同的原因有幾個,讓我們嘗試對其進行故障排除。
首先,重要的是要了解並非所有網站都是平等的。 網站以不同的方式設計,具有不同的內容,並在不同的設備上查看。
當您在移動設備上查看網站時,所有這些因素都會影響您所看到的內容。
您的網站也有可能無法在某些或所有移動設備上正確顯示。
許多網絡瀏覽器為其網站使用內置格式,但有時他們不會將該格式或這些功能提供給其他網站。
讓我們來看看您的網站在移動設備上可能看起來不同的一些最常見原因,以及您可以採取哪些措施。
移動優化。
您知道您的網站是否有移動版本嗎? 雖然越來越多的網站正在切換到響應式佈局,但並非每個網站都是平等的。 一種尺寸肯定不適合所有人。

響應式佈局針對在任何屏幕尺寸上的顯示進行了優化。 如果您的網站具有移動佈局,它將自動顯示在移動設備上以最適合該設備的屏幕尺寸(無需任何操作)。
如果您不確定您的網站是否有移動版本,請諮詢您的開發人員或託管公司以查看它是否已創建。 如果還沒有,那麼是時候考慮響應式設計了。
並非所有瀏覽器都支持響應式設計。
正如我之前提到的,並非所有瀏覽器都支持響應式設計佈局。 無論您使用哪種設備,有些都會以桌面形式顯示您的網站。
這是因為瀏覽器試圖以設計的方式顯示網站,而不考慮屏幕的大小。
有幾種方法可以解決這個問題:
1)使用媒體查詢。
媒體查詢允許您根據屏幕大小更改網站的外觀。 您可以針對不同的設備,或為您的網站設置最大寬度。
為此,您需要根據您的主題了解一些 CSS 和/或 PHP。
許多主題支持論壇可以幫助您解決此類問題。 GeneratePress 就是其中之一。
相信我,如果你有這個問題,其他人以前也有這個問題。
2) 您可以使用 Google 的 Viewport Resizer – 響應式測試工具或使用 WPtouch 之類的插件。
這些將有助於改變您的網站查找移動設備的方式,而無需您進行任何編碼。
3) 使用響應式主題或具有移動佈局的主題。
如果您不確定您的主題是否響應,請查看開發者的網站或聯繫他們以查看它是否可用。
4) 移動設計指南。
您可以使用一些準則來確保您的網站在移動瀏覽器上正確顯示,包括內容元素的大小、圖像顯示方式等。
這是確保您的網站對所有用戶(台式機或移動設備)看起來良好且功能良好的重要一步!
官方的 WordPress 移動應用程序頁面也有很多關於創建網站移動版本的提示(如果你沒有的話)。
如何使我的 WordPress 網站適合移動設備?
答案又是,這取決於您的 WordPress 主題。
大多數 WordPress 主題都是開箱即用的移動設備友好型,但也有一些例外。
如果您的主題不適合移動設備,那麼您將需要使用插件或對主題進行一些更改。
首先,讓我們把顯而易見的部分排除在外:您的 WordPress 網站應該託管在快速可靠的託管服務提供商上。
如果您的網站速度慢或反應遲鈍,那麼 Google 會降低您的排名。 這意味著即使您的網站在移動設備上看起來不錯,也沒關係。
許多 WordPress 託管服務提供商沒有報告其共享託管計劃的響應時間。
但是,如果您在其他地方託管您的網站,那麼 Pingdom 工具插件是查看頁面加載速度的好方法。
影響移動設備友好性的第二件事是圖像的大小。 如果您有大而重的圖像,那麼 Google 將無法在移動設備上顯示它們。
如果您的頁面即使在快速連接上也需要很長時間才能加載,那麼 Google 會降低您的排名。
解決方案很簡單:使用 TinyPNG WordPress 插件。 該插件通過使用 TinyPNG 的基於雲的服務優化它們來減小所有圖像的大小。 該插件可壓縮 JPEG、PNG 和 GIF 圖像。
當您使用 TinyPNG 優化了所有圖像後,您需要檢查 Google 移動友好測試中的頁面。
您還可以使用您的移動設備或移動模擬器來查看它在不同設備上的外觀。 如果某些東西看起來不太好,那麼您可以進行必要的更改。
如果您的網站仍然不適合移動設備,那麼您需要為自己準備一個響應式 WordPress 主題。
響應式主題將根據正在使用的設備自動調整網站的大小和佈局。
有很多響應式主題可用,但我個人最喜歡的是 Tom Usborne 的 GeneratePress 框架。
這是一個輕量級的主題,具有很多功能。 它沒有您在大多數主題中找到的所有臃腫和無用的選項。 相反,它專注於使您的網站響應迅速。
這個主題最好的部分是它可以通過 WordPress 定制器完全定制。 您無需編寫任何代碼即可設計自己的主題。
使用免費和付費的 WordPress 插件也很容易擴展該主題。 我已經在這個站點上安裝了幾個插件來添加額外的功能,但是如果你不需要它,你不必安裝任何東西。
如果您使用不同的主題,那麼您應該查看 Google 的指南以使您的主題適合移動設備。
該指南有幾個部分需要完成。 例如,如果您使用高級主題,那麼它將具有您需要檢查的小部件區域。
如果您的網站不適合移動設備,那麼 Google 可以懲罰您的排名,甚至關閉您的整個網站。
確保您的網站在所有設備上的外觀和效果都很好,這一點很重要。
WordPress 更改未在移動設備上顯示。 概括。
很明顯,WordPress 團隊一直在努力讓用戶在每次更新時獲得更適合移動設備的體驗,而且隨著時間的推移,這種體驗只會越來越好。
最新更新的發布加大了力度,讓人們在手機和平板電腦上更輕鬆地瀏覽您的網站,讓他們可以快速訪問您瀏覽次數最多的內容。
這篇博文的結論是,即使您更新了 WordPress 網站,更改也不會總是顯示在移動設備上或立即顯示。
確保在選擇網站主題甚至網頁設計時考慮所有設備非常重要,因為有許多不同的人對查看內容有許多不同的偏好。
因此,請始終為自己準備一個響應迅速且旨在與所有設備(包括移動設備)配合使用的主題,例如 GeneratePress!