My Blocksy Theme Setup

Setting up a professional WordPress site requires a theme that balances performance, aesthetics, and ease of use. For tskamath.com, the Blocksy theme setup has been a game-changer. This post dives deep into my specific configuration, from core plugins and extensions to the fine-tuned typography settings that make the site readable and fast.

Why I Chose Blocksy for My Theme Setup

When searching for the ideal theme, I evaluated several popular options. Blocksy stood out for three primary reasons: speed, customization, and modern compatibility. Unlike older themes that rely on heavy jQuery or bloat, Blocksy is built with modern web technologies, ensuring a high Core Web Vitals score right out of the box. The integration with Gutenberg is seamless, allowing for complex layouts without the need for a dedicated page builder like Elementor. If you are interested in further site customization, check out my guide on customizing the Starship terminal.

Core Plugins and Extensions

A robust theme setup is only as good as the tools supporting it. Below are the key plugins and Blocksy-specific extensions that power this site:

Activated Plugins

Blocksy Companion (Premium): The heart of the customization engine, providing advanced header/footer builders and pro extensions.
Akismet Anti-spam: Essential for maintaining a clean comment section.
Code Snippets Pro: Used to add custom PHP or CSS without touching the functions.php file.
Rank Math SEO Pro: Our choice for handling metadata, sitemaps, and keyword optimization.
WP Mail SMTP Pro: Ensures reliable email delivery for forms and notifications.

Blocksy Pro Extensions

I have enabled several specific extensions to enhance the user experience:

Cookies Consent: A simple, lightweight solution for GDPR compliance.
Trending Posts: Increases internal engagement by highlighting popular content.
Post Types Extra: Adds useful metadata like Read Time and Posts Filter to the blog archive.
Local Google Fonts: Critical for performance; it hosts fonts locally to avoid external requests to Google’s servers.

Visual Design and Typography Settings

The visual identity of tskamath.com is defined by its typography and layout spacing. In my Blocksy theme setup, I prioritized a “compact” feel that remains airy and readable. Managing multiple domains? Learn about self-hosted VPS multi-domain support.

Customizations at a Glance

Maximum Site Width: Fixed at 1120px to prevent lines of text from becoming too long on wide monitors.
Content Area Spacing: Set to 40px for a consistent gutter between elements.
Header Layout: Top Row (50px min height) and Main Row (80px min height) for a clean navigation experience.

Typography Choices

Base Font: Roboto (18px, Regular 400). This provides a modern, sans-serif look that is easy on the eyes.
Heading 1 (H1): Georgia (32px, Bold 700). A serif font for headers adds a touch of authority and contrast. Line height is set to 1.3 with -0.01em letter spacing.
H2 and H6: 30px, 600 weight. The H6 is specifically used for internal section identifiers with additional CSS.

Tips and Lessons Learned

After running this setup for several months, here are my key takeaways for anyone starting their own Blocksy theme setup:

Use Local Fonts: Always enable the Local Google Fonts extension. It drastically improves your LCP (Largest Contentful Paint) score.
Stick to the Header Builder: Don’t use a plugin for your header. Blocksy’s native builder is more than capable and much faster.
Consistent Spacing: Define your global spacing (site width and content area) early. Changing these later can break your custom Gutenberg block layouts.

Conclusion

The Blocksy theme is more than just a skin for WordPress; it’s a performance framework. By combining it with a surgical selection of plugins and a focus on typography, I have created a site that is both functional and beautiful. For more information, you can always refer to the official Blocksy Video Tutorials.