

Somewhere in the code for that certain object it will say ID=block etc. Otherwise, you can right-click on the block and then click Inspect. Squarespace also recommends you use Google Chrome for the best experience when you’re editing in Squarespace anyway, so it’s a win-win. Open up the page with the block you want to identify, click on the Identifier Tool in your Chrome Extensions and it will instantly reveal the Block Identification Numbers (which will be something like #block-53c818fd6d3f39517aed or #block-yui_3_17_2_1_1556302617094_72323)Ĭlick on the Block you want to use and it will automatically copy the Block number for you! If you don't use Google Chrome:įirstly, we recommend downloading it even if it’s just to use this extension, it will save you a bunch of time. This extension is designed to help you find the Block Identification Number of each Block on your Squarespace Site.
Squarespace text blocks css download#
If you’re using Google Chrome, download this Squarespace Block Identifier extension for Chrome. The easiest way to find the block number: Once you have the identification number of a certain block, you can easily make CSS changes to it over in the Squarespace CSS Editor. Step 1 : Identify your blockĮach Block on your site has a different identification number. Also, adding your CSS in one area, rather than throughout the site in different areas (as the other method below) is better overall for SEO. We use the universal CSS editor which is available to everyone on a personal plan. We recommend this method for most instances. Using a block identifier and adding basic CSS Thickness: Using the slider you can adjust the thickness of the highlight effectĮnd Caps: Choose from either a square or round shape for the ends of the highlightīring to Front: Toggle this feature on to bring the highlight style you've chosen in front of the text.Īnimation: If you turn animations on, you have three choices: Draw, Fade, or Fade and Scale.ġ. That's not where the fun ends! You can customize each highlight option with the following:Ĭolor: Select a color from your website palette or a custom color. In the popup design menu, choose the Highlight icon to select a text highlight option. Prior to the release of this option, something like this would require a fair amount of code so we're excited about this one!įirst things first, add a text block to your website.ĭouble-click the text itself to open up the text toolbar This adds a little emphasis to your text. More recently Squarespace launched a few other built-in features on 7.1 (both Fluid Engine and Classic Editor), and one of them is adding a highlight on text.
