Child Theme Configurator – WordPress plugin 外掛推薦下載

點擊下載

子主題配置器

外掛Plugin描述

子主題配置器是一個快速且易於使用的實用程序,允許您分析任何主題常見問題,創建子主題並在Customizer的選項之外進行自定義。專為希望能夠直接自定義子主題樣式表的WordPress用戶而設計,Child Theme Configurator可讓您輕鬆識別和覆蓋要自定義的確切CSS屬性。分析器掃描渲染的主題並自動配置您的子主題。它可以正確排列主題和字體樣式表以獲得最佳性能,並處理特定於供應商的語法,使您可以無限制地控制子主題外觀,同時保持父主題不受影響。 詳細了解如何創建子主題

控制您的孩子主題

子主題配置器解析和索引您的樣式表,以便每個CSS媒體查詢,選擇器,屬性和值都在您的指尖。其次,它向您展示了在將其提交到子主題之前,您所做的每個自定義。最後,它會保存您的工作,以便您可以自定義子主題中的樣式,而不會有丟失編輯的風險。

您可以從現有的​​父主題中創建任意數量的子主題。子主題配置器允許您從已安裝的主題(甚至現有的子主題)中進行選擇,並將結果保存在主題目錄中。

準備好後,只需激活子主題,WordPress網站就會自動顯示自定義樣式。

為什麼使用Child Theme Configurator創建子主題和自定義樣式?

使用自定義程序無法更改某些內容。

除非你使用child主題,當您更新時,您將丟失對模板和样式表所做的任何更改。

子主題配置器根據您使用的主題自動確定設置子主題的正確方法。

您可以找到主題使用的確切樣式選擇器并快速更改屬性。

您可以從管理員中找到,複製和編輯主題模板。

更多:

在不丟失自定義的情況下更新主題智能主題分析器確定使用幾乎任何父主題的常見子主題問題的正確設置複製現有小部件,菜單和兒童主題的定制器選項使用您的子主題中的Web字體(鏈接)樣式表而不是使用@importQuickly定位和編輯主題CSS.Customize @media查詢響應式designSelect十六進制,RGBA(透明)和命名顏色使用Spectrum顏色pickerAdd回退樣式(每個屬性多個值)節省開發時間小時多樣性兼容使用修改不可用將CustomizerExport子主題作為Zip ArchiveIdentify並覆蓋來自父themeChange特定顏色,背景,字體樣式等的精確選擇器,而不更改其他元素自動生成跨瀏覽器和供應商前綴屬性和CSS漸變預設自定義樣式之前使用它們使用WP文件系統API – 不會創建無法刪除的文件

兒童主題配置器PRO

將兒童主題配置器的CSS自定義功能應用於您網站上安裝的任何WordPress外掛Plugin。子主題配置器PRO掃描您的外掛Plugin,並允許您自定義其樣式表。我們添加了更多功能,以便使用PRO更快速,更輕鬆地定製樣式。

了解更多信息,請訪問http://www.childthemeconfigurator.com/child-theme-configurator-pro

無限小部件內容單個外掛Plugin

IntelliWidget是一個多功能的小部件管理器,它通過組合自定義頁面菜單,特色帖子,滑塊和其他動態內容功能來完成多個外掛Plugin的工作,這些功能可以在每頁或整個站點上顯示。

了解更多信息,請訪問https://www.lilaeamedia.com/plugins/intelliwidget

Hook Highlighter

Hook Highlighter在網站的任何前向頁面上激活時,管理員可以深入了解WordPress的內部程序流程。

顯示內聯當前頁面的操作和過濾鉤子,程序文件和回溯信息。

了解詳情,請訪問https://www.lilaeamedia.com/product/hook-highlighter

查詢/選擇器選項卡

有兩種方法可以識別和自定義基線(父)樣式。子主題配置器允許您通過CSS選擇器和屬性搜索樣式。如果要自定義特定的CSS選擇器(例如,h1),請使用“查詢/選擇器”選項卡。如果您希望在站點範圍內自定義特定的CSS值(例如,類型的顏色),請使用“屬性/值”選項卡。

“查詢/選擇器”選項卡允許您查找特定的CSS選擇器並進行編輯。首先,通過在Query自動選擇框中鍵入來查找包含要編輯的CSS選擇器的查詢。通過單擊鼠標或按“Enter”或“Tab”鍵進行選擇。默認情況下,CSS選擇器位於基本查詢中。
接下來,通過在“選擇器”自動選擇框中鍵入來查找CSS選擇器。通過單擊鼠標或按“Enter”或“Tab”鍵進行選擇。

這將加載該CSS選擇器的所有屬性,左側是Original值,右側是子主題值輸入。任何現有的兒童主題va將自動填充lues。還有一個示例預覽,顯示父和子覆蓋的組合。請注意,邊框和背景圖像得到特殊處理。

“Order”字段包含父主題樣式表中CSS選擇器的原始序列。您可以通過在“訂單”字段中輸入更低或更高的數字來更改CSS選擇器順序。您還可以通過選中每個輸入旁邊的“!”框來強制執行樣式覆蓋(所謂的“!important”標記)。請明智地使用。

單擊“保存”以更新子主題樣式表並將更改保存到WordPress管理員。

添加原始CSS

如果要向給定的CSS選擇器添加其他屬性,請首先使用“查詢/選擇器”選項卡加載選擇器。然後在“新建屬性”自動選擇框中鍵入要查找要覆蓋的屬性。通過單擊鼠標或按“Enter”或“Tab”鍵進行選擇。這將向選擇器輸入添加新的輸入行。

如果您希望添加全新的CSS選擇器,甚至是新的@media查詢,您可以在“Raw CSS”textarea中輸入自由格式的CSS。請注意,語法必須正確(即平衡花括號等),以便解析器加載新的自定義樣式。您將知道它無效,因為保存按鈕旁邊會出現一個紅色的“X”。

如果您更喜歡使用屬性和值的簡寫語法而不是Child Theme Configurator提供的輸入,您也可以在此處輸入它們。解析器會自動將您的輸入轉換為規範化的CSS代碼。

屬性/值選項卡

“屬性/值”選項卡允許您查找給定屬性的特定值,然後為使用該屬性/值組合的各個CSS選擇器編輯該值。網絡連接首先,通過在屬性自動選擇框中鍵入來查找要覆蓋的屬性。通過單擊鼠標或按“Enter”或“Tab”鍵進行選擇。

這將在父主題樣式表中加載該屬性的所有唯一值,並為該值添加樣本預覽。如果子主題樣式表中存在父樣式表中不存在的值,則它們也將顯示。

對於每個唯一值,單擊“選擇器”鏈接以查看使用該屬性/值組合的CSS選擇器列表,按查詢分組,並使用值的樣本預覽和子主題值的輸入。將自動填充任何現有的子主題值。

單擊“保存”以更新子主題樣式表並將更改保存到WordPress管理員。

如果要編輯CSS選擇器的所有屬性,可以單擊“編輯”鏈接,CSS選擇器將自動加載到“查詢/選擇器”選項卡中。

Web字體選項卡

您可以通過在Web字體選項卡上的textarea中鍵入@import規則來添加其他樣式表和Web字體。 重要說明:請勿在此處導入父主題樣式表。 使用“父/子”選項卡中的“父樣式表處理”選項。

“文件”選項卡

父模板

您可以通過選中復選框從父主題複製PHP模板文件。單擊“將選定內容複製到子主題”,模板將添加到子主題的目錄中。

注意:如果您的子主題處於活動狀態,則在復制後,將立即使用該主題的文件版本而不是父版本。 functions.php文件是單獨生成的,不能在此處複製。

兒童主題文件

Templa此處列出了從父項複製的tes。可以使用“外觀”菜單中的“主題編輯器”編輯這些內容。通過選中復選框並單擊“刪除所選項”刪除子主題圖像。

子主題圖像

主題圖像位於子主題中圖像目錄下,表示僅供樣式表使用。使用媒體庫獲取內容圖像。您可以使用圖片上傳表單上傳新圖片。

兒童主題屏幕截圖

您可以在此處上傳兒童主題的自定義屏幕截圖。主題截圖應為4:3比例(例如,880px x 660px)JPG,PNG或GIF。它將被重命名為“screenshot”。

將子主題導出為Zip存檔

您可以通過單擊“導出”下載您的子主題以在另一個WordPress網站上使用。

預覽並激活

重要事項:在激活之前測試子主題!

某些主題(特別是商業主題)無法正確加載父模板文件或自動加載子主題樣式表或php文件。

在最糟糕的情況下,當您激活子主題時,它們將破壞您的網站。

導航至外觀> WordPress管理員中的主題。現在,您將看到新的子主題作為已安裝的主題之一。單擊新的子主題下方的“實時預覽”(主題自定義程序)以查看它的實際效果。當您準備好實時播放子主題時,請單擊“激活”。 “

MULTISITE用戶:您必須網絡啟用您的子主題才能使用實時預覽。轉到網絡管理員中的“主題”。

警告

不支持任意評論。為預覽和修改自定義樣式提供高度靈活性需要復雜的解析系統。維持合作與其添加的值相比,綁定到樣式表中任何特定元素的mments非常昂貴。雖然我們將來會努力將其作為一個選項包含在內,但目前所有註釋都是從子主題樣式表代碼中刪除的。沒有@keyframes或@ font-face規則。子主題配置器僅支持@media和@import。如果您需要其他@rules,請將它們放在單獨的樣式表中,然後將它們導入到Child Theme樣式表中。只有雙色漸變。子主題配置器功能強大,但我們簡化了漸變界面。您可以使用任何所需的漸變,只要它有兩種顏色且沒有中間停止。自動發現CSS屬性。子主題配置程序加載父樣式表中存在的屬性。您始終可以使用“Raw CSS”文本區域添加新屬性。不支持Legacy漸變語法。子主題配置器不支持MS過濾器漸變或舊版webkit漸變。如果它們在父主題中使用,它們將繼續有效,但不會寫入子主題樣式表。如果有需求,我們可能會在將來的版本中添加它,但大多數用戶現在應該已經升級了。

文檔

訪問http://www.childthemeconfigurator.com/

Serbo-Croatian翻譯由Borisa Djuraskovic提供borisad@webhostinghub.com http://www.webhostinghub.com

版權:(C)2014-2018 Lilaea Media

屏幕截圖

父/子選項卡
包含父主題菜單的父/子選項卡
查詢/選擇器選項卡
屬性/值選項卡
“Web字體”選項卡
父CSS選項卡
“文件”選項卡

安裝

要從外掛Plugin存儲庫進行安裝:

在WordPress管理員中,轉到“外掛Plugin>添加新。在“搜索”框中鍵入“子主題”,然後單擊“搜索外掛Plugin”。在列表中找到“子主題配置器”,然後單擊“立即安裝”。

手動安裝:

點擊下載來自https://wordpress.org/plugins/child-theme-configurator的兒童主題配置器在WordPress管理員中,轉到“外掛Plugin>添加新。“單擊頁面頂部的”上傳“鏈接。瀏覽zip文件,選擇並單擊”安裝“。

在WordPress管理中,轉到”外掛Plugin>已安裝的外掛Plugin。“在列表中找到”子主題配置器“,然後單擊”激活“。

導航到工具>兒童主題(多站點用戶轉到網絡管理員>主題>兒童主題)。

父/子選項卡:創建子主題的10個簡單步驟

選擇一個操作:

創建一個新的子主題 – 使用已安裝的主題安裝新的可自定義子主題parent.CONFIGURE現有的子主題 – 設置以前安裝的子主題以與配置程序一起使用或修改當前設置。複製現有的子主題 – 在新目錄中創建現有子主題的完整副本,包括任何菜單,小部件和其他自定義程序設置。使用此操作禁用複制父主題設置(下面的步驟8)的選項。重置現有的子主題(這將破壞您在配置器中完成的任何工作) – 將子主題樣式表和函數文件還原到其狀態在初始配置或上次重置之前。

如果是cre,請選擇父主題一個新的兒童主題;如果配置,複製或重置,請選擇子主題。

分析子主題 – 單擊“分析”以確定樣式表依賴關係和其他潛在問題。

如果要創建新的子主題,請為新主題目錄命名;否則驗證目錄是否正確。 – 這不是兒童主題的名稱。您可以在下面的步驟7中自定義名稱,描述等。

選擇保存新樣式的位置:

主樣式表(style.css) – 將新的自定義樣式直接保存到子主題主樣式表,替換現有值。主樣式表將按主題設置的順序加載。分隔樣式表 – 將新的自定義樣式保存到單獨的樣式表,並使用任何現有的子主題樣式作為基線。如果要保留原始子主題樣式而不是覆蓋它們,請選擇此選項。此選項還允許您自定義在主樣式表之後加載的樣式表。

選擇父主題樣式表處理:

使用WordPress樣式隊列。 – 讓配置程序確定適當的操作和依賴項並自動更新函數文件。在子主題樣式表中使用@import。 – 如果無法使用WordPress樣式隊列加載父樣式表,則僅使用此選項。建議不要使用@import。不要添加任何父樣式表處理。 – 如果此主題已處理父主題樣式表,或者父主題的style.css文件未用於其外觀,請選擇此選項。

自定義子主題名稱,描述,作者,版本等:(單擊以切換錶單)

將父主題菜單,窗口小部件和其他自定義程序設置複製到子主題: – 注意:這將覆蓋您可能已設置的任何子主題選項。

單擊按鈕運行配置器。

重要提示:在激活之前,請務必使用實時預覽(主題自定義程序)測試子主題!

常見問題

如何將我已經對主題所做的更改移動到子主題中?

請按照以下步驟操作:http://www.childthemeconfigurator.com/how-to-use/#child_from_modified_pa​​rent

當我運行分析器時,我在PHP Debug Output

中得到“常量已定義”的通知這是Bluehost自動安裝程序創建的錯誤配置。 http://www.childthemeconfigurator.com/child-theme-faqs/#constants“class =”scroll-to“>如何修復。

有教程嗎?

頁面右上角的“幫助”標籤下有視頻。您也可以在http://www.childthemeconfigurator.com/tutorial-videos

查看它們。如果父主題發生變化(例如,升級),我是否必須更新子主題?

否。這是使用兒童主題的要點。子主題自動繼承對父主題的更改。

子主題不是父主題的“副本”。這是WordPress的一個特殊功能,讓您覆蓋特定的樣式和功能,使主題的其餘部分保持不變。質量主題應標識升級說明中任何已棄用的功能或樣式,以便子主題用戶可以相應地進行調整。

如果我卸載子主題配置器是否影響了兒童主題?

否。兒童主題配置器的設計獨立於主題和外掛Plugin。請記住,如果重新安裝,則必須使用“父/子”選項卡重建配置數據。

如何添加評論?

不支持任意評論。為預覽和修改自定義樣式提供高度靈活性需要復雜的解析和數據結構。維護綁定到的任何特定元素的註釋樣式表與其增加的價值相比非常昂貴。雖然我們將來會努力將其作為一個選項包含在內,但目前所有註釋都會從子主題樣式表代碼中刪除。

是否適用於Multisite?

是的。轉到“網絡管理員”>主題>兒童主題。“兒童主題必須是”網絡啟用“才能預覽和激活網絡站點。

它是否適用於外掛Plugin?

兒童主題配置器PRO通過掃描外掛Plugin並在您的兒童主題中創建自定義CSS,將兒童主題配置器的CSS編輯功能帶到您網站上安裝的任何WordPress外掛Plugin。有關詳細信息,請訪問http://www.childthemeconfigurator.com/child-theme-configurator-pro

為什麼這不適用於我的[insert vendor here]主題?

某些主題(特別是商業主題)無法正確加載父模板文件或自動加載子主題樣式表或php文件。

這是不幸的,因為在最好的情況下,它們有效地禁止網站管理員添加任何自定義(除了通過管理主題選項製作的定制),這些定制將在升級後繼續存在。 在最壞的情況下,當您激活子主題時,它們會破壞您的網站。

直接與供應商聯繫,詢問此核心功能。我們認為所有主題(特別是商業主題)必須通過WordPress.org概述的主題單元測試,並且在激活之前始終測試兒童主題(請參閱“預覽和激活”)。

這會減慢我的網站速度嗎?

子主題配置器旨在增加可能的最小額外開銷,實際上可以提高性能。 例如:

子主題配置程序創建或更新系統已讀取的文件。在前端,沒有數據庫調用,所以WordPress可以運行依賴於外掛Plugin。實際上,您可以在設置子主題時刪除子主題配置器。自定義樣式應用於樣式表文件,該文件可由瀏覽器緩存和/或緩存並由性能緩存外掛Plugin最小化。由於編輯器主要為現有樣式創建“覆蓋”,因此該文件通常比其他樣式表小。驅動編輯器界面的代碼僅在從WordPress管理器使用工具時加載,包括Javascript和CSS。這意味著它不會妨礙其他管理頁面。當您從父/子選項卡生成子主題文件時,會發生最大的性能損失,但這是一次性事件,並且只發生在WordPress管理員中。救命!我更改了一個文件,現在我無法訪問我的網站或登錄wp-admin來修復它!

要退出損壞的子主題,您必須手動重命名有問題的主題目錄名稱(通過FTP,SSH或您的Web主機控制面板文件管理器),以便WordPress無法找到它。然後WordPress將拋出一個錯誤並恢復到默認主題(目前為二十五分鐘)。

子主題位於您的主題文件夾中,通常為

[wordpress] / wp-content / themes / [child-theme]

為了防止將來出現這種情況,在激活之前,始終使用實時預覽(主題自定義程序)測試子主題。

當我激活新的兒童主題時,為什麼我的菜單顯示不正確?

…或…

為什麼激活新的子主題時我的自定義標題丟失了?

…或…

為什麼我激活新的子主題時我的自定義背景會恢復為默認值?

…或…

為什麼在激活新的兒童主題時我的主題選項會消失?

這些選項特定於每個主題,並單獨保存在數據庫中。創建新的子主題時,其選項為空。

在父/子選項卡上生成子主題文件時,通過選中“複製父主題菜單,窗口小部件和其他選項”,可以將其中許多選項複製到子主題。

如果要設置不同的選項,可以在使用主題自定義程序激活子主題後應用它們,也可以使用外觀>下的“實時預覽”。主題。

每個主題都以自己的方式處理選項。通常,他們會創建一組選項並將它們存儲在WordPress數據庫中。某些選項特定於活動主題(或子主題),有些選項僅特定於父主題(意味著子主題無法自定義它們)。你必須從主題作者中找出哪些。

管理員中的兒童主題配置器在哪裡?

對於大多數用戶,可以在“工具>”下找到“兒童主題配置器”。兒童主題。“

WordPress多站點(網絡)用戶轉到”網絡管理員>主題>子主題。“

注意:只有具有”install_themes“功能的用戶才能訪問子主題配置器。

單擊右上角的“幫助”選項卡以獲得快速參考。

如何添加網絡字體?

最簡單的方法是將Google,Font Squirrel或任何其他Web Font網站提供的@import代碼粘貼到Web Fonts選項卡中。然後,這些字體可用作font-family屬性的值。確保您了解任何嵌入字體的許可證。

您還可以創建包含@ font-face規則的輔助樣式表,並使用“Web字體”選項卡將其導入。

為什麼在“查看父CSS”時,父主題沒有任何樣式?

在“父/子”選項卡上的“解析其他樣式表”下檢查相應的其他樣式表,然後加載t他又是兒童主題。 CTC嘗試通過從父主題中提取頁面來識別這些文件,但您可能需要手動設置它們。

款式在哪裡?配置器沒有顯示任何內容!

所有樣式都是動態加載的。您必須在文本框中輸入以選擇要編輯的樣式。
“Base”是包含與任何特定“At-rule”無關的樣式的查詢組。

首先單擊“查詢/選擇器”選項卡並在第一個中鍵入“base”框。然後,您可以在第二個框中鍵入以檢索要編輯的樣式選擇器。

為什麼預覽標籤會返回“無法顯示樣式表”?

您必須從“父/子”選項卡加載子主題才能顯示預覽。當您的WP_CONTENT_URL與$ bloginfo(’site_url’)不同時,也會發生這種情況。默認情況下,Ajax無法發出跨域請求。檢查您的設置>一般> “WordPress地址(URL)”值是正確的。 (通常由域中缺少“www”引起。)

我可以手動離線編輯子主題樣式表,還是使用編輯器,還是必須使用配置程序?

您可以對樣式表進行任何手動自定義。只需確保使用“父/子”面板導入修訂的樣式表,否則配置程序將在您下次使用時覆蓋自定義項。只需像往常一樣按照步驟操作,但選擇“使用現有子主題”單選按鈕作為“子主題”選項。 Configurator將自動從新樣式表更新其內部數據。

子主題.php文件在哪裡?

子主題配置器自動將空白的functions.php文件添加到子主題的目錄中。您可以使用“文件”選項卡複製父主題模板文件。如果你想要cr使用FTP或SSH手動創建/上傳新模板和目錄。請記住,子主題將自動繼承父主題的模板,除非它們也存在於子主題的目錄中。僅複製您要自定義的模板。

如何自定義特定顏色/字體樣式/背景?

您可以使用“屬性/值”選項卡全局覆蓋特定的CSS值。見上面的屬性/值。

如何添加不在父主題中的自定義樣式?

您可以使用“查詢/選擇器”選項卡上的“原始CSS”文本區域添加查詢和選擇器。請參閱上面的查詢/選擇器。

如何從父主題中刪除樣式?

你不應該從父母那裡“刪除”一種風格。但是,您可以將屬性設置為“inherit”,“none”或零(取決於屬性)。這將否定原始值。可能需要進行一些實驗。

如何從兒童主題中刪除樣式?

從要刪除的屬性的輸入中刪除值。子主題配置程序僅為包含值的屬性添加替代。

如何設置!important標誌?

我們始終建議在全局覆蓋上依賴良好的級聯設計。為此,您可以通過在“訂單”字段中輸入值來更改子主題自定義樣式的加載順序。是的,您現在可以通過選中每個輸入旁邊的“!”框來將屬性設置為重要。請明智地使用。

如何創建跨瀏覽器漸變?

子主題配置器使用漸變的標準化語法,僅支持沒有中間停止的雙色漸變。輸入包括原點(例如,頂部,左側,135度等),起始顏色和結束顏色。保存這些v時,將自動生成特定於瀏覽器的語法alues。有關詳細信息,請參閱下面的警告。

如何讓我的主題響應?

簡短的回答是使用響應式父主題。響應式設計的一些共同特徵是:

避免固定的寬度和高度值。使用最大和最小高度值和百分比是使您的設計響應查看器瀏覽器大小的方法。使用內聯和相對位置組合浮動和清除允許元素優雅地調整到其容器的寬度。使用Javascript顯示和隱藏內容。

有關更多信息,請查看“主題響應”:

評論

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

shares