custom font size presets does not work

Created on 14 March 2023, over 2 years ago
Updated 21 May 2024, about 1 year ago

I followed this doc:
https://www.drupal.org/docs/8/modules/gutenberg/creating-custom-font-siz... β†’

But it did not work, it shows the default fonts. I tested on a paragraph block.

πŸ› Bug report
Status

Closed: works as designed

Version

2.0

Component

Code

Created by

πŸ‡ΊπŸ‡ΈUnited States rpayanm

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

  • Issue created by @rpayanm
  • πŸ‡ΊπŸ‡ΈUnited States j_s

    I'm also unable to get font sizes to work with the provided instructions. It just shows the default set of font size options.

  • πŸ‡΅πŸ‡ΉPortugal marcofernandes

    It should work. But for versions >= 2.6, these settings were deprecated and font sizes should be set at the following section:

    - theme-support
      - __experimentalFeatures
      - typography
      - fontSizes
        - theme
          - name: ...
    

    We need to update the documentation.
    Anyway, make sure the configuration is at the theme folder and it's called [theme-name].gutenberg.yml. The theme must be active.

  • πŸ‡ΊπŸ‡ΈUnited States j_s

    I have a custom theme for the front-end but use Claro for admin theme.

    In mytheme.gutenberg.yml I tried using your syntax:

    - theme-support:
      - __experimentalFeatures:
        - typography:
          - fontSizes:
            - theme:
              - name: "Small"
                slug: "small"
                size: 14
              - name: "Lead"
                slug: "lead"
                size: 20
              - name: "Display 1"
                slug: "display-1"
                size: 96
              - name: "Display 2"
                slug: "display-2"
                size: 88
              - name: "Display 3"
                slug: "display-3"
                size: 72
              - name: "Display 4"
                slug: "display-4"
                size: 56

    That didn't seem to work, so I tried without the hyphens:

    theme-support:
      __experimentalFeatures:
        typography:
          fontSizes:
            theme:
              - name: "Small"
                slug: "small"
                size: 14
              - name: "Lead"
                slug: "lead"
                size: 20
              - name: "Display 1"
                slug: "display-1"
                size: 96
              - name: "Display 2"
                slug: "display-2"
                size: 88
              - name: "Display 3"
                slug: "display-3"
                size: 72
              - name: "Display 4"
                slug: "display-4"
                size: 56

    That worked and I can see a dropdown of my specified font sizes.

    I was also able to get custom colors in like this:

    theme-support:
      __experimentalFeatures:
        color:
          background: true
          button: true
          caption: true
          defaultDuotone: false
          defaultGradients: false
          text: true
          defaultPalette: false
          heading: true
          link: true
          palette:
            theme:
              - slug: "blue"
                name: "Blue"
                color: "#0000FF"
              - slug: "red"
                name: "Red"
                color: "#CC0000"

    Thanks!

  • Status changed to Closed: works as designed about 1 year ago
  • πŸ‡΅πŸ‡ΉPortugal marcofernandes

    Oh.. I put the hyphens for better readability but now I see it just added confusion. Sorry about that. Anyway, I'm glad it work.

  • Pipeline finished with Success
    about 1 year ago
    Total: 217s
    #190175
  • Pipeline finished with Success
    about 1 year ago
    Total: 301s
    #206694
  • Pipeline finished with Skipped
    12 months ago
    #221136
  • Pipeline finished with Success
    11 months ago
    #239769
  • Pipeline finished with Success
    11 months ago
    Total: 310s
    #239770
  • Pipeline finished with Running
    11 months ago
    #246784
  • Pipeline finished with Failed
    11 months ago
    Total: 129s
    #246787
  • Pipeline finished with Success
    11 months ago
    #246816
  • Pipeline finished with Success
    11 months ago
    #246820
  • Pipeline finished with Success
    10 months ago
    Total: 685s
    #264366
  • Pipeline finished with Failed
    9 months ago
    Total: 169s
    #298681
  • Pipeline finished with Canceled
    9 months ago
    Total: 83s
    #298688
  • Pipeline finished with Failed
    9 months ago
    Total: 188s
    #298690
  • Pipeline finished with Failed
    9 months ago
    Total: 223s
    #298695
  • Pipeline finished with Failed
    9 months ago
    Total: 182s
    #298699
  • Pipeline finished with Success
    9 months ago
    Total: 205s
    #298714
  • Pipeline finished with Success
    9 months ago
    Total: 189s
    #298878
  • Pipeline finished with Success
    9 months ago
    #313008
  • Pipeline finished with Success
    8 months ago
    Total: 182s
    #316826
  • Pipeline finished with Success
    8 months ago
    Total: 137s
    #344474
  • Pipeline finished with Canceled
    8 months ago
    Total: 90s
    #344493
  • Pipeline finished with Success
    8 months ago
    Total: 142s
    #344495
  • Pipeline finished with Success
    8 months ago
    Total: 140s
    #344557
  • Pipeline finished with Success
    8 months ago
    Total: 140s
    #344559
  • Pipeline finished with Canceled
    7 months ago
    Total: 83s
    #346377
  • Pipeline finished with Success
    7 months ago
    Total: 141s
    #346379
  • Pipeline finished with Success
    7 months ago
    Total: 158s
    #346383
  • Pipeline finished with Success
    7 months ago
    Total: 137s
    #346403
  • Pipeline finished with Success
    7 months ago
    Total: 140s
    #346428
  • Pipeline finished with Success
    7 months ago
    Total: 146s
    #349858
  • Pipeline finished with Success
    7 months ago
    Total: 174s
    #349866
  • Pipeline finished with Success
    7 months ago
    Total: 314s
    #351096
  • Pipeline finished with Failed
    7 months ago
    #351637
  • Pipeline finished with Failed
    7 months ago
    Total: 157s
    #351647
  • Pipeline finished with Failed
    7 months ago
    Total: 332s
    #351702
  • Pipeline finished with Failed
    7 months ago
    Total: 224s
    #351718
  • Pipeline finished with Success
    7 months ago
    Total: 166s
    #351951
  • Pipeline finished with Success
    7 months ago
    Total: 196s
    #351986
  • Pipeline finished with Success
    7 months ago
    Total: 166s
    #352736
  • Pipeline finished with Success
    7 months ago
    Total: 198s
    #352738
  • Pipeline finished with Success
    7 months ago
    Total: 210s
    #359544
  • Pipeline finished with Success
    7 months ago
    Total: 443s
    #360538
  • Pipeline finished with Success
    7 months ago
    Total: 141s
    #360679
  • Pipeline finished with Success
    7 months ago
    Total: 133s
    #360685
  • Pipeline finished with Success
    7 months ago
    Total: 265s
    #361629
  • Pipeline finished with Failed
    7 months ago
    Total: 529s
    #365547
  • Pipeline finished with Failed
    7 months ago
    Total: 507s
    #371141
  • Pipeline finished with Success
    7 months ago
    Total: 221s
    #373770
  • Pipeline finished with Success
    6 months ago
    Total: 221s
    #380360
  • Pipeline finished with Success
    6 months ago
    Total: 227s
    #382116
  • Pipeline finished with Success
    6 months ago
    Total: 298s
    #382119
  • Pipeline finished with Success
    6 months ago
    Total: 342s
    #382160
  • Pipeline finished with Success
    6 months ago
    Total: 200s
    #382162
  • Pipeline finished with Success
    6 months ago
    Total: 210s
    #389154
  • Pipeline finished with Success
    5 months ago
    Total: 270s
    #405271
  • Pipeline finished with Canceled
    5 months ago
    Total: 465s
    #425786
  • Pipeline finished with Failed
    5 months ago
    Total: 177s
    #425790
  • Pipeline finished with Canceled
    5 months ago
    Total: 77s
    #425793
  • Pipeline finished with Canceled
    5 months ago
    Total: 309s
    #425797
  • Pipeline finished with Success
    5 months ago
    Total: 615s
    #425800
  • Pipeline finished with Success
    5 months ago
    Total: 270s
    #426640
  • Pipeline finished with Success
    5 months ago
    Total: 265s
    #426657
  • Pipeline finished with Success
    5 months ago
    Total: 263s
    #427408
  • Pipeline finished with Skipped
    4 months ago
    #436998
  • Pipeline finished with Skipped
    4 months ago
    #442320
  • Pipeline finished with Success
    4 months ago
    Total: 468s
    #453399
  • Pipeline finished with Success
    3 months ago
    Total: 171s
    #460166
  • Pipeline finished with Success
    3 months ago
    Total: 204s
    #465922
  • Pipeline finished with Success
    3 months ago
    Total: 319s
    #471254
  • Pipeline finished with Success
    2 months ago
    Total: 298s
    #486327
  • Pipeline finished with Failed
    about 2 months ago
    Total: 164s
    #498096
  • Pipeline finished with Failed
    about 2 months ago
    Total: 157s
    #498153
  • Pipeline finished with Failed
    about 2 months ago
    Total: 159s
    #498228
  • Pipeline finished with Failed
    about 2 months ago
    Total: 163s
    #498766
  • Pipeline finished with Success
    about 2 months ago
    Total: 392s
    #499171
  • Pipeline finished with Failed
    about 1 month ago
    Total: 159s
    #501747
  • Pipeline finished with Failed
    about 1 month ago
    Total: 279s
    #501963
  • Pipeline finished with Success
    about 1 month ago
    Total: 180s
    #502126
  • Pipeline finished with Failed
    about 1 month ago
    Total: 175s
    #502857
  • Pipeline finished with Failed
    about 1 month ago
    Total: 406s
    #503121
  • Pipeline finished with Failed
    about 1 month ago
    Total: 156s
    #503206
  • Pipeline finished with Failed
    about 1 month ago
    Total: 150s
    #506642
  • Pipeline finished with Failed
    about 1 month ago
    Total: 165s
    #506645
  • Pipeline finished with Failed
    about 1 month ago
    Total: 181s
    #506879
  • Pipeline finished with Failed
    about 1 month ago
    Total: 249s
    #507223
  • Pipeline finished with Failed
    about 1 month ago
    Total: 166s
    #507260
  • Pipeline finished with Failed
    about 1 month ago
    Total: 170s
    #507430
  • Pipeline finished with Failed
    about 1 month ago
    #507721
  • Pipeline finished with Failed
    about 1 month ago
    Total: 302s
    #508096
  • Pipeline finished with Failed
    about 1 month ago
    Total: 310s
    #508386
  • Pipeline finished with Failed
    about 1 month ago
    Total: 237s
    #508434
  • Pipeline finished with Failed
    about 1 month ago
    Total: 470s
    #509569
  • Pipeline finished with Success
    about 1 month ago
    #509593
  • Pipeline finished with Failed
    about 1 month ago
    Total: 286s
    #510349
  • Pipeline finished with Failed
    about 1 month ago
    Total: 159s
    #512008
  • Pipeline finished with Failed
    about 1 month ago
    Total: 220s
    #512998
  • Pipeline finished with Success
    29 days ago
    Total: 176s
    #514243
  • Pipeline finished with Canceled
    29 days ago
    Total: 96s
    #514244
  • Pipeline finished with Success
    29 days ago
    Total: 153s
    #514250
  • Pipeline finished with Success
    21 days ago
    Total: 152s
    #520760
Production build 0.71.5 2024