Making WordPress Slack의 theme channel에서 이야기한 내용입니다.
After consolidating my ideas, it has become clear that this concept is not just a “design element” but a crucial UI/UX improvement point linked to the evolution of WordPress block themes.
We need a comprehensive discussion about core, FSE layout, block editor, Gravatar, and Fediverse interactions.
Key Discussion Points:
1️⃣ Ensuring Global Styling Consistency Across All Plugin Blocks
- WordPress themes should be able to control and enforce a consistent design for all plugins that render blocks on the frontend.
- This could be achieved by filtering the block output to apply global styles seamlessly.
2️⃣ Integrating HCT Color Space into WordPress Core
- If HCT color space is adopted into WordPress core, all themes could natively support a light/dark mode toggle and allow users to cache personalized colors on the frontend.
- Since Material Design for WordPress already exists, is it really necessary to develop a color space from scratch?
- Current WordPress-supported color spaces:
RGBA,HSLA,HEXCODE - If HCT is officially added, it could enable dynamic color implementation without additional plugins.
- Implementing HSL-based solutions may not guarantee WCAG compliance.
- Alternative question: Can themes define their own color spaces without modifying the core?
3️⃣ Full Integration of Posts Page & Author Page into a Fediverse Profile/Feed
- Can WordPress Posts Pages & Author Pages be fully integrated into Fediverse profiles/feeds?
- Can external Fediverse server profiles be automatically generated as virtual users or remote user feed pages within WordPress?
- 📌 Reference: WordPress Author Page Discussion
4️⃣ Fediverse Replies in the Comments Block – Hovercard Interaction Support
- Can Fediverse replies in WordPress Comments Block support hovering interactions similar to Gravatar Hovercards?
5️⃣ The Need for a Side-to-Top Responsive Header
- Since mobile devices primarily use vertical layouts while desktop monitors use horizontal layouts, a side-to-top responsive header improves viewport utilization and enhances UX.
- 📌 Reference: Slack Discussion
- Examples of Side Headers:
6️⃣ Extending Friends’ Frontend Layouts for Fediverse Control via FSE
- Can Friends plugin layouts be extended so that they can be fully controlled through Full Site Editing (FSE)?
Would love to hear thoughts on these!
Classic Theme vs. Block Theme – What is Preventing Change? I’d Love to Hear Your Opinions.
I am not sure whether this discussion belongs in the #forums, #themes, or #miscellaneous channel in WordPress Slack. However, I believe the transition between classic and block themes is an appropriate topic for the #themes channel. If this is not the correct place, please let me know which channel would be more suitable.
First, I want to clarify that I am not trying to criticize any specific commercial theme. However, my awareness of this issue arose due to the theme I primarily use, which is why I felt the need to address this topic.
I have reviewed the guidelines on linking to external resources:
🔗 WordPress Support Guidelines
While I understand the need to be cautious when sharing external links, the full discussion cannot be handled entirely within Slack. Therefore, I am including these links for reference.
However, I will also summarize the key points using AI, so checking the links is not strictly necessary.
Summary of the Two Linked Articles
First Link (Avada Theme Review):
- Avada has been the best-selling WordPress theme for a long time, but it still follows an outdated structure. To remain relevant, it must transition to a block-based Full Site Editing (FSE) theme, which is becoming the new standard.
- To stay competitive, Avada should integrate overlapping features into Jetpack, apply the Material Design System, and enhance compatibility with the ActivityPub plugin.
Second Link (ThemeFusion’s Official Response to the Avada Review):
- ThemeFusion acknowledges the value of block themes but argues that Avada’s strength lies in its proprietary ecosystem, which provides more powerful features than the block editor.
- A sudden transition to block themes is unrealistic due to the revenue model and market influence of classic themes.
- Avada 8 is not just a simple update; it is a strategic step toward future-proofing with improvements in design flexibility, performance, and user-centric workflows.
- They argue that innovation is not just about following trends but about finding the right direction and expanding possibilities in a way that aligns with their vision.
- Avada 8 will likely be a transitional upgrade that improves block compatibility but may not be a complete block theme conversion.
Overall Implications:
Avada remains a popular theme, but there is growing demand for a transition to block themes in line with the evolving WordPress ecosystem. However, ThemeFusion prioritizes its established ecosystem and gradual changes, making a full transition to block themes unlikely in the near future. This highlights one of the challenges in moving from classic themes to block themes.
Citations:
[1] Avada Theme Review[2] Avada Review Response
poena 수요일 오전 2:10
I don’t understand. Are you asking a question?
Every theme author / brand / company/ is of course free to make the decision that is best for them.
Jiwoon Kim 수요일 오전 3:14
Yes, of course. And all consumers have the freedom to choose or make suggestions. The problem is that there is an unequal relationship here. They want to be quickly reflected in the latest technologies and secure future competitiveness, and they don’t want to be behind the times. 1. Maintaining a classical theme-based website builder itself is a disadvantageous structure for scalability and standardization. 2. A closed design system is inevitably bound to limit scalability. There are people who suffer in the absence of substitutes
The summary of the message may contain detailed context. If you would like to know more about the conversation, please refer to the link. Chrome and edge have their own built-in translation.
poena 수요일 오전 3:20
I still don’t understand the purpose of this text. What is the exact point you want to discuss?
Are you asking for theme developers opinion about if Avada should be turned into a block theme?
Are you looking for answers about if you should develop classic themes or block themes?
Jiwoon Kim 수요일 오전 3:34
I’m sick of working with Avada, but I have no choice. I don’t have the ability to develop a new theme from scratch, I don’t have the time, and there isn’t a suitable replacement among the block themes. If anything, the moment a truly powerful block theme emerges, the paradigm of the WordPress ecosystem will shift in no time.
I’m frustrated, stuck in a situation where I’m wasting time without making any real improvements.
imjlk 수요일 오후 7:17
Referred link is not detailed, and i think jetpack, material design system, and activity pub are not related with theme. It’s probably a little bit related, but it seems unproper to compare it to FSE
Jiwoon Kim 수요일 오후 9:14
Yes, that’s why I found it difficult to categorize the discussion into a specific channel.
I’m particularly interested in how to implement Material Design’s HCT color space, dynamic color, light/dark color scheme switching, typography, and components within an FSE (Full Site Editing) block theme. Additionally, I’m curious about how these color, typography, and style guides could be automatically applied to elements like the Jetpack like/share button block, comment form, and Fediverse following block.
Furthermore, I want to explore the mechanism for implementing a top-app bar (or header) as a side-to-top responsive header within FSE.
I also wonder whether it would be appropriate to officially integrate Google’s design system into the WordPress system.
Lastly, regarding Fediverse-related topics, I’m curious about the possibility of extending Friends’ frontend layouts so that they can be controlled through FSE.
These are the key points I’d like to discuss collectively.
I’m particularly interested in whether it’s possible to fully integrate the Posts Page and Author Page into a Fediverse profile/feed within WordPress.
Additionally, I’d like to know if external Fediverse server profiles can be automatically generated as virtual users or remote user feed pages within WordPress.
Another key point I’m curious about is whether Fediverse replies in the Comments Block can support hovering interactions, similar to the Gravatar Hovercard format.
I believe this is something that is absolutely impossible to implement with a classic theme.
poena 수요일 오후 10:30
Blocks from plugins like Jetpack and many others can be style with the global styles system: But only if that block has been built to support it. It is up to the block developers. All we can do as users is request those features.
WordPress has its own design system. I have personally not seen any discussions about replacing it with Google’s design system.
Themes and plugins do not need to follow this design system. They can use their own.
Changes to the blocks that are included in WordPress are managed in the Gutenberg GitHub repository.
What you are asking for can not be added to a block theme without advanced coding knowledge, by filtering the block output.
The blocks do not use “material design components”. It would be easier to respond if you could explain what type of components you are missing.
Jiwoon Kim 오후 10:17
Now that I think about it, I haven’t actually talked about these ideas in such detail before. Thanks to this discussion, I was able to explain them more thoroughly. I appreciate it!
I believe a side-to-top responsive header is necessary because mobile devices primarily use a vertical layout, whereas desktop monitors use a horizontal layout. This approach improves viewport utilization and enhances user experience. Examples of this can already be seen in Slack, the WordPress backend, Edge browser’s vertical tabs, and Material.io’s desktop layout.
Is there any plan to renew Twenty Fifteen and Twenty Fourteen as FSE themes?
By adopting HCT color space, WordPress core could natively support light/dark color scheme switching and allow users to cache personalized colors directly on the frontend. Since Material Design for WordPress already exists, is it really necessary to develop a color space from scratch?
Personally, I’m curious why that project was put on hold during the FSE transition beta phase. Most likely, it was due to budget constraints and the limitations of the block editor at the time. Theme policy may have also played a role since it required a plugin.
Honestly, there are already powerful block theme resources available, and with minor modifications, they could be fully utilized. It seems like a waste to let them sit unused.
I’m a bit concerned that I might be sharing too many personal thoughts in a public space. However, I needed a place to express my ideas because I’ve felt certain design limitations. I also hoped that someone would review and consider them.
Anyway… by now, you probably understand why I once said, “I’m sick of working with Avada.”
I do think Avada is a well-made theme, and to some extent, I’ve been able to implement my intended designs with it. However, despite strongly advocating for the necessity of transitioning to a block theme—and emphasizing how much those key aspects will shape the future of WordPress—I’ve always been met with disappointing responses.
Ultimately, the kind of design I aim for requires large-scale groundwork and collaboration across multiple teams to be fully realized as a powerful block theme. This isn’t something that can be attempted from scratch with just personal capital or connections.
Given that reality, there’s not much else I can do but place my hopes here in Slack.
That’s all.
poena 어제 오후 6:11
I don’t even know what a side-to-top header is :)
Jiwoon Kim 어제 오후 9:32
Examples of Side-to-Top Headers
🔗 Vite Documentation:
https://ko.vite.dev/guide/#VPContent
This is the most ideal example of what I refer to as a side header.
Try enabling F12 → Device Emulation on a desktop browser to see how it adapts.
Other Notable Examples
1️⃣ Fediverse UI Examples:
2️⃣ Google Fonts:
- Google Fonts
- The side header transitions to a bottom header on mobile.
3️⃣ Material Design Guidelines:
- Material 3 (M3)
- Material Theming
- These can also be considered as side header implementations in a design system.
Fediverse Implementations
Misskey serves as an excellent reference for implementing side headers in WordPress’s ActivityPub layout:
WordPress Implementations
Some Block Themes in WordPress include side headers:
Some Classic Themes that use side headers:
Avada’s Use of Side Headers
The reason I started using the term Side-to-Top Header comes from Avada’s documentation:
Some prebuilt Avada websites showcase good examples of side headers:
However, after installing and analyzing the structure myself, I found it to be poorly designed under the hood.
While it may look clean on the surface, the implementation is not elegant because it does not utilize templates and patterns in the way FSE block themes do.
A Full Site Editing (FSE) block theme would provide a much cleaner and more aesthetically pleasing approach to achieving the same layout.
Additionally, several issues exist in Avada’s layout:
- Edge Browser (Mobile App): Layout problems
- Jetpack App (Desktop View): Post page rendering logic issues
- These appear to be core flaws in Avada that have yet to be resolved.
