Ghost Plugins

View Original

Circ Button Hover Style (Preview Guide)


Super Plugin Info

  • Works with Squarespace 7.1 (Fluid Engine)

  • Only compatible with Button Block (Primary)

  • Requires Business Plan or Higher

  • Uses Custom CSS and Code Injection


Step 1. Add this code to Header Code Injection

See this content in the original post

Step 2. Add this code to Footer Code Injection

See this content in the original post

Step 3. Add this code to Custom CSS

See this content in the original post

Step 4. Customizable Options

These options are available in CSS.

  • Button Font Color

  • Button Font Color (On Hover)

  • Button Background Color

  • Button Height

  • Button Border Radius

  • Button Border Style

  • Arrow Size

  • Arrow Color

  • Arrow Background Color

Note: Primary button font styles can be changed in Squarespace settings like normal.


5. Add a Button Block

Add a button block to any page with the required settings.

  • Design: Primary Button

  • Design: Fill Style

Note: Secondary and Tertiary buttons will still be available like normal. Primary button may not appear while in edit mode but is still editable.


Troubleshooting (Plugin Not Working)

  • Page section must be using Fluid Engine

  • Button must be set to Primary

  • Button must be set to Fill