-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Font Library: Add documentation for Font Collections #57980
Comments
Thanks for this! I added a short section at the end that explains installing and activating fonts. |
@matiasbenedetto is the Google Fonts collection the only default collection that will likely be targeted and available for 6.5 release? Just curious. |
@colorful-tones 👋 As far as I know, there only was one proposal around adding another font collection with system fonts, but it hasn't had much traction: #54186. It would be nice to add it, though. |
I still wanna test this all out to see it in action. I might give it a spin tomorrow, but will likely get pushed to Monday. Curious, @matiasbenedetto is there any design or consideration on what might happen to the tabbed UI if there were to be several collections registered? I’m probably jumping ahead and mostly curious. 😃 |
@colorful-tones I'm not aware of mockups featuring a large number of font collections registered. It might be useful to count with a design exploration about that. |
Based on the recent Editor Triage async session - I'm moving this into the Punted to 6.6 column on the WordPress 6.5 Editor Tasks board. |
@colorful-tones 👋 This issue is about explaining/documenting the font collections functionality, which is part of the font library introduced in 6.5. Why it is being moved to the 'Punted to 6.6' column? |
Good to know @matiasbenedetto, and apologize for missing this additional context. I'm curious, are there any pull requests associated with the work here? From the sounds of it, it seems this work is decided and likely already introduced. This is based on the fact that we're already "documenting the font collections." 🤔 Is this In Progress, Needs Decision, or other? Once we land on solidifying the status then I'm happy to triage. |
I think it can be considered in-progress in this PR around adding docs: |
I'm wondering if this issue should be closed. As far as I'm aware, the documentation is being handled as part of the dev note and as part of the automated API docs at WP-API/docs#174. |
@mikachan I want to echo that I remain skeptical that font-stack management should happen in this modal, I'd appreciate some consideration on having that interface live in the inspector instead, as discussed here: #54186 (comment) |
Thanks for highlighting that, @jasmussen. My question above was more because this current issue is listed on the 6.5 board and seems to only be related to documentation. I'm happy to explore moving the font-stack management to the inspector. Do you think this needs to happen for the 6.5 release? |
I think it can happen at any time, I'm mostly concerned that APIs are targetting the assumption that this will live in the modal. |
Thanks for the comment, but this is unrelated to the issue regarding the font collections. The comment linked features a UI to edit font stacks, a functionality different from the font collections. I have some thoughts about it, but I will add them in: #54186 |
I'll close this issue as it's related to docs, and we can continue the conversation about the font stacks implementation over in #54186. |
This is an issue to describe this proposal, part of the Font Library feature proposed to merge in WordPress core 6.5
What is a Font Collection?
A Font Collection is a list of font family definitions ready to be installed by the user. The font family definition is a fontFamily item in
theme.json
format.What is its purpose?
The font collections are presented to the users in the editor so one can choose whether to install a font family to their WordPress site.
How it works?
The only responsibility of a font collection is to present a list of font families in a correct format. Font collections are not in charge of installing the fonts; they just list a group of font families so users can choose the one they want to install. If the font family includes font faces, those font faces should have links to bundled (e.g: in a plugin assets) or external (e.g: from a CDN) font assets that will be downloaded or linked when the font family is installed.
How it looks in the UI?
How can extenders add a new Font Collection?
A new font collection can be added by registering a font collection with PHP and a JSON file or just with PHP.
Example: register a font collection with PHP:
Example: register a font collection with PHP and a JSON file.
my-collection.json
file example:How can extenders remove a Font Collection?
The slug of the font collection is used to unregister a font collection.
This is an example to unregister the collection registered by default:
Font Collection REST API
The font collections functionality only requires 2 enddpoints:
GET wp/v2/font-collections
andGET wp/v2/font-collections/<slug>
. They are described below. If you want to know the complete font library proposed API specs refer to this issue: #57616GET wp/v2/font-collections
List font collections
Request:
GET wp/v2/font-collections
Response:
GET wp/v2/font-collections/
<slug>
Get font collection by slug.
Request:
GET wp/v2/font-collections/collection-example
Response:
Using fonts from a collection
Using fonts from a collection has 2 steps:
1. Installing
The Font Library UI enables browsing registered font collections, and choosing fonts from the collection to install to the site. When fonts are installed:
wp_font_family
post type).wp_font_face
post type).wp-content/fonts
by default) and thesrc
property of the font face changed to point to the downloaded file. This behavior can be configured to use the font assets directly from remote urls instead, if the collection allows that.2. Activating
The user can activate any installed font for the current theme. This is done by saving the font family and child font face definitions into Global Styles typography settings for the theme. This makes the font available in the typography options for Global Styles and blocks.
The text was updated successfully, but these errors were encountered: