Add a subtitle under a widget title

Hey Ariel! CSS can hide elements that are in the HTML, but it typically can’t inject new elements on its own. Since that’s a built-in widget and you can’t edit the HTML, I don’t think you would be able to add a subtitle to the actual widget.

Two options come to mind:

• Submit the idea of a subtitle to the Ideas Portal
• One trick that we sometimes use in DU is to build an HTML widget “hat” for some of our live widgets. To do this, you basically build an HTML widget with the text you want, then a live widget below it. If you give them both the same background color and set the top/bottom margin of one of the widgets to a negative number it’ll pull the lower widget up so that they look like they’re one block of info.
  
  Ex of what this looks like in the platform:

  

  
  The backend page editor view: 

  

  
  Rough CSS below. Note that you’ll have to replace some of these with the specific doc-page number and widget number for your page + widget. (You can find these using the inspect tool in the browser – let us know if you need more info!)

  #[REPLACE with doc page number ID] #[REPLACE with **PREBUILT LIVE** widget ID]{
      background-color: #7E2EE9;
      max-width: 1248px;
      margin-left: auto;
      margin-right: auto;
      padding: 100px 24px 24px 24px;
      border-radius: 16px;
      margin-top: -130px;
      z-index: 0;
  }
  
  #[REPLACE with doc page number ID] #[REPLACE with **HTML** widget ID]{
    z-index: 5;
  }

  
  Ex of what the live CSS might look like:

  #doc-page-212 #doc-widget-3027{
      background-color: #7E2EE9;
      max-width: 1248px;
      margin-left: auto;
      margin-right: auto;
      padding: 100px 24px 24px 24px;
      border-radius: 16px;
      margin-top: -130px;
      z-index: 0;
  }
  
  #doc-page-212 #doc-widget-3026{
    z-index: 5;
  }

  
  Feel free to ping me if you try that out and run into any questions!