Tim McGiven's Blog, page 13

Developer Q&A: Dika Fei of Jelly Pixel Studio

Dika Fei, like most founders, had a couple ideas that failed before hitting just the right note when he started his web development company, Jelly Pixel Studio. With a team of seven, Jelly Pixel Studio specializes in crafting unique and illustrative websites for a variety of clients worldwide. 

I had the chance to talk with Dika about why he loves WordPress.com, a few of his favorite tools, and examples of projects he’s most proud of. 

If Dika’s high praise convinces you to give WordPress.com another look, you can learn more about our specs and get started at WordPress.com/hosting. 

Jelly Pixel’s team. Dika is second from left, with the “peace” sign.

1. How long have you been working with WordPress and WordPress.com?

I’ve been working with WordPress for about 10 years now. When I first started, it was a bit like jumping into a lake and hoping there were no crocodiles! Back then, it wasn’t as obvious which CMS to choose. Joomla and Drupal were still pretty big, and it wasn’t clear that WordPress would be the best option. But we chose WordPress because it seemed more straightforward, and I’m so glad we made that decision. It was the right one. 

2. What do you like most about using WordPress.com for your clients?

If I knew nothing about it, I’d say WordPress.com works like magic! The uptime of websites on WordPress.com is often 100%, which really surprised me, especially compared to other hosting servers. It’s incredibly stable and scalable at a price point that’s hard to beat. 

Jelly Pixel is also part of Automattic for Agencies, and it’s impressive how the system scales, like running 10 CPUs that can go up to 100 when needed.

It’s a true “set it and forget it” experience in the WordPress industry. Let me know where you get your magic pixie dust from! 

3. What are your favorite tools or themes to use in your projects?

I love using GeneratePress and Advanced Custom Fields (ACF). 

GeneratePress is a lightweight theme that supports different approaches to web development, including full site editing. It’s a great starter theme for developers. 

Advanced Custom Fields is a well-known plugin, and I particularly appreciate how it now allows you to create Gutenberg blocks easily, handling the backend UI for you.

4. What recent WordPress features or updates are you excited about?

I’m really excited about the Interactivity API enabling more dynamic and interactive site features, akin to what we see with React. It’s still in its early days, but I think we’ll see more adoption soon.

5. What’s most important to you when building a WordPress site?

Stability and security are my top priorities. One of the biggest factors there is having a secure hosting environment. Many security issues come from improperly configured hosting, but with WordPress.com, you don’t have to worry about that. The secure server setup handles every vulnerability for you, which is a huge relief.

6. Can you share a few of your favorite client sites? Why do they stand out to you?

Screenshot

Ambient Lounge Japan, for its amazing product customization feature.

Workprint LA, for its overall design.

CNIB Access Labs, as a fully accessible and beautifully designed site. 

Get started at WordPress.com today

Beyond our customization options and extensability, what keeps Dika Fei and Jelly Pixel Studio using WordPress.com are our rock-solid security and performance specs. Those foundational aspects of developing and hosting sites can get overlooked amidst glitzy marketing campaigns. If you’re as impressed with our uptime as Dika, get started building today: 

WordPress.com/hosting

Hot Off the Press: New WordPress.com Themes for August 2024

The WordPress.com team is always working on new design ideas to bring your website to life. Check out the latest themes in our library, including great options for dog lovers, engaged couples, and interior design aficionados.

All WordPress.com ThemesBark

Bark is a pawsitively perfect theme for pet care pros, striking the perfect balance between professional and playful. With sections tailored to showcase your services, testimonials, and even a map of your service areas, Bark helps make your business the leader of the pack. The typography adds a touch of modern charm, while the warm color palette and rounded corners brings comfort to every page. And with four color schemes available, Bark has all the tricks to make your site fetch some serious attention.

Click here to view a demo of this theme.

Vows

Vows is the perfect theme for engaged couples who want to tie everything together in style. Inspired by the timeless elegance of wedding stationery and photography, Vows acts as a sleek, all-in-one link hub, making it easy to coordinate your big day. From centralizing information to sharing event details and visual themes, this theme does it all with grace. With sophisticated font pairings and style variations, Vows sets the perfect tone for your celebration.

Click here to view a demo of this theme.

Cottage

Cottage is the perfect theme for anyone who wants to share the warmth and charm of their home or interior design sensibilities with the world. Inspired by the cottagecore aesthetic, this theme wraps your content in an earthy, cozy color palette that feels like a warm cup of tea on a rainy day. With a stunning gallery page to showcase your space and a delightful background pattern that adds a touch of whimsy, this will be your go-to design for all things homey and beautiful. Whether you’re blogging about decor or sharing your latest design inspiration, Cottage makes your site feel like home.

Click here to view a demo of this theme.

Hola

Hola was built for bloggers and newsletter creators who want their words to shine. A sleek variation of the Hey theme, Hola keeps it simple with a text-forward design that highlights your latest posts in a clean, straightforward layout. The striking header is created by adding a black-and-white image to a Cover Block with a preset duotone—an effect also applied to featured images, avatars, and the site logo.

The theme’s expanded color palette and four unique style variations bring a bit of personality to the mix, whether you’re vibing with cool blues, the vibrant magenta, or earthy tones. No matter your aesthetic, Hola offers a minimalist canvas with just the right pop of flair.

Click here to view a demo of this theme.

To install any of the above themes, click the name of the theme you like, which brings you right to the installation page. Then click the “Activate this design” button. You can also click “Open live demo,” which brings up a clickable, scrollable version of the theme for you to preview.

Premium themes are available to use at no extra charge for customers on the Personal plan or above. Partner themes are third-party products that can be purchased for $99/year each on the Business plan and above.

You can explore all of our themes by navigating to the “Themes” page, which is found under “Appearance” in the left-side menu of your WordPress.com dashboard. Or you can click below:

All WordPress.com Themes

The Fediverse Files: The Magic of Federation

Remember when commenting on blogs and interacting with other commenters was one of the core pieces of enjoying the web? Matthias Pfefferle is making commenting cool again with ActivityPub for WordPress, a plugin that seamlessly connects your WordPress website to the fediverse. 

In this interview, Doc Pop and Matthias talk about fediverse applications that apply beyond social media—and where the ActivityPub protocol can go in the future. 

Will you be one of those people? Federate your website today and get 25% off a WordPress.com Business or Commerce hosting plan by using coupon code federate25—or click below:

Get your 25% off

Building Studio in Public: Maintaining High Performance in Our Local Development App for Enhanced UX

We’re back with Part 2 of our “Building Studio in Public” series! Today, we’re diving into the challenges we faced while optimizing Studio’s performance. This post will be especially valuable if you’re developing an Electron app and dealing with performance issues or if you’re simply curious about how the Studio app functions behind the scenes.

If you’re following the series, be sure to check out our first post: Using WordPress Components and Tailwind CSS in our Local Development App .

As a reminder, Studio is our free, open source local development app. It’s based on Electron (the focus of today’s post!) and is currently available for Mac and Windows.

Download Studio for freeOvercoming the challenges of running local development sites

Running a local development site can be complex, often requiring the setup of multiple tools. A typical approach involves using multi-container applications like Docker and Docker Compose in addition to setting up a web server with a WordPress installation and a MySQL database. This process can become even more challenging when managing multiple sites simultaneously.

Studio was designed to simplify this process, allowing users to set up sites quickly without any prior configuration. This capability is powered primarily by the WordPress Playground project, which enables anyone to run a fully functional WordPress site within a browser or Node.js environment. 

For each site created with Studio, we run a basic web server using ExpressJS to handle web requests and use WordPress Playground to process them.

Initially, this was implemented in the Electron-based Studio app without noticeable performance issues.

However, as we expanded our testing across Mac and Windows, we observed some slowness in UI interactions when managing and navigating sites. Everything seemed properly configured, but something was clearly off.

Keeping the main process lightweight

As we delved into these performance issues, we discovered that running sites within Electron’s main process was the primary cause of the slowdown. Processing web requests and executing the associated PHP code for WordPress in the main process added extra load, which negatively impacted other operations, aka that UI slowness we were seeing.

Electron’s documentation is incredibly valuable for addressing performance issues, particularly those related to blocking the main process. It was clear that maintaining a lightweight main process is crucial, and avoiding heavy or blocking operations in this context is essential. However, this realization presented a new challenge: how do we detach the running sites from the main process?

Spawning dedicated processes

To tackle the performance issues, we adopted the tried-and-true strategy of “divide and conquer.” 

The idea was to run Studio’s sites in dedicated processes, separate from the main one. Since Electron is built on Node.js, spawning child processes seemed like a plausible solution. However, Electron also offers a utilityProcess utility, which behaves similarly to Node’s child processes, but operating at the browser level and aligning more closely with Electron’s app model.

While this approach promised to alleviate the load on the main process, it also introduced additional complexity. We had to manage these new processes and handle communication between the main and dedicated processes via messages. Additionally, we encountered challenges related to the build configuration and using Webpack for building the application.

Below is a full example of implementing this approach (click to expand each example to see the full code):

Dedicated Process Manager (process.js):const { app, utilityProcess } = require( 'electron' );// This path should be calculated dynamically as the file could be in// different locations depending on the build configurationconst PROCESS_MODULE_PATH = './process-child.js';const DEFAULT_RESPONSE_TIMEOUT = 120000;class Process { lastMessageId = 0; process; ongoingMessages = {}; async init() { return new Promise( ( resolve, reject ) => { const spawnListener = async () => { // Removing exit listener as we only need it upon starting this.process?.off( 'exit', exitListener ); resolve(); }; const exitListener = ( code ) => { if ( code !== 0 ) { reject( new Error( `process exited with code ${ code } upon starting` ) ); } }; this.process = utilityProcess .fork( PROCESS_MODULE_PATH, [], { serviceName: 'dedicated-process', env: { ...process.env, IN_CHILD_PROCESS: 'true', APP_NAME: app.name, // Note that Electron context won't be available in the dedicated process. // Add here other environment variables that might be needed. }, } ) .on( 'spawn', spawnListener ) .on( 'exit', exitListener ); } ); } // This is an example function. Feel free to add more for other purposes. async exampleFunc( command, args ) { const message = 'exampleFunc'; const messageId = this.sendMessage( message, { command, args } ); return await this.waitForResponse( message, messageId ); } // It's important to keep in mind that the process will be running // until it's explicitly stopped. async stop() { await this.killProcess(); } sendMessage( message, data ) { const process = this.process; if ( ! process ) { throw Error( 'The process is not running' ); } const messageId = this.lastMessageId++; process.postMessage( { message, messageId, data } ); return messageId; } async waitForResponse( originalMessage, originalMessageId, timeout = DEFAULT_RESPONSE_TIMEOUT ) { const process = this.process; if ( ! process ) { throw Error( 'The process is not running' ); } if ( this.ongoingMessages[ originalMessageId ] ) { throw Error( `The 'waitForResponse' function was already called for message ID ${ originalMessageId } from the message '${ originalMessage }'. 'waitForResponse' may only be called once per message ID.` ); } return new Promise( ( resolve, reject ) => { const handler = ( { message, messageId, data, error } ) => { if ( message !== originalMessage || messageId !== originalMessageId ) { return; } process.removeListener( 'message', handler ); clearTimeout( timeoutId ); delete this.ongoingMessages[ originalMessageId ]; if ( typeof error !== 'undefined' ) { console.error( error ); reject( new Error( error ) ); return; } resolve( data ); }; const timeoutHandler = () => { reject( new Error( `Request for message ${ originalMessage } timed out` ) ); process.removeListener( 'message', handler ); }; const timeoutId = setTimeout( timeoutHandler, timeout ); const cancelHandler = () => { clearTimeout( timeoutId ); reject( { error: new Error( `Request for message ${ originalMessage } was canceled` ), canceled: true, } ); process.removeListener( 'message', handler ); }; this.ongoingMessages[ originalMessageId ] = { cancelHandler }; process.addListener( 'message', handler ); } ); } async killProcess() { const process = this.process; if ( ! process ) { throw Error( 'The process is not running' ); } this.cancelOngoingMessages(); return new Promise( ( resolve, reject ) => { process.once( 'exit', ( code ) => { if ( code !== 0 ) { reject( new Error( `Process exited with code ${ code } upon stopping` ) ); return; } resolve(); } ); process.kill(); } ).catch( ( error ) => { console.error( error ); } ); } cancelOngoingMessages() { Object.values( this.ongoingMessages ).forEach( ( { cancelHandler } ) => { cancelHandler(); } ); }}module.exports = Process;Dedicated Process Logic (process-child.js):// Replace with initial setup logic based on the environment variables if needed.console.log( `Run initial setup for app: ${ process.env.APP_NAME }` );const handlers = { exampleFunc: createHandler( exampleFunc ),};async function exampleFunc( data ) { const { command, args } = data; // Replace this with the desired logic. console.log( `Run heavy operation ${ command } with args: ${ args }` );}function createHandler( handler ) { return async ( message, messageId, data ) => { try { const response = await handler( data ); process.parentPort.postMessage( { message, messageId, data: response, } ); } catch ( error ) { process.parentPort.postMessage( { message, messageId, error: error?.message || 'Unknown Error', } ); } };}process.parentPort.on( 'message', async ( { data: messagePayload } ) => { const { message, messageId, data } = messagePayload; const handler = handlers[ message ]; if ( ! handler ) { process.parentPort.postMessage( { message, messageId, error: Error( `No handler defined for message '${ message }'` ), } ); return; } await handler( message, messageId, data );} );Run example (main.js):async function runExample() { const process = new Process(); await process.init(); await process.exampleFunc( 'my-command', [ 'example', 100 ] );}…app.whenReady().then( () => { runExample();} );…

Note: The code above has been adapted for use in a generic example Electron project. You can test it using Electron Fiddle .

Build configuration and Webpack

Our project build setup relies on Forge and Webpack. Implementing dedicated processes introduced extra complexity, as we initially bundled all the code into a single file. 

However, since dedicated processes require their code to run in isolation from the main process, we needed to separate the bundles. After adjusting the Webpack configuration, we successfully set it up to produce the necessary files.

Below is an example of the changes we applied (click to expand each example to see the full code):

Before:import { type Configuration } from 'webpack';export const mainConfig: Configuration = { // This is the main entry point for your application, it's the first file // that runs in the main process. entry: './src/index.ts',...After:import path from 'path';import { type Configuration, DefinePlugin } from 'webpack';// Extra entries are bundled separately from the main bundle. They are primarily used// for worker threads and forked processes, which need to be loaded independently.const extraEntries = [ { name: 'siteServerProcess', path: './src/lib/site-server-process-child.ts', exportName: 'SITE_SERVER_PROCESS_MODULE_PATH', }, // Here you can configure other dedicated processes];export default function mainConfig( _env: unknown, args: Record< string, unknown > ) { const isProduction = args.mode === 'production'; // Generates the necessary plugins to expose the module path of extra entries. const definePlugins = extraEntries.map( ( entry ) => { // The path calculation is based on how the Forge's webpack plugin generates the path for Electron files. // Reference: https://github.com/electron/forge/blo... const modulePath = isProduction ? `require('path').resolve(__dirname, '..', 'main', '${ entry.name }.js')` : JSON.stringify( path.resolve( __dirname, `.webpack/main/${ entry.name }.js` ) ); return new DefinePlugin( { [ entry.exportName ]: modulePath, } ); } ); return { ...mainBaseConfig, plugins: [ ...( mainBaseConfig.plugins || [] ), ...definePlugins ], };}export const mainBaseConfig: Configuration = { entry: { // This is the main entry point for your application, it's the first file // that runs in the main process. index: './src/index.ts', // Inject extra entries into the Webpack configuration. // These entries are primarily used for worker threads and forked processes. ...extraEntries.reduce( ( accum, entry ) => { return { ...accum, [ entry.name ]: entry.path }; }, {} ), },...

Note: The code above is directly from Studio , written in TypeScript .

Bonus tip: avoid blocking file system operations

We also noticed performance issues when using synchronous file system operations when building Studio, specifically when using the synchronous versions of functions, which can block the main process. To prevent this, it’s best to use the promise-based or callback versions of these functions.

For example, instead of using:

fs.readFileSync( path, 'utf8' );

Use:

await fs.readFile( path, 'utf8' );Ready to build?

If this information has piqued your interest, or if you’re developing WordPress sites, start leveraging the power of Studio today. It’s free, it’s open source, and it seamlessly integrates into your development workflow.

Download Studio for free

After downloading Studio, connect it to your WordPress.com account (free or paid) to unlock features like Demo Sites.

Want to contribute to Studio? Here are some GitHub issues you can dive into:

php_curl missing and curl_exec deactivatedTotal and free size of filesystem reported in sites doesn’t match actual values Permission issues using a theme that uses composer

The Fediverse Files: Making Social Media Fun Again

In this episode of the Fediverse Files, ‪‪Doc Pop talks with Bart Decrem, the co-creator of Mammoth, an open source Mastodon app for iOS.

Doc and Bart discuss how the walled gardens of modern social media platforms are finally getting some real competition from a better, and more open social web. The rise of the fediverse signals a return to the original promise of the web: that anyone can find a home, their own place on the internet, and connect with whomever they want without getting trapped in a single platform. 

Whether it’s through a newsletter, a podcast, or a publisher’s website, Bart’s goal is to get a million websites and a hundred million people onto the fediverse.

Will you be one of those people? Federate your website today and get 25% off a WordPress.com Business or Commerce hosting plan by using coupon code federate25—or click below:

Get your 25% off

How We Built It: Beeper’s New Blog

Automattic recently welcomed Beeper, an all-in-one messaging app, to our umbrella of life-improving apps. (If you haven’t yet, check out Day One, Pocketcasts, and Tumblr, too!)  

Since Beeper joined a company best known for its world-class WordPress hosting and plugin solutions, we knew our special projects crew would love creating a shiny new blog for the messaging team. 

With blog.beeper.com, our team showed off what can be quickly done with a minimalist framework. In this post, we’ll give you a short tour of the new site, including some design inspiration as well as before and after shots. 

Take a look at Beeper’s new blog and remember to download the app today on iOS, Android, or desktop. 

Maintaining Beeper’s clean and colorful aesthetic

Beeper’s design sensibility has always been fun and playful, featuring a blue-purple color palette, simple icons, and friendly imagery and messaging. We knew we didn’t need to reinvent the wheel on that front, so we maintained the overall aesthetic while giving the new blog a clean background that’s ideal for reading and absorbing content. The Beeper homepage, in comparison, offers a colorful, sparkly background that’s perfect for immediately drawing in visitors. 

Rather than complicate the design with a noisy layout, the team quickly decided that a one-column, minimalist structure using the popular Livro theme would be best for this project. The only custom flourish we’ve added is a simplified “Featured” section that the Beeper team controls and edits.     

Breaking free of Substack’s constraints   Beeper’s old blog at Substack is shown on the left, and at WordPress.com on the right. The first iteration of Beeper’s new blog didn’t include the featured section at the top. With WordPress, a design can always be reimagined and improved, even after launch day.

We transferred Beeper’s 7,000+ subscribers and all their archived content from Substack to WordPress.com. Our system beautifully handled those moving pieces and even ensured that all the links worked properly at their new home. 

Moving Beeper off of Substack and onto WordPress made this project unique for our team. Along the way, we realized some of Substack’s constraints, like styling and layout restrictions, and were glad to be able to move beyond them.

On the design front, for example, Beeper appreciated having more freedom than Substack’s pre-built, busy-looking magazine layout. And while there was some customization available, little details like the “Subscribe” box or even a “Download” button couldn’t be styled with Beeper’s branding aesthetic. These details do a lot to present a distinct and cohesive message. 

While it’s a subjective measure, we’re comfortable in saying the new design just feels better and more authentic to Beeper. 

Start using WordPress.com today 

If you’re impressed by what our team did with Beeper’s blog, consider moving your blog or newsletter to WordPress.com today. With our convenient importer tool, you can click a button, sit back, and dream about just how high your content can fly when not constrained by a platform’s built-in limitations. 

And if you’re curious about using WordPress.com to build sites for your clients, click below to learn more about our world-class hosting and development features:

Start building

Move to WordPress.com, and We’ll Handle the Migration for Free

If your WordPress website is hosted somewhere other than WordPress.com, we’d love for you to ask one simple question: Why? 

Maybe you started there because of a stellar pricing deal on hosting and just stayed put for years. Maybe their offering was cutting-edge at one time, but now it seems outdated. Are all those paid add-ons starting to look a little bloated? 

The WordPress.com of 2024 is vastly reimagined from what you may have encountered a couple of years ago. Our SEO tools, security features, unlimited bandwidth, and developer tools are world-class and built right in at no extra cost. 

And for a limited time, we’ll move your existing WordPress site from any host to WordPress.com for free. 

Let us do the work for you. We’re here to help and ensure that you’re getting the very best WordPress experience out of the box. 

Move your siteHow it works

The migration process takes only a few minutes, with no downtime involved. (Read those last four words again, because they’re very important!) Once your site is migrated, you’ll connect the domain and your site will be ready to go. Here’s how it works:

Head to WordPress.com/move and enter the URL of the WordPress site to migrate.Select the option to create a new site, or select the existing WordPress.com site where you’ll move the old site to. Select “Migrate site” to move all of your site’s content, themes, plugins, users, and customizations. (This selection requires our Business plan. More on that below.) Select “Do it for me” to get our team to review and handle your migration for you. Again, this option is 100% free for a limited time. Why move to WordPress.com?

Migrating to WordPress.com enhances your entire online presence with better security, improved performance, unlimited visitors and bandwidth, and reliable support. Here are some of the benefits:

Rock solid reliability: With a 99.999% uptime guarantee, your site will always be available, fostering more trust, sales, and peace of mind.Blazing fast performance: Our 28+ location CDN ensures your site loads at lightning speed, leading to happier users and higher conversion rates. Plus, WordPress.com is the top WordPress hosting provider per Google’s Core Web Vitals.Top-tier security: Our advanced protection measures keep your site safe from hacks and DDoS attacks, protecting both your business and your customers.Always up-to-date: You’ll always have the latest WordPress, PHP, and plugins, complete with new features and security updates.Complete control and customization: Use our extensive library of themes and design customization options to create a site that truly reflects your brand.Scalability and support: Ready to grow? We’ve got your back with advanced scaling to handle traffic spikes at no added cost. Plus, our managed hosting means we take care of updates and maintenance, allowing you to focus on what you love.

Get all of this and more by choosing the hosting platform built from the ground up by WordPress Core’s biggest contributors: WordPress.com.

The best place to WordPress

Our Business plan supercharges your WordPress website with plugins, third-party (or custom) themes, and everything else you need to host a professional website:

Plugins: Access over 50,000 plugins or upload/build your own.Third-party themes: Upload any WordPress theme or custom design.SEO tools: Access advanced SEO options and install plugins like Yoast Premium.Custom code: Add custom JavaScript, iframe, and header code for services like Google Adsense and Mailchimp.Backups: Ensure site safety with daily backups and easy one-click restorations.Uninterrupted performance: Improve user experience and load times with our multi-data center support, real-time replication, and global caching.Enhanced security: Use Jetpack Scan for malware and security threats.Advanced developer features: Use the development tools you know, love, and rely on like staging sites, WP-CLI, GitHub deployments, SFTP/SSH, database access, PHP version switching, and more.

How do those features translate to a better experience for you? Here’s what Michael P. had to say about the experience of migrating to WordPress.com::

“After migrating to WordPress.com our site is faster, easier to use, more secure, and technical support is nearly instant. The level of competency and understanding is a far cry from GoDaddy’s WordPress offering. It was a relief to work with a company that really knows how to manage WordPress!”

Want to migrate three (or more) sites?

For those of you who are managing multiple sites for others, our new Automattic for Agencies program may be a good fit for you. 

Through Automattic for Agencies, you can access agency pricing, referral earnings, premier support, and cutting‑edge tooling like WordPress.com, WooCommerce, Jetpack, and more. Joining is free, and signing up today will grant you early access and provide you the opportunity to shape the program.

Make the move

Being part of Automattic, the primary driver of the WordPress project, we are a uniquely positioned host to the core software development. Our commitment to the open-source community is unparalleled, with substantial engineering time and expertise dedicated to enhancing WordPress. As a WordPress.com customer, you directly benefit from this relationship through exceptional reliability, early access to innovative features, and support from the most skilled systems team in the industry.

Move your site to WordPress.com today, for free.

Move your site

The Fediverse Files: ActivityPub Interview with Evan Prodromou

In this episode of the Fediverse Files, Doc Pop talks with ActivityPub co-creator Evan Prodromou. ActivityPub is a fediverse technology that’s akin to what RSS is for podcasts and blog feeds; it’s the foundational element that connects platforms and allows them to communicate with each other. 

Doc Pop and Evan discuss the past, present, and future of ActivityPub and the fediverse.

Ready to take the leap? Federate your website today and get 25% off:

Get your 25% off

Beyond Avatars: How Gravatar is Transforming Online Identity

Gravatar, short for Globally Recognized Avatar, is a powerful service from Automattic, the company behind WordPress.com. For over two decades, Gravatar has been the driving force behind billions of avatar views across the web. Beyond WordPress, you’ll find Gravatar powering user profiles on platforms like ChatGPT, GitHub, Slack, and many more.

But Gravatar is far more than just a profile pic that follows you around the web. Let’s dive into seven key features that make Gravatar an indispensable tool for WordPress users.

From a WordPress avatar to a profile for everywhere

When Gravatar was first integrated into WordPress way back in 2006, it solved two critical problems:

WordPress lacked native image editing capabilities.Most servers hosting WordPress sites struggled with image resizing and performance.

Gravatar elegantly addressed these issues while offering users the convenience of uploading their avatar just once for use across multiple sites and blogs. Today, you’ll find Gravatar profiles integrated across the web.

It was, and still is, a win-win!

Put a face to a comment

Gravatar is what provides profile pictures on all the lovely comments on your blog. That simple addition—a photo where there might otherwise be a bland icon—dramatically increases reader engagement. Users with Gravatars are more likely to comment, and their contributions tend to be of higher quality. This can lead to more vibrant discussions on your blog, fostering a sense of community.

Increase engagement with hovercards 

Hovercards are an often-overlooked feature that can also significantly enhance user interaction. When enabled, hovering over an avatar reveals a snapshot of the user’s profile information.

To activate hovercards:

Go to Settings > Discussion in your WordPress dashboardLook for the “Gravatar Hovercards” option and enable itNote: If you’re not on a WordPress.com hosted site, you’ll need the Jetpack plugin installedGet verified 

Gravatar’s Verified Accounts feature lets you link your profile to services and social media platforms like Instagram, GitHub, TikTok, and Threads. This verification process confirms your ownership of these accounts, adding a layer of authenticity to your online presence and making your interactions more trustworthy.

Your link-in-bio solution

Did you know that Gravatar was the original link-in-bio service? Every Gravatar account comes with a free, customizable profile page that’s perfect for sharing:

Your bio and interestsImportant linksSocial media accountsPayment optionsContact information

It’s a versatile hub for your online identity, all in one convenient location.

Own your name on the web

Instead of using gravatar.com/username, you can now have a custom web address that truly represents you. This personalized domain isn’t just for vanity; it opens up new possibilities, such as using it as your username on emerging platforms like Bluesky.

To kick off custom domains, we’ve partnered with .link to offer you a free domain for the first year. This limited-time offer lets you personalize your Gravatar profile URL, making it more memorable and shareable.

Here is a video about why you should own your name as a domain and what it can unlock. 

More TLDs and domain options will be available in the months to come.

Innovate with profiles-as-a-service

For developers looking to enhance user experiences, Gravatar’s new REST API offers exciting possibilities:

Enrich customer profilesCustomize onboarding processesAdd delightful touches to user interactions

The best part? It’s completely free to use. 

WordPress site owners, keep an eye out for an upcoming WordPress plugin that will add even more Gravatar integrations to your site.

Get your free domain now

Don’t miss out on these powerful features and our exclusive domain offer. Visit the Gravatar blog to learn how to set up your custom domain and take control of your online identity. 

Get your domain today

Clearer Writing at Your Fingertips: Introducing Write Brief with AI (Beta)

At WordPress.com, writing isn’t just a task. It’s how we think. Automattic is a globally distributed company, which means our work is almost always done asynchronously. For us, written communication is oxygen. But that communication is not built around email. Instead we use a homegrown internal blogging tool. Since every piece of our writing lives as a blog post that will stay published and searchable forever, we need to write clearly and succinctly. 

The team at Jetpack AI started wondering if there was a writing tool that could help everyone at Automattic, from right inside the WordPress editor. Rather than search externally, we built one. And today we’re excited to share it with you. Say hello to Write Brief with AI from Jetpack.

Meet Write Brief with AI

Internally, we called this tool Breve—Latin for “brief.” It started as a hack week project and caught on across the entire company. In fact, we saw just how useful and beloved it quickly became and decided to release it into the world. Write Brief with AI is available for free (while in beta) for all WordPress.com plans and users.

What can Write Brief with AI do? Measure readability. Check how readable your writing is with a simple grade score. Our research shows you should aim for a score of 8-12 for the highest readability. (The lower the number, the better.) The tool calculates your score as you type.Tell you about long-winded sentences. Long sentences tire readers. Write Brief with AI highlights those examples so you can break them down. You can even ask Jetpack AI to simplify them for you.Boost your confidence. Writing needs to be strong and clear. This tool highlights words that sound uncertain, like “possibly,” “might,” or “could.” Replace them with more assertive alternatives to make your point confidently. Or, ask Jetpack AI to remove them for you with one click.Simplify your vocabulary. Complex words can bog down your message. The tool highlights complex words like the ones found in plainlanguage.gov and suggests simpler alternatives, keeping your writing clear and direct. Seamless WordPress.com integration

Write Brief with AI works right within the WordPress editor, handling blocks, nested blocks, patterns, and more. It’s an editing tool built to streamline your writing process directly in your familiar workspace. Write, edit, blog, directly from WordPress.

Simply click the Jetpack icon on the top right of your screen, and Write Brief with AI will get to work based on what’s check or unchecked in the sidebar.

We’re just getting started

We’re constantly improving and refining our platform based on your feedback. Write Brief with AI is just one step in our journey to make writing with WordPress even better. We’re excited for you to join us in this new chapter. Try it out in the post or page editor today and let us know what you think. Or click below to learn more. 

Learn more

For this release, Write Brief with AI is available exclusively in English. We’re working hard to expand language support in future updates.