diff --git a/src/gui/qgslabelinggui.cpp b/src/gui/qgslabelinggui.cpp
index dc1d351e8ad9..3c51226dcfa8 100644
--- a/src/gui/qgslabelinggui.cpp
+++ b/src/gui/qgslabelinggui.cpp
@@ -142,6 +142,7 @@ QgsLabelingGui::QgsLabelingGui( QgsVectorLayer *layer, QgsMapCanvas *mapCanvas,
   connect( mBufferDrawChkBx, &QAbstractButton::toggled, this, &QgsLabelingGui::updateUi );
   connect( mShapeDrawChkBx, &QAbstractButton::toggled, this, &QgsLabelingGui::updateUi );
   connect( mShadowDrawChkBx, &QAbstractButton::toggled, this, &QgsLabelingGui::updateUi );
+  connect( mCalloutsDrawCheckBox, &QAbstractButton::toggled, this, &QgsLabelingGui::updateUi );
   connect( mDirectSymbChkBx, &QAbstractButton::toggled, this, &QgsLabelingGui::updateUi );
   connect( mFormatNumChkBx, &QAbstractButton::toggled, this, &QgsLabelingGui::updateUi );
   connect( mScaleBasedVisibilityChkBx, &QAbstractButton::toggled, this, &QgsLabelingGui::updateUi );
@@ -580,6 +581,7 @@ void QgsLabelingGui::updateUi()
   syncDefinedCheckboxFrame( mBufferDrawDDBtn, mBufferDrawChkBx, mBufferFrame );
   syncDefinedCheckboxFrame( mShapeDrawDDBtn, mShapeDrawChkBx, mShapeFrame );
   syncDefinedCheckboxFrame( mShadowDrawDDBtn, mShadowDrawChkBx, mShadowFrame );
+  syncDefinedCheckboxFrame( mCalloutDrawDDBtn, mCalloutsDrawCheckBox, mCalloutFrame );
 
   syncDefinedCheckboxFrame( mDirectSymbDDBtn, mDirectSymbChkBx, mDirectSymbFrame );
   syncDefinedCheckboxFrame( mFormatNumDDBtn, mFormatNumChkBx, mFormatNumFrame );
diff --git a/src/gui/qgstextformatwidget.cpp b/src/gui/qgstextformatwidget.cpp
index eb28e6c5a42f..9c54ff2882e6 100644
--- a/src/gui/qgstextformatwidget.cpp
+++ b/src/gui/qgstextformatwidget.cpp
@@ -487,6 +487,11 @@ void QgsTextFormatWidget::initWidget()
   {
     updateShadowFrameStatus();
   } );
+  connect( mCalloutDrawDDBtn, &QgsPropertyOverrideButton::activated, this, &QgsTextFormatWidget::updateCalloutFrameStatus );
+  connect( mCalloutsDrawCheckBox, &QCheckBox::stateChanged, this, [ = ]( int )
+  {
+    updateCalloutFrameStatus();
+  } );
 
   mGeometryGeneratorType->addItem( QgsApplication::getThemeIcon( QStringLiteral( "/mIconPolygonLayer.svg" ) ), tr( "Polygon / MultiPolygon" ), QgsWkbTypes::GeometryType::PolygonGeometry );
   mGeometryGeneratorType->addItem( QgsApplication::getThemeIcon( QStringLiteral( "/mIconLineLayer.svg" ) ), tr( "LineString / MultiLineString" ), QgsWkbTypes::GeometryType::LineGeometry );
@@ -784,6 +789,8 @@ void QgsTextFormatWidget::populateDataDefinedButtons()
   registerDataDefinedButton( mZIndexDDBtn, QgsPalLayerSettings::ZIndex );
 
   registerDataDefinedButton( mCalloutDrawDDBtn, QgsPalLayerSettings::CalloutDraw );
+  mCalloutDrawDDBtn->registerCheckedWidget( mCalloutsDrawCheckBox );
+
   registerDataDefinedButton( mLabelAllPartsDDBtn, QgsPalLayerSettings::LabelAllParts );
 }
 
@@ -1678,6 +1685,11 @@ void QgsTextFormatWidget::updateShadowFrameStatus()
   mShadowFrame->setEnabled( mShadowDrawDDBtn->isActive() || mShadowDrawChkBx->isChecked() );
 }
 
+void QgsTextFormatWidget::updateCalloutFrameStatus()
+{
+  mCalloutFrame->setEnabled( mCalloutDrawDDBtn->isActive() || mCalloutsDrawCheckBox->isChecked() );
+}
+
 void QgsTextFormatWidget::setFormatFromStyle( const QString &name, QgsStyle::StyleEntity type )
 {
   switch ( type )
diff --git a/src/gui/qgstextformatwidget.h b/src/gui/qgstextformatwidget.h
index a095f985c1fe..6015cc9b7666 100644
--- a/src/gui/qgstextformatwidget.h
+++ b/src/gui/qgstextformatwidget.h
@@ -300,6 +300,7 @@ class GUI_EXPORT QgsTextFormatWidget : public QWidget, public QgsExpressionConte
     void updateShapeFrameStatus();
     void updateBufferFrameStatus();
     void updateShadowFrameStatus();
+    void updateCalloutFrameStatus();
 };
 
 
diff --git a/src/ui/qgstextformatwidgetbase.ui b/src/ui/qgstextformatwidgetbase.ui
index b49c53ccaa71..4752ffd16bcf 100644
--- a/src/ui/qgstextformatwidgetbase.ui
+++ b/src/ui/qgstextformatwidgetbase.ui
@@ -112,7 +112,7 @@
               <rect>
                <x>0</x>
                <y>0</y>
-               <width>807</width>
+               <width>806</width>
                <height>300</height>
               </rect>
              </property>
@@ -615,7 +615,7 @@
               <item>
                <widget class="QStackedWidget" name="mLabelStackedWidget">
                 <property name="currentIndex">
-                 <number>6</number>
+                 <number>5</number>
                 </property>
                 <widget class="QWidget" name="mLabelPage_Text">
                  <layout class="QVBoxLayout" name="verticalLayout_6">
@@ -644,8 +644,8 @@
                       <rect>
                        <x>0</x>
                        <y>0</y>
-                       <width>775</width>
-                       <height>405</height>
+                       <width>781</width>
+                       <height>395</height>
                       </rect>
                      </property>
                      <layout class="QVBoxLayout" name="verticalLayout_2" stretch="0,1">
@@ -1227,8 +1227,8 @@ font-style: italic;</string>
                       <rect>
                        <x>0</x>
                        <y>0</y>
-                       <width>758</width>
-                       <height>509</height>
+                       <width>767</width>
+                       <height>624</height>
                       </rect>
                      </property>
                      <layout class="QGridLayout" name="gridLayout_42">
@@ -2126,8 +2126,8 @@ font-style: italic;</string>
                       <rect>
                        <x>0</x>
                        <y>0</y>
-                       <width>775</width>
-                       <height>405</height>
+                       <width>781</width>
+                       <height>395</height>
                       </rect>
                      </property>
                      <layout class="QVBoxLayout" name="verticalLayout_12">
@@ -2472,8 +2472,8 @@ font-style: italic;</string>
                       <rect>
                        <x>0</x>
                        <y>0</y>
-                       <width>758</width>
-                       <height>633</height>
+                       <width>767</width>
+                       <height>696</height>
                       </rect>
                      </property>
                      <layout class="QVBoxLayout" name="verticalLayout_21">
@@ -3233,8 +3233,8 @@ font-style: italic;</string>
                       <rect>
                        <x>0</x>
                        <y>0</y>
-                       <width>775</width>
-                       <height>405</height>
+                       <width>767</width>
+                       <height>406</height>
                       </rect>
                      </property>
                      <layout class="QVBoxLayout" name="verticalLayout_22">
@@ -3661,8 +3661,8 @@ font-style: italic;</string>
                       <rect>
                        <x>0</x>
                        <y>0</y>
-                       <width>775</width>
-                       <height>405</height>
+                       <width>781</width>
+                       <height>395</height>
                       </rect>
                      </property>
                      <layout class="QGridLayout" name="gridLayout_46">
@@ -3694,47 +3694,6 @@ font-style: italic;</string>
                           </property>
                          </widget>
                         </item>
-                        <item row="2" column="0" colspan="3">
-                         <layout class="QGridLayout" name="gridLayout_45" columnstretch="0,0,0">
-                          <property name="leftMargin">
-                           <number>20</number>
-                          </property>
-                          <property name="topMargin">
-                           <number>0</number>
-                          </property>
-                          <item row="0" column="1" colspan="2">
-                           <widget class="QComboBox" name="mCalloutStyleComboBox"/>
-                          </item>
-                          <item row="0" column="0">
-                           <widget class="QLabel" name="label_11">
-                            <property name="text">
-                             <string>Style</string>
-                            </property>
-                           </widget>
-                          </item>
-                          <item row="1" column="0" colspan="3">
-                           <widget class="QStackedWidget" name="mCalloutStackedWidget">
-                            <widget class="QWidget" name="pageDummy">
-                             <layout class="QVBoxLayout" name="verticalLayout_19">
-                              <item>
-                               <widget class="QLabel" name="label_45">
-                                <property name="text">
-                                 <string>This callout type doesn't have any editable properties</string>
-                                </property>
-                                <property name="alignment">
-                                 <set>Qt::AlignCenter</set>
-                                </property>
-                                <property name="wordWrap">
-                                 <bool>true</bool>
-                                </property>
-                               </widget>
-                              </item>
-                             </layout>
-                            </widget>
-                           </widget>
-                          </item>
-                         </layout>
-                        </item>
                         <item row="1" column="0">
                          <widget class="QCheckBox" name="mCalloutsDrawCheckBox">
                           <property name="sizePolicy">
@@ -3761,6 +3720,49 @@ font-style: italic;</string>
                           </property>
                          </spacer>
                         </item>
+                        <item row="2" column="0" colspan="3">
+                         <widget class="QFrame" name="mCalloutFrame">
+                          <layout class="QGridLayout" name="gridLayout_45" columnstretch="0,0,0">
+                           <property name="leftMargin">
+                            <number>20</number>
+                           </property>
+                           <property name="topMargin">
+                            <number>1</number>
+                           </property>
+                           <item row="0" column="1" colspan="2">
+                            <widget class="QComboBox" name="mCalloutStyleComboBox"/>
+                           </item>
+                           <item row="0" column="0">
+                            <widget class="QLabel" name="label_11">
+                             <property name="text">
+                              <string>Style</string>
+                             </property>
+                            </widget>
+                           </item>
+                           <item row="1" column="0" colspan="3">
+                            <widget class="QStackedWidget" name="mCalloutStackedWidget">
+                             <widget class="QWidget" name="pageDummy">
+                              <layout class="QVBoxLayout" name="verticalLayout_19">
+                               <item>
+                                <widget class="QLabel" name="label_45">
+                                 <property name="text">
+                                  <string>This callout type doesn't have any editable properties</string>
+                                 </property>
+                                 <property name="alignment">
+                                  <set>Qt::AlignCenter</set>
+                                 </property>
+                                 <property name="wordWrap">
+                                  <bool>true</bool>
+                                 </property>
+                                </widget>
+                               </item>
+                              </layout>
+                             </widget>
+                            </widget>
+                           </item>
+                          </layout>
+                         </widget>
+                        </item>
                        </layout>
                       </item>
                      </layout>
@@ -3808,9 +3810,9 @@ font-style: italic;</string>
                      <property name="geometry">
                       <rect>
                        <x>0</x>
-                       <y>-263</y>
-                       <width>758</width>
-                       <height>932</height>
+                       <y>0</y>
+                       <width>767</width>
+                       <height>1035</height>
                       </rect>
                      </property>
                      <layout class="QVBoxLayout" name="verticalLayout_11">
@@ -5584,8 +5586,8 @@ font-style: italic;</string>
                       <rect>
                        <x>0</x>
                        <y>0</y>
-                       <width>758</width>
-                       <height>674</height>
+                       <width>767</width>
+                       <height>757</height>
                       </rect>
                      </property>
                      <layout class="QVBoxLayout" name="verticalLayout_8">