如何設計具有動態內容的WordPress網站

[ad_1]

如何使我的網站看起來專業?許多有抱負的網站建設者在計劃項目時都會問自己一個問題。顯而易見的答案將包括改進設計或添加許多精美功能。

但實際上,通過添加動態內容來真正增強基礎網站並使之成為專業的自定義網站的最有效方法之一。動態內容將使您的用戶在您的網站上獲得更加充實的體驗。

動態內容介紹

什麼是動態內容?

動態內容是指根據時間,位置和用戶而變化的互動式Web內容。當用戶瀏覽動態網站時,WordPress將根據他們所在的頁面從資料庫中提取正確的信息以顯示給用戶。

使用靜態內容,您在前端看到的內容將不會改變。實際上,如果您要對其進行任何更改,則很可能需要開發人員的幫助。但是,使用動態內容,網站所有者可以立即編輯後端上的所有內容而無需進行編碼。這意味著信息可以根據用戶所查看的內容進行更改,從而提供更多的交互體驗。

為了說明問題,如果您在體育館網站上,則可能需要查看可用的其他體育館。當然,每個體育館都會有不同的信息,例如自己的名稱,地址和設施清單。因此,當您單擊每個健身房時,您會看到與之相關的不同內容,而在其他頁面上找不到。

平衡健身館

能源俱樂部

動態內容的優勢

動態內容為您的網站帶來許多靜態內容無法提供的優勢。

  • 更好的用戶體驗。用戶將能夠看到適合他們的內容,例如根據他們的行為而變化的不同報價。

  • 改善您的KPI。藉助動態內容,您可以通過創建量身定製的內容來改善轉化並降低網站的跳出率。

  • 流暢的導航。與靜態內容相比,動態內容可通過網站提供無縫的體驗,因為您可以輕鬆找到所需的內容。

  • 易於更新。您可以簡單地在WordPress後端上編輯頁面,而無需僱用專家開發人員。

  • 響應屏幕尺寸。與靜態網站相比,動態網站可以輕鬆適應各種屏幕尺寸。

我們建議您通過兩種方式創建動態內容。下面,我們將向您展示這兩個選項,以及如何同時創建兩個網站。

1.使用工具集塊和古騰堡創建動態內容

工具集

推出 工具集塊 提供了一種使用其塊編輯器Gutenberg在WordPress上創建動態內容的新方法。

自一年前推出以來,古騰堡(Gutenberg)進行了重大改進,為您設計和實現網站提供了一種簡單直觀的方法。最好的部分是,非編碼人員現在可以使用古騰堡(Gutenberg)和集成插件輕鬆輕鬆地構建他們想要的東西。

其中包括動態內容,這要歸功於網站建設者可以藉助Gutenberg創建的Toolset Blocks。

工具集塊如何工作?

Toolset Blocks是一個新插件,可以在兩個方面使用:

  1. 創建自定義的高級功能,例如內容模板,檔案和 觀看次數
  2. 支持塊的動態源,使您的自定義欄位和分類法可顯示在頁面上。

因此,您可以使用工具集塊輕鬆地將動態內容添加到任何帖子,頁面或模板,而無需任何編碼。

下面,我為體育館演示網站創建了一個內容模板的示例,該模板可確保每個體育館帖子具有相同的設計,但由於動態內容而具有不同的內容。

工具集內容模板

如何使用工具集塊創建具有動態內容的內容模板

讓我們在我們的網站上為Gyms自定義帖子類型創建一個模板。

您將需要 安裝工具集塊 在開始之前,請確保您知道 使用古騰堡編輯器的基礎知識

您可以使用工具集塊從兩個主要來源中繪製動態內容。您可以使用當前帖子中的來源,也可以使用自定義欄位中的來源。下面,我們將介紹兩個選項,以顯示您何時需要使用它們。

顯示當前帖子中的動態內容

轉到工具集>儀錶板,然後單擊要為其創建內容模板的帖子類型旁邊的創建內容模板選項。

創建內容模板

現在,我們可以開始添加塊以創建內容模板。假設我要添加圖片。首先,選擇左上方的+選項以添加一個塊。

工具集創建塊

向下滾動,直到找到Toolset的塊列表,然後添加Image塊。

工具集圖像塊

現在,您將看到一個問題提示您是否要使用動態源。單擊是。

工具集圖像動態源

選擇圖像的來源。這決定了WordPress將根據您選擇的選項提取哪些內容。我想在塊中顯示每個體育館的特色圖像,因此我將選擇「特色圖像數據」選項。

工具集特色圖像數據

例如,如果您想更改動態內容的來源或設置圖像的樣式,則可以在右側工具欄上進一步調整圖像。

工具集圖像設置

從自定義欄位顯示動態內容

我們可以使用與以前相同的內容模板來創建具有來自自定義欄位的動態內容的塊。這次,我將為每個體育館的評分添加自定義欄位作為動態內容。

轉到Toolset塊列表,然後添加Single Field塊。

工具集單場塊

在「欄位源」下右側的側欄上,選擇「自定義欄位」欄位類型。

在「自定義欄位組」下拉列表中,選擇「健身房」帖子類型。請注意,這將是您要從中提取自定義欄位的任何自定義帖子類型。

在「自定義欄位」下拉菜單下,選擇要顯示的自定義欄位。我選擇了評分選項。

工具集自定義欄位發布

如果您在前端的不同健身房帖子之間切換,您將看到由於動態內容,每個帖子都顯示該健身房的正確價格。請注意,我們根本不需要使用任何編碼來創建動態內容。

我在內容模板中添加了其他一些具有動態內容的塊。查看前端的外觀。

Toolset Gym示例

2.總計創建動態內容

創建動態內容的另一種等效方法是使用 總主題 創建內置的動態帖子模板。

Total提供什麼功能?

道達爾(Total)是WordPress上最受歡迎的主題之一,它具有許多功能,您可以輕鬆設置這些功能,而無需下載多個插件來執行這些任務。

  • 簡易演示導入器–選擇導入道達爾(Total)的40多個預製演示中的一個時,只需單擊一下即可將您的空白網站變成一個功能齊全的網站。

  • 拖放頁面生成器– Total與流行的WPBakery頁面生成器集成在一起,為您提供直觀的拖放生成器,因此您可以輕鬆地構建網站。

  • 數百個頁面構建器元素–利用Total的數百個頁面構建器元素來自定義您的頁面。

  • 易於自定義–使用實時自定義程序設置可以更改網站上的許多元素,包括顏色,字體,寬度等。

  • 對開發人員友好-Total附帶許多內置的掛鉤和過濾器,使您可以輕鬆地使用在線文檔中提供的450多個摘要修改主題。

而且,當然,您可以使用Total來創建動態內容。下面讓我們舉例說明如何通過使簡單的投資組合項目動態化來實現的目標。

如何使用Total創建動態內容模板

轉到Visual Composer>模板,然後單擊添加。接下來給您的模板起一個名字。

總投資組合職位布局

首先,我將添加Post Media元素,該元素將顯示您添加到帖子中的任何媒體。對於作品集,這可以是精選圖片,圖庫,視頻等。

接下來,我將包含「帖子內容」模塊,該模塊將顯示在編輯器中添加到帖子中的所有內容。

郵政媒體總數

使用「總計」,您可以在動態模板中包括許多發布元素。添加帖子標題,元數據,相關項目,標籤,社交鏈接等。完成後,單擊發布。

現在,我們需要將動態模板分配給投資組合自定義帖子類型。為此,請導航至WordPress定製程序,然後轉到Portfolio,然後在「動態模板(高級)」下選擇剛創建的模板。

總動態模板

現在,您可以看到正在運行的媒體。單擊「保存並發布」,您的動態內容應已準備就緒。

總動態模板前端

如果要為客戶構建網站,則創建動態模板是一個特別好的選擇。通過使用它們,您可以一次創建一個模板,並將其立即分配給所有投資組合項目。不僅如此,如果您需要更改布局,您所要做的就是編輯模板,所有投資組合項目也將被更新。

告訴我們您創建動態內容的經驗!現在,您有兩種創建動態內容的方法。您可以下載 工具集塊 要麼 總主題 今天開始使用,將您的網站從基本變為自定義。

您是否使用這兩種工具向網站添加了動態內容?請在下面的評論中告訴我們如何為您解決問題!

相關文章