By default, the Breakdance theme Grid element creates static grid layouts using a selected number of columns and rows that you specify.

The Grid element creates evenly spaced and sized grid blocks based on the contents of the largest block in a row. So row 2 will be taller to fit the contents of the 2nd column in row 2 if they are taller than any of the row 1 blocks.

Enough of that.

You can customize the default grid layout in creative ways. I used this method on the Flawless Templates website.

How to customize the Breakdance Grid

Part 1 Video: Make a custom Grid layout.

Part 2 Video: Make a 2-column layout for Tablet Portrait screen sizes.

Here’s how to customize the Breakdance theme Grid layout:

• Create a Grid in Breakdance (Example: 3 columns, 2 rows, 6 total blocks)
• Go to visualgridbuilder.com

• Create the grid layout you want (Example: 3 columns, 3 rows, 6 total blocks)

• Click the Get the code button to open the "CSS for your Grid" panel
• Scroll down to the Grid Items code - Example: .grid-item-1 { grid-area: 1 / 1 / 2 / 2; }
• Copy the code inside the brackets for the first item - Example: grid-area: 1 / 1 / 2 / 2;

• Go to the Breakdance editor, click the first grid item... (Div)
  • Click the Gear Icon (Settings) (Left-Sidebar)
  • Click the Advanced tab
  • Paste the copied code into the Custom CSS pane
  • Click the Save button (Top-Right)
• Repeat for all other items in your grid.

Follow these steps to make your Grid transform to a 2-Column layout on Tablet portrait screen sizes. (Note: The Grid will automagically shift to a 1-Column layout for smaller screens.)

• Create a 2-Colum and 3-Row layout on visualgridbuilder.com (2-columns, 3 rows, 6 total blocks)
• Click the Get the code button to open the "CSS for your Grid" panel
• Scroll down to the Grid Items code - Example: .grid-item-1 { grid-area: 1 / 1 / 2 / 2; }
• Copy the code inside the brackets for the first item - Example: grid-area: 1 / 1 / 2 / 2;

• Go to the Breakdance editor, click the first grid item... (Div)
  • Click the Gear Icon (Settings) (Left-Sidebar)
  • Click the Advanced tab
  • Paste the copied code into the Custom CSS pane
  • Click the Save button (Top-Right)
• Repeat for all other items in your grid.

That’s it.

You’ve created a gorgeous responsive custom grid layout using the Breakdance Grid Element. (Like the one I made above.)

Enjoy!

Get the Breakdance Theme.

Happy customers are the lifeline of Small Businesses.

So, providing great customer support is a big deal.

And there’s more to it than sending emails back-and-forth with your customers.

A Support System

Delivering great support requires a support system that:

• Collects Support Request Tickets
• Alerts admins of new Tickets
• Enables admins to see all Tickets from a user
• Tracks Ticket replies/responses
• Enables admins to reuse Ticket replies/responses
• Tracks admin Ticket response times
• Displays/exports reports on Tickets

The real key to delivering great support for Small Businesses and Solopreneurs is having the ability to setup and manage a support system fast, without technical skills, and affordably.

Fluent Support

Fluent Support does all this for just $129/Year.

Fluent Support is a budget-friendly helpdesk solution that’s perfect for small businesses and agencies.

Fluent Support is a WordPress Plugin, meaning it only works on WordPress websites.

It took me about an hour to set it up and test it on a new website I'm building.

Free vs Paid Version

The FREE version is fine to get started for most Small Businesses and Solopreneurs.

The FREE version has these features:

• Unlimited Tickets
• Unlimited Agents
• Displays Active Tickets by Product/Service
• Displays Ticket Statistics
• Displays Ticket Status (Open, Active, Closed, New)
• Customer Details (Activity, Stats)
• Unlimited Ticket Attachments
• Ticket Internal Notes
• Agent Reports
• Product Reports
• Ticket Importer (Migration)
• ReCaptcha
• Email Verification
• Two-Factor Authentication (2FA)
• REST API
• FluentCRM & Fluent Forms Integrations

The PAID version adds these features:

• Auto Close
• Email CC
• Saved Replies
• Ticket Merge
• Collision Detection
• Activity Reports
• Agent Time Tracking
• Customer Satisfaction Ratings
• Email Piping
• Manual & Automatic Workflows
• Incoming Webhook
• 15+ WordPress Integrations
• Slack, Telegram, WhatsApp, Discord Integrations
• Ticket Tags
• Custom Fields

Conclusion

I think Fluent Support is a terrific tool for setting up a Support System that a single person or a small team can manage.

Get Fluent Support here.

Give it a try.

Then come back and share what you think in the comments.

Enjoy!

Full Disclosure: I use Fluent plugins, love them, and I am an affiliate.

Who Is WordPress For?

WordPress is designed for everyone.

“Everyone” is not a niche.

The WordPress market boils down to these two audience segments…

Coders & Non-Coders.

WordPress is complicated.

Find out how to make WordPress easy.

Watch the full video above!

What do you hate about WordPress?

Share it.

Affinity Designer, Affinity Photo, and Affinity Publisher have been merged into the all-new Canva “Affinity” app. And it’s FREE!

These are professional grade photo editing, design, and document layout tools that everyone can now use for free.

This is a big deal for website owners and developers who want to create optimized photos and graphics for their website.

The Backstory

Back in May 2024, Canva bought Serif (makers of the Affinity creative apps) for an undisclosed amount. Affinity had around 3 million users of its powerful design, photo editing, and layout apps. Affinity apps attracted a large base of creative users by charging a one-time affordable license fee (imagine that), and by making really amazing apps with professional grade features. Canva bought Affinity to better compete with Adobe which charges monthly and annual subscription fees to use its apps.

Since the sale, the Affinity team has re-imagined their apps and succefully merged them into a single “Affinity” app. Currently available on Windows and Mac, the Affinity app will be coming to iPad soon. The Affinity app now uses “one universal file type”, and features Canva integrations that allow users to quickly export designs to their Canva account. Canva Premium subscribers can use AI-powered Canva editing tools like image generation, photo cleanup, and instant copy directly within the Affinity app.

Older versions 1 and 2 of the standalone Affinity apps will still work for users who has previously purchased them. But, those legacy apps will not be updated going forward.

The Threat

Canva has promised the new Affinity app will be “Free Forever.”

Like Adobe, Canva also uses a subscription business model–locking most of its capabilities behind subscription paywalls. This raises concerns that Affinity is likely to adopt Canva’s subscription-based approach.

Canva and Affinity have published a joint pledge promising to keep Affinity software “fair, transparent, and affordable.” This includes “the perpetual licenses that have made Affinity special.”

While fulfilling that pledge would actually be great for business, there is a long history of corporate lust for profits choosing to kill off revenue growth pollinators like free offerings and their loyal niche supporters.

The Upside

Overall this is a big deal for anyone who owns or manages a website.

Creating web optimized images and graphics requires special tools and skills. Making these tools free may lead to more websites having better images and graphics.

Notes

The new Affinity app will open files made with the legacy Affinity Designer, Affinity Photo, and Affinity Publisher apps. Those legacy apps cannot open files made in the new Affinity app.

There is a small learning curve using the new Affinity app for legacy app users. Though most of the features and workflows are unchanged.

A key benefit of the new Affinity app is the ability to move between the design, photo, and layout features instantly in the same app. (Cool!)

I highly recommend trying the new free Affinity app.

Or, if you were an Affinity user, login to your Affinity account and download copies of the legacy apps to save and use.

Get the new Affinity app here: https://www.affinity.studio/

Enjoy!

Testing is an essential part of maintaining a website.

The key is knowing what to test.

Here’s a checklist of tests to perform before launching a website, and occasionally after launch...

1 | Go to the Website on a Phone, Laptop, and Desktop device.

• Confirm the website Home page appears.

2 | Go to the Website using the “www.” prefix.

• Confirm the website Home page appears.

3 | Click main navigation links.

• Click each link in the site main navigation.
• Confirm the links go to the intended URLs.

4 | Click buttons and links on each page.

• Go to each page on the site.
• Click each button/link and confirm the link goes to the intended URL.

5 | Test site Forms

• Go to other Forms on the site and submit each form;
• Confirm the form submits;
• Confirm a site admin receives a form submission alert email;
• Confirm receipt of a form submission “Thank You” email (sent to the email address entered into the form).

6 | Test Site Features

• Book an Appointment
  • Confirm a site admin receives a Booking alert email.
  • Confirm receipt of a Booking confirmation email (sent to the email address entered into the booking form).
  • Login to the site admin and confirm the Booking appears.
• RSVP or Register for an Event
  • Confirm a site admin receives an Event registration alert email.
  • Confirm receipt of an Event registration confirmation email (sent to the email address entered into the Event registration form).
  • Login to the site admin and confirm the Event registration appears.
• Register or Purchase a Membership
  • Confirm a site admin receives a Membership registration alert email.
  • Confirm receipt of a Membership registration confirmation email (sent to the email address entered into the Membership registration form).
  • Login to the site admin and confirm the Membership registration appears.
• Purchase a Product (E-commerce)
  • Confirm a site admin receives a Purchase alert email.
  • Confirm receipt of a Purchase confirmation email (sent to the email address entered into the Checkout form).
  • Login to the site admin and confirm the Product Purchase appears.

7 | Test Blog Comments

• Submit a Blog comment.
• Confirm a site admin receives a New Comment alert email.
• Login to the site admin and “Approve” the Blog comment.
• Go to the blog and onfirm the Blog comment was posted.

8 | Test Footer Links

• Click all Footer links and the links go to the intended URLs.

9 | Test Email Automations

• Test “Welcome” Emails:
  • Appointment Booked Email: List what will be learned; what benefit(s) will be received; and what is needed for the session/meeting.
  • Event Registration Email: List the event agenda and key takeaways.
  • Membership Registration Email: List member benefits.
  • Product Purchase Email: List product features and key benefits.

10 | Review Privacy Policy & Terms Of Use Docs

• Download my Services Business Privacy Policy and Terms Of Use Templates. (Apple Pages, Microsoft Word, and PDF files)
• Have a Lawyer review your site Privacy Policy and Terms Of Use docs.

I’m redesigning a website, and I added a “™” trademark symbol to a headline... it didn’t look good.

The trademark symbol was bold and stood out too much.

Here are the changes I wanted to make...

• Un-bold the “™” trademark symbol.
• Reduce the size of the “™” trademark symbol (a bit).
• Adjust the height position of the “™” trademark symbol.

Web browsers can render content in funny ways.

CSS was invented to give web designers tight control over how web browsers display content.

So I added some CSS.

Here’s how I made it look better...

First I created the headline with the “™” trademark symbol in it.

Type Option+2 for a “™” trademark symbol.
Type Option+g for a “©” copyright symbol.

Here’s the original headline code:

<h1>I Make WordPress Easy™ for non-coders, web designers, and developers.</h1>

Here’s how that original headline code looked:

To fix the way the “™” trademark symbol looks, I added a SPAN tag around the trademark symbol with some CSS code.

Here’s the final headline code with the CSS style code:

<h3>I Make WordPress Easy<span style="font-weight: 400; font-size:2rem; position: relative; bottom: .35rem;">™</span> for non-coders, web designers, and developers.</h3>

Below is a breakdown of each of the 4 CSS tags I added:

• Added a <span>™</span> tag around the “™” trademark symbol.
• Added some CSS to the opening span tag like this: <span style="">
• Reset the font-weight using this CSS: <span style="font-weight: 400;">
• Reset the font-size using this CSS: <span style="font-weight: 400; font-size: 2rem;">
• Set the position using this CSS: <span style="font-weight: 400; font-size: 2rem; position: relative;">
• Set bottom spacing (raise the element up) using this CSS: <span style="font-weight: 400; font-size: 2rem; position: relative; bottom: .35rem;">

Here’s how the headline looks after adding the completed SPAN tag with the CSS:

The difference is subtle. But it is a noticeable difference.

CSS is a powerful web design coding language.

Are you using CSS on your website?

Consider consulting a web developer about how CSS can enhance your website.

If you want to learn CSS, here’s my favorite CSS book: https://amzn.to/4ouauGz

Cheers!

Setting visibility conditions for website menu links can improve a sites overall user experience.

I’m redesigning a nonprofit website for the Judicial Friends Association (JFA) and I use visibility conditions to show/hide navigation menu links to add context and provide a better user experience.

I’m going to break this down...

Menu Requirements

Here are the functional requirements for the JFA website Main Menu:

• Make it easy for new members to register.
• Make it easy for members to renew their Membership each year.
• Make it easy for members to access and manage their Membership account.
• Make it easy for site visitors to access site content.

It helps to list the requirements of your website menu.

The Site Map

Here is the Site Map showing the sites’ main navigation structure:

1.0 Logo - Links to the site Home page.
2.0 Highlights - Blog posts.
3.0 About
- 3.1 President’s Message
- 3.2 Board Of Directors
- 3.3 About Us
- 3.4 Our History
- 3.5 Scholarships
- 3.6 Internships
4.0 Membership (Show/Hide Condition)
5.0 My Account (Show/Hide Condition)
6.0 Login (Show/Hide Condition)
7.0 Logout (Show/Hide Condition)

How It Works

Here’s a breakdown of how this works.

I set visibility Conditions for 4 of the menu items as follows:

Membership | Condition: Visible to Logged-Out users.

My Account | Condition: Visible to Logged-In users.

Login | Condition: Visible to Logged-Out users.

Logout | Condition: Visible to Logged-In users.

The result is users see what they need to see based upon their logged-in status.

There are many use cases for using visibility conditions in a WordPress navigation menu. Here are a few examples:

• Show a link IF a users role is Customer.
• Show a link IF the day of the week is Friday.
• Show a link IF a users registration date is Before/After a specific date.

Try adding visibility conditions to your website menu and see how it improves your site.

Cheers!

I Just Finished Redesigning My Website

Want to see it?

I wanted to redesign my website with these functional requirements:

1. Collect Newsletter Subscribers
2. Present My Capabilities
3. Have Free + Paid Newsletter Subscribers
4. Collect & Qualify Quote Requests
5. Advanced SEO
6. Email Newsletter Subscribers Whenever I Publish A Newsletter
7. Manage Everything On My Website (No Other Apps or Services)

This is a Content Creators website.

It’s a minimalist design that:

• Communicates my value proposition.
• Shares my Methodology.
• Shares my clients & my work.
• Collects leads.

It does all this on just 4 pages.

It uses “The Web Guy” logo and brand system.

Download The UI Designs Here

Want to follow along as I build it?

Subscribe and I’ll email you updates on the process.

Want to see it?

First, here are my new website requirements:

1. Collect Newsletter Subscribers
2. Present My Capabilities
3. Have Free + Paid Newsletter Subscribers
4. Collect & Qualify Website Design Quote Requests
5. Advanced SEO
6. Email Newsletter Subscribers Whenever I Publish A Newsletter
7. Manage Everything On My Website (No Other Apps or Services)

This is a Content Creators website.

It’s a minimalist design that:

• Communicates my value proposition.
• Shares my Methodology.
• Shares my clients & my work.
• Collects leads.

It does all this on just 4 pages.

It uses my “The Web Guy” logo and brand system.

Download the Page Designs here.

What do you think?

Want to follow along as I build it?

Subscribe and I’ll email you updates on the process.

Bricks 2.1 beta is has been released.

This beta release reveals the 10 major new features coming in the final 2.1 version.

WARNING: Do not use a beta version on a production website.

The features in version 2.1 will streamline and improve development workflows.

Here are the 10 new Bricks features:

1. Components As Blocks - Use Bricks components directly inside the WordPress block editor (Gutenberg). Not all admins work inside the Bricks Builder interface or have access to it. This feature enables all site admins to edit Bricks content.
2. Bricks Wireframes & Design Sets - Layout Wireframes provide clean structural starting points, while Design Sets provide polished, fully-styled layouts.
3. Global Queries & Query Manager - Create a query once and reuse it across your site. Update a query in one place and the changes apply site-wide.
4. Query Data from APIs - Fetch & display third-party API data in your query loops—no custom code needed. Combine WordPress content with third-party data sources for richer, more dynamic websites.
5. Use Frontend Forms To Create & Update Posts - Let users create and edit content from the front end—without giving them admin access or building custom endpoints.
6. Fluid Typography Generator - Create fluid type scales visually. Enter minimum & maximum sizes and let Bricks do the math. Headings and body text scale gracefully across screen sizes. Apply the same type system across your entire site via Theme Styles.
7. New Map Element: Leaflet (OpenStreetMap) - Google Maps uses heavy scripts, API keys, and has usage costs. The new Map - Leaflet (OpenStreetMap) feature offers: Faster loading maps with fewer external dependencies.
8. User Activation Email - Sends an email with an activation link to every new user registrant. Only verified users can proceed, keeping memberships, downloads, and community areas clean. A clear “confirm your email” flow that’s familiar to users.
9. Tabs-to-Accordion Layout On Mobile - Transform Tabs into vertically stacked accordion panels optimized for touch, starting at any breakpoint you set. Users can see headings and open multiple sections without losing their place. No squished tab labels, overflow, or wrapping problems on small screens.
10. Image & Image Gallery Caption Styles - Define global typography, spacing, and color for all image and image gallery captions.

In my opinion, these are all important enhancements that will make better websites.

Bricks is one of my top 2 best builders for WordPress.

As a reminder Bricks is for developers. And coding skills are required to use Bricks effectively.

That being said… check out the Bricks 2.1 beta. And let me know what you think.

Cheers!

The Wordfence Security plugin aggressively checks for potential threats to a website. This issue is caused by the default XSS Cross Site Scripting setting in Wordfence. With this setting enabled, Wordfence sees the way Breakdance (and other WordPress themes) uses cross-site scripting as a potential security risk. This setting catches any potentially insecure requests and blocks them, which triggers the 403 error messages. The problem is these requests are not a threat.

The key to making an impact is listening.

A user feedback survey is more than just a few checkboxes—done right, it’s a foundation for continuous improvement, building deeper trust, and achieving better outcomes.

In this post, you’ll get my recipe for:

• A ready-to-use Program/Service Satisfaction Survey
• A 3-Part Email Sequence designed to maximize survey responses
• Actionable tips for making the survey feel meaningful (so people want to fill it out)

Let’s get started.

A checklist of the 30 features you want a website Form Builder to have.

Enjoy!