如何将CSS类名称添加到Squarespace中的文本块? [英] How do I add css class names to text blocks in Squarespace?

问题描述

我需要将一个类名或一个ID添加到Squarespace文本块中，以使JavaScript成为目标.如果使用代码块添加文本，则可以添加类名，但是它不能像其他文本块一样容易地进行编辑.

I need to add a class name or an ID to a Squarespace textblock to be targeted by JavaScript. If I use a code block to add the text, I can add a class name, however it can't be edited easily like other text blocks.

我正在寻找一种添加类名称的方法，使该元素仍被视为文本块.

I am looking for a way to add the class name with the element still bing recognized as a text block.

是从编辑器执行此操作的方法，还是开发人员模式是我唯一的选择.

Is there a way to do this from the editor or is developer mode my only option.

推荐答案

不幸的是，您无法直接在Squarespace中编辑文本块(或Markdown和代码块之外的任何块)的HTML.Squarespace无法提供这种功能.

Unfortunately, you cannot directly edit the HTML of a text block (or any block besides markdown and code blocks) within Squarespace. Squarespace does not make such capability available.

即使使用开发人员模式，也只能访问整个模板和周围的代码.在开发人员模式下，可以插入"块字段".(允许内容编辑者在网格中添加/拖放/拖放/排列块的区域)，并向块"字段添加类，但不能更改块"字段中的代码或块本身.

Even using developer mode, one only has access to the overall template and surrounding code. In developer mode, one can insert "block fields" (an area allowing content editors to add/drag/drop/arrange blocks in a grid) and add a class to the block field, but one cannot alter the code within the block field nor the blocks themselves.

替代方法/解决方法:

• 将块ID与 .row ， .col ， p ， first-child 和 nth-child 选择器，以便定位文本块内的特定元素.有关在此处和此处使用块ID的更多信息一个>.当然，这样做意味着您的选择器将很脆弱...在文本块中编辑文本可能会改变您使用的选择器的适用性.
• 如果需要定位 p 元素中的一个或多个特定单词，则可以突出显示文本块中的文本，将其设置为粗体和斜体，然后通过JavaScript和/或CSS，方法是将代码块ID与 strong ， em 选择器结合使用.请注意单击粗体和斜体按钮的顺序，因为这会确定其中的哪个，然后更改选择器.您可以根据需要覆盖font-weight和font-style.尽管这是荒谬的，但在Squarespace设计师中这是一个流行的解决方法(您也可以在键盘上按CTRL + U在突出显示的文本下划线，然后通过CSS定位带有下划线的元素).
• 使用代码块或markdown块，如前所述.

• Use the block ID in combination with .row, .col, p, first-child and nth-child selectors in order to target specific elements within a text block. More about using block ids here and here. Of course, doing this means that your selector will be fragile...editing the text within the text block could alter the applicability of the selector you used.
• If one needs to target a specific word or words within a p element, one can highlight the text within the text block, set it as both bold and italic, then target that phrase via JavaScript and/or CSS by using the block id in combination with strong, em selectors. Take note of the order in which you click on the bold and italic buttons, since this determines which is inside which, and changes your selector. You can override the font-weight and font-style as needed. This is a popular workaround among Squarespace designers, despite its absurdity ( You can also hit CTRL+U on your keyboard to underline highlighted text, then target the underlined element via CSS).
• Use the code block or markdown block, as you mentioned.

这篇关于如何将CSS类名称添加到Squarespace中的文本块?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！