DivIcon

https://leafletjs.com/reference.html#divicon

Map

Shortcode

[leaflet-map lat=0 lng=-0.1 zoom=10 height=200]
[leafext-divicon lat=0 lng=-0.1 text="This is a text." width=100 height=50 classname=leaflet-div-icon2]
[leaflet-marker lat=0 lng=-0.1]Default Marker[/leaflet-marker]

The leaflet-marker is for demonstration only.

Code

Define a style (Example from https://www.drupal.org/node/2554137):

.leaflet-div-icon2
{
  background:red;
  border:5px solid rgba(255,255,255,0.5);
  color:blue;
  font-weight:bold;
  text-align:center;
  border-radius:50%;
  line-height:30px;
}

Use e.g. WPCode and configure this as a PHP snippet in Frontend only.

<?php
function leafext_divicon_script($atts) {
  $text = '
  <script>
  window.WPLeafletMapPlugin = window.WPLeafletMapPlugin || [];
  window.WPLeafletMapPlugin.push(function () {
    var map = window.WPLeafletMapPlugin.getCurrentMap();
    textMarker = L.marker(['.$atts['lat'].', '.$atts['lng'].'],{
      icon: L.divIcon({
	    '. $atts['iconsize'] .'
        '. $atts['iconanchor'] .'
        className: "' . $atts['classname'] . '",
      }), 
    });
    textMarker.options.icon.options.html = "'.$atts['text'].'";
    map.addLayer(textMarker);
  });
  </script>';
  return "\n" . $text . "\n";
}

function leafext_divicon_shortcode($atts) {
  if ( $atts['classname'] == "" ) {
	  $atts['classname'] = "leaflet-div-icon";
  }
  if ( $atts['width'] == "" || $atts['height'] == "" ) {
	  $atts['iconsize'] = "";
	  $atts['iconanchor'] = "";
  } else {
	  $atts['iconsize'] = 'iconSize: ['.$atts['width'].', '.$atts['height'].'],';
	  $atts['iconanchor'] = 'iconAnchor: ['. $atts['width'] / 2 .', '.$atts['height'].'], // half of width + height';
  }
  return leafext_divicon_script($atts);
}
add_shortcode('leafext-divicon', 'leafext_divicon_shortcode');