如何將Google表格嵌入WordPress(表格或圖表)

[ad_1]

是否需要將Google表格嵌入WordPress?在本文中,我們將教您如何通過兩種方式將Google表格數據添加到WordPress:

  1. 視覺圖表–使用Google表格電子表格生成條形圖,折線圖,餅圖和許多其他格式。

  2. 表格–嵌入Google表格電子表格作為響應表格,以及搜索和過濾器等有用功能。

是否需要將@GoogleSheets添加到#WordPress?這個#plugin可以讓您創建表格和圖表?

點擊鳴叫

我們將逐步向您展示如何使用免費的Visualizer插件執行此操作-無需代碼。

Visualizer如何幫助您將Google表格嵌入WordPress
Visualizer:適用於WordPress的表格和圖表管理器Visualizer:適用於WordPress的表格和圖表管理器

作者: 主題曲

當前版本:3.4.2

上次更新時間:2020年2月17日

visualizer.zip

90%的評價 40,000 +安裝 WP 3.5+要求

全面披露 – 可視化器 是一個ThemeIsle插件。它使您可以從Google表格(和其他來源)中提取數據,並將其轉換為WordPress網站上具有專業外觀的圖形或表格。

此外 創建基本數據表,Visualizer還使您可以訪問各種圖表和表格樣式。您所要做的就是以一種插件可以理解的方式格式化數據,並且 生成現成的圖形 為了你:

使用Visualizer構建的組合圖。「 class =」 wp-image-28602「 width =」 939「 height =」 366

Visualizer還可以幫助您包含具有高級功能的表,例如分頁,內部搜索和過濾。這意味著即使您要導入的數據已經使用了表格,該插件仍然可以幫助您使其變得更加用戶友好。

將Google表格導入為WordPress上的表格「 class =」 wp-image-30062「 width =」 1024「 height =」 689

帶有高級版,您甚至可以自動同步圖表–當您更新Google表格中的數據時,這些更改將自動與您的WordPress網站同步。

如何使用Visualizer將Google表格添加到WordPress(分3個步驟)

如果您想遵循本教程,則需要做兩件事:

  1. 您在Google表格中的現有數據。
  2. 免費的Visualizer插件。在繼續本教程之前,您需要安裝並激活它。

步驟1:添加新圖表並選擇要使用的樣式

啟用插件後,您將可以訪問信息中心內的新「可視化工具」標籤。如果單擊它,將會看到所有現有圖表的列表。單擊頂部的「添加新」按鈕以開始使用:

添加新圖表。「 class =」 wp-image-28603「 width =」 990「 height =」 464

您需要做的第一件事是為Google表格數據選擇一種樣式。您應該選擇哪一個取決於您的數據以及您希望讀者從中獲得的收益:

  • 要嵌入數據表,請選擇「表」圖表樣式。

  • 要嵌入可視圖表,可以從多種不同的圖表樣式中進行選擇。

對於視覺圖表,您需要選擇最能幫助您可視化Google表格數據的樣式。 輕鬆地 有一些很好的提示 如何為數據選擇正確的圖表樣式。

在WordPress上從Google表格創建新的餅圖「 class =」 wp-image-28604「 width =」 988「 height =」 538

步驟2:從Google表格導入數據

使用Visualizer的免費版本,您可以從.csv文件,URL導入數據,或手動輸入數據。要將Google表格添加到WordPress,您應該選擇從URL導入數據選項,然後選擇一次性導入:

從URL導入數據。「 class =」 wp-image-28605「 width =」 814「 height =」 479

暫時保持此標籤打開,然後訪問Google表格即可獲取數據。假設您有一個非常簡單的表格,可以顯示各種水果:

一個簡單的Google電子表格。「 class =」 wp-image-28606「 width =」 691「 height =」 303

數據很容易理解,但是您需要為Visualizer插件提供更多的上下文,以便它了解如何顯示它。為此,該插件 支持多個字元串 它用於對數據進行分類,包括:

  • 布爾值
  • 日期
  • 時間日期
  • 一天中的時間

對於此示例,我們只需要字元串和數字即可。您可以通過在列標題正下方的頂部添加這兩個字元串,讓插件知道哪個列代表哪個元素:

正在將字元串添加到我們的Google電子表格中。「 class =」 wp-image-28607「 width =」 617「 height =」 308

現在,數據已準備好供插件執行其工作。要生成WordPress所需的URL,請打開Goog​​le表格文件菜單,然後選擇發布到網路:

發布Google表格以為WordPress做準備」 class =「 wp-image-28608」 width =「 721」 height =「 554

在彈出的菜單中,選擇整個文檔和逗號分隔的值(.csv),然後點擊發布按鈕:

將Google表格發布到網路上以導入WordPress「 class =」 wp-image-28609「 width =」 742「 height =」 227

現在,Google表格將為您提供一個可用於共享數據的鏈接。複製鏈接並返回到WordPress中的Visualizer嚮導。將其粘貼到相應的欄位中:

從Google表格導入數據到WordPress。「 class =」 wp-image-28610「 width =」 814「 height =」 350

單擊導入按鈕,插件將自動在您的左側生成圖表或表格的預覽:

您的新圖表的預覽。「 class =」 wp-image-28611「 width =」 784「 height =」 430

最後,選擇創建圖表按鈕,Visualizer將圖形保存到您的庫中。

以上相同的過程適用於Visualizer允許您創建的任何圖表,圖形或表格。導入Google表格數據之前,以下是默認表格:

使用Visualizer創建表格。「 class =」 wp-image-29877「 width =」 1024「 height =」 350

Visualizer還使您可以根據表中的元素對元素進行排序。

您可以隨時通過導航到「可視化工具」>「圖表庫」來簽出可用的圖形,圖表和表格:

簽出現有的Visualizer圖表。「 class =」 wp-image-29878「 width =」 1024「 height =」 415

如果您要修改使用插件創建的任何數據可視化效果,則每個視圖下方都有一個編輯按鈕。

步驟3:在WordPress中顯示新圖表

現在您已成功將Google表格數據導入WordPress,並使用它來生成圖表或表格,現在該發布它了。

您可以通過兩種方式將可視化效果添加到帖子或頁面中:

  1. 簡碼
  2. 積木

如果仔細觀察,您會在每個表格或圖表下看到一個簡碼:

展示台庫。「 class =」 wp-image-28612「 width =」 625「 height =」 222

您可以複製該簡碼並將其放置在網站上的任何位置。

第二種方法是打開 塊編輯器 並將Visualizer Chart塊添加到您的帖子或頁面:

在您的帖子中添加可視化圖表塊。「 class =」 wp-image-28613「 width =」 800「 height =」 385

編輯器將詢問您是否要顯示現有圖表或創建新圖表。如果選擇前一個選項,則會看到所有可用圖表的列表–繼續並選擇一個:

使用「塊編輯器」嵌入圖表。「 class =」 wp-image-29879「 width =」 1024「 height =」 429

插入圖表後,就可以像其他任何一個一樣編輯該塊。 Visualizer插件使您可以在旅途中自定義圖表,包括其布局和樣式:

使用「塊編輯器」配置餅圖。「 class =」 wp-image-28615「 width =」 768「 height =」 538

每種圖表類型都有其自己的特定設置,您可以對其進行調整以對其進行自定義。例如,使用表格,您可以自定義分頁選項,並啟用響應能力,以便 在移動設備上可讀

來自Google表格的WordPress上的嵌入式Visualizer表「 class =」 wp-image-29881「 width =」 1024「 height =」 345

請記住,如果您使用的是免費版本的插件,則在Google表格中更改源電子表格後,圖表不會自動更新。如果要進行更新,則需要使用Google表格生成一個新的網址。

結論

電子表格可能不是很性感,但可以肯定地以可視化方式表示。使用正確的工具,您可以輕鬆地將數據從Google表格中提取到WordPress,並在此過程中以使其訪問者一目了然的方式顯示數據。

與免費 可視化器 插件,您可以通過三個步驟來完成此確切過程:

  1. 創建一個新的圖表或表格,然後選擇要使用的樣式。
  2. 從Google表格導入數據。
  3. 在WordPress中編輯和顯示圖表。

是否需要將@GoogleSheets添加到#WordPress?這個#plugin可以讓您創建表格和圖表?

點擊鳴叫

如果您想自動將Google表格與WordPress同步並訪問其他新功能,也可以 升級到Visualizer的高級版

有關如何在WordPress上使用表格和圖表的更多信息,請查看我們的精選:

您對如何將Google表格嵌入WordPress有任何疑問嗎?讓我們在下面的評論部分中對它們進行研究!

相關文章