如何將 css 類名添加到 Squarespace 中的文本塊？

Question

我需要向 JavaScript 定位的 Squarespace 文本塊添加類名或 ID。 如果我使用代碼塊添加文本，我可以添加類名，但是它不能像其他文本塊一樣輕松編輯。

我正在尋找一種方法來添加類名，元素仍然被識別為文本塊。

有沒有辦法從編輯器中做到這一點，或者開發人員模式是我唯一的選擇。

Answer 1

不幸的是，您不能在 Squarespace 中直接編輯文本塊（或除 Markdown 和代碼塊之外的任何塊）的 HTML。 Squarespace 不提供此類功能。

即使使用開發者模式，也只能訪問整個模板和周圍的代碼。 在開發者模式下，可以插入“塊字段”（允許內容編輯器在網格中添加/拖放/排列塊的區域）並向塊字段添加類，但不能更改塊字段內的代碼，也不能更改塊本身。

替代方案/解決方法：

• 將塊 ID 與.row 、 .col 、 p 、 first-child和nth-child選擇器結合使用，以定位文本塊中的特定元素。 有關在此處和此處使用塊 ID 的更多信息。 當然，這樣做意味着您的選擇器將變得脆弱……編輯文本塊中的文本可能會改變您使用的選擇器的適用性。
• 如果需要定位p元素中的一個或多個特定單詞，可以突出顯示文本塊中的文本，將其設置為粗體和斜體，然后通過 JavaScript 和/或 CSS 結合使用塊 ID 來定位該短語使用strong , em選擇器。 請注意您單擊粗體和斜體按鈕的順序，因為這決定了哪個在哪個里面，並更改您的選擇器。 您可以根據需要覆蓋 font-weight 和 font-style。 盡管這很荒謬，但這是 Squarespace 設計人員中一種流行的解決方法（編輯：您也可以按鍵盤上的 CTRL+U 為突出顯示的文本加下划線，然后通過 CSS 定位帶下划線的元素）。
• 使用您提到的代碼塊或降價塊。