新聞中心
本周早些時(shí)候,websevendev將其第四個(gè)wordpress插件Block Attributes發(fā)布到官方目錄中。該擴(kuò)展允許最終用戶向幾乎任何區(qū)塊添加任何HTML屬性。

創(chuàng)新互聯(lián)堅(jiān)持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:網(wǎng)站制作、做網(wǎng)站、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿足客戶于互聯(lián)網(wǎng)時(shí)代的原陽網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!
WordPress編輯器的問題之一是自定義HTML可能有點(diǎn)麻煩。區(qū)塊建立在一組標(biāo)準(zhǔn)上,標(biāo)記應(yīng)該滿足這些期望。如果某些內(nèi)容不適合,用戶會(huì)看到無效標(biāo)記警告。
但是,有時(shí)用戶出于各種原因需要放入自定義HTML屬性。例如,我有時(shí)需要添加一個(gè)自定義data-屬性來使用一些JavaScript。因?yàn)槲覍?duì)代碼非常了解,所以我通常通過自定義HTML區(qū)塊在這些情況下寫出HTML。但是,當(dāng)需要添加次要屬性時(shí),這沒有意義。
WordPress目前允許用戶向幾乎每個(gè)區(qū)塊添加類和ID(在管理中稱為“HTML錨點(diǎn)”)。它不允許直接輸入HTML支持的許多其他可能的屬性。普通用戶的用例很少。
對(duì)于某些用戶可以使用額外功能的場(chǎng)景,塊屬性插件非常方便。
該插件易于使用。它在每個(gè)區(qū)塊的“高級(jí)”選項(xiàng)卡下添加了一個(gè)名為“附加屬性”的新字段。用戶可以添加屬性名稱并單擊“添加”按鈕。從那里,它創(chuàng)建一個(gè)用于添加屬性值的新字段。
向onclick按鈕區(qū)塊添加屬性。
該插件還支持多個(gè)屬性。添加一個(gè)后,您只需使用相同的輸入字段來創(chuàng)建更多。
對(duì)于我的第一次嘗試,我添加了onclick一個(gè)值為myFunction(). 然后,跳轉(zhuǎn)到我的主題并通過JavaScript創(chuàng)建該函數(shù)以在控制臺(tái)中輸出一條簡(jiǎn)單的消息。一切看起來都很好,而且它奏效了。
HTML視圖和控制臺(tái),帶有用于按鈕區(qū)塊的自定義JS。
我想到的大多數(shù)用例都是與JavaScript集成的,這是一個(gè)簡(jiǎn)單的例子。開發(fā)人員可以使用這樣的功能做更復(fù)雜的事情。這就是將該插件保留在工具箱中的充分理由——有時(shí)您需要扳手而不是錘子。
我還可以看到區(qū)塊屬性用于在其他可能有助于可訪問性的情況下添加ARIA屬性。
用戶可以通過style插件的屬性將自定義樣式添加到特定區(qū)塊。但是,除非這是一個(gè)簡(jiǎn)單的一次性,否則我建議不要這樣做。對(duì)于更高級(jí)的用例,Blocks CSS是一個(gè)更合適的插件。它有一個(gè)內(nèi)置的語法熒光筆。另外,textarea比單行文本輸入框更友好。
我見過的區(qū)塊屬性的唯一缺點(diǎn)是停用時(shí)。如果您添加了任何自定義屬性,您將在編輯器中看到可怕的“此區(qū)塊包含未預(yù)料的或無效的內(nèi)容。”消息。編輯器設(shè)法解決了我在核心區(qū)塊中遇到的任何問題。
停用插件后解決區(qū)塊警告。
停用插件不應(yīng)影響前端輸出。因?yàn)樽远x屬性是 HTML 標(biāo)記的一部分,所以它們?nèi)匀淮嬖?。錯(cuò)誤消息應(yīng)該只顯示在編輯器中。
本文標(biāo)題:使用區(qū)塊屬性插件BlockAttributes添加自定義HTML屬性
鏈接分享:http://fisionsoft.com.cn/article/dhjgdie.html


咨詢
建站咨詢
