Скачать с ютуб How to customize a Donation Block in Squarespace: Squarespace Donation Block Tutorial в хорошем качестве

How to customize a Donation Block in Squarespace: Squarespace Donation Block Tutorial

If you're looking to start accepting donations on your Squarespace website, you're in the right place. Squarespace has an amazing donation content block, and in this video, I’ll walk you through everything you need to know: from setting it up, customizing the design, and taking it to the next level with CSS. Here’s what we’ll cover: Step-by-step setup: How to add the donation block to your site and configure payment processors. Built-in design options: Explore styles like borders, button alignments, and text edits to match your brand. Advanced customizations with CSS: Learn how to tweak alignment, font styles, button designs, and more with easy-to-follow code examples. No matter your design vision, you’ll discover simple ways to create a donation section that looks professional and works seamlessly. And don’t worry if you’re new to CSS—I've got you covered with free beginner training linked in the description! 💡 Pro Tip: The CSS codes I share are fully customizable, so you can make your donation block truly unique without affecting other parts of your site. Ready to dive in? Watch the full tutorial and get inspired to enhance your Squarespace website. Don’t forget to like the video if you found it helpful, and as always, have fun creating your dream site! 😊 Find all the codes and resources linked below. Let’s get creative! 🔗 Related content Links: Original Blog Post: https://insidethesquare.co/squarespac... Basic CSS for Squarespace - save 10% with promo code YOUTUBE: https://insidethesquare.co/learn Subscribe to my channel for new Squarespace videos every week:    / @insidethesquare   Squarespace CSS Code Collection: https://insidethesquare.co/css ⏱️ Important Timestamps: 00:00 - Introduction & What to Expect 00:25 - Adding the Donation Block to Your Page 01:20 - Setting Up the Donation Block: Payment Processor, Customer Accounts, and Button Text 01:50 - Built-in Design Options Overview 02:19 - Adjusting Borders, Backgrounds, and Corner Radius 03:13 - Understanding Padding and Layout Styles 03:40 - Fixing Donation Amount Alignment with CSS 04:07 - Button Styles: Primary, Secondary, Tertiary, and Custom Alignments 06:04 - Accessing Custom CSS in Squarespace 06:34 - Aligning Donation Values with Custom Code 07:02 - Making Text Bold and Highlighting Donation Values 07:34 - Italicizing Descriptions & Resetting Value Styles 08:29 - Customizing Donation Block Buttons with CSS 09:25 - Code Recap: Alignment, Styling, and Button Design 10:24 - Free CSS Training & Final Tips 🖥 Tutorial Code: .sqs-donation-block-container .radio label{ text-align:left!important; font-style:italic } .sqs-donation-block-container .radio-label:first-line{ font-size:20px; font-weight:bold; font-style:normal } .sqs-donation-block-container .button{ background:green!important; border-radius:0px; font-size:1rem!important; padding:10px!important } - - Need help with customizing your site? Here are my current support options: https://www.insidethesquare.co/code-help - - The term Squarespace is a trademark of Squarespace, Inc. This content is not affiliated with Squarespace Inc. The accuracy of this information is subject to change. #SquarespaceCustomization #WebDesignTips #CSSforBeginners #squarespacetutorial #SquarespaceCSS