Content Link Block Elements
COMPONENT SELECTOR GUIDE
Content Link Block Elements
Relevant CSS Selectors
| CSS Selector(s) | HTML Element | Picture of Element (the blue area highlights the element; the green area highlights the element's padding; the orange area highlights the element's margin) |
|---|---|---|
| .sqs-block-collectionlink | The outer content link block container. This selector will select all content link blocks. |
|
| .sqs-block-collectionlink .collectionlink-title | The container for the content link text. |
|
| .sqs-block-collectionlink a | The content link anchor link element. |
|
HTML Structure Explanation
Text Elements
The HTML structure of the Content Link Block elements.
The HTML structure of the Content Link Block elements.
Unique Content Link Blocks Using the Block ID
Relevant CSS Selectors
| CSS Selector(s) | HTML Element | Picture of Element (the blue area highlights the element; the green area highlights the element's padding; the orange area highlights the element's margin) |
|---|---|---|
| #block-yui_3_17_2_1_1690691237911_5006 | Targets a unique Squarespace element using its unique ID attribute. The selector in the left column is just the general form of the block ID, but the characters that come after "#block-" will be different for each element. |
|
HTML Structure Explanation
Every Squarespace block element, such as the Content Link Block, will have a class name of “.sqs-block”. This element will additionally have an ID attribute that begins with “block-” and ends with a random string of characters as pictured below.
A Content Link Block element with a class name of “sqs-block” and an id attribute.