Display custom text

Before starting, it would be helpful if you have your ttf file ready. Put it in your fonts folder.

itim:
  file: itim.ttf #Optional. defines your ttf location.
  scale: 16 #Rendering scale. The greater that value, The bigger resource pack size.

First, you have to define your text in your texts folder.

health_bar:
  images:
    1:
      name: empty_bar
    2:
      name: health_bar
      x: 6 #6 to pixel right
      y: 4 #4 to pixel down
  texts:
    1:
      name: itim
      pattern: "[health] // [max_health]" #[value] -> Placeholder
      number-format: "#,###" #number format
      outline: true #whether to outline
      layer: 1 #layer number
      color: green #text color
      scale: 0.5
      x: 10
      align: left

food_bar:
  y: 15 #15 to pixel down
  images:
    1:
      name: empty_bar
    2:
      name: food_bar
      x: 6 #6 to pixel right
      y: 4 #4 to pixel down
  texts:
    1:
      name: itim
      pattern: "[food] // 20"
      number-format: "#,###"
      outline: true
      layer: 1
      color: green
      scale: 0.5
      x: 10
      align: left

mana_bar:
  y: 30 #15 to pixel down
  images:
    1:
      name: empty_bar
    2:
      name: mana_bar
      x: 6 #6 to pixel right
      y: 4 #4 to pixel down
  texts:
    1:
      name: itim
      pattern: "[mmocore_mana] // [mmocore_max_mana]"
      number-format: "#,###"
      outline: true
      layer: 1
      color: green
      scale: 0.5
      x: 10
      align: left

stamina_bar:
  y: 45 #15 to pixel down
  images:
    1:
      name: empty_bar
    2:
      name: stamina_bar
      x: 6 #6 to pixel right
      y: 4 #4 to pixel down
  texts:
    1:
      name: itim
      pattern: "[mmocore_stamina] // [mmocore_max_stamina]"
      number-format: "#,###"
      outline: true
      layer: 1
      color: green
      scale: 0.5
      x: 10
      align: left

Second, marge the text in your layout by following this.

Success!