Edit in JSFiddle

function go() {

  var map = new ol.Map({
    target: 'map',
    layers: [
      new ol.layer.GeoportalWMS({
        layer: "OI.OrthoimageCoverage",
      }),
      new ol.layer.GeoportalWMS({
        layer: "HY.PhysicalWaters"
      }),
      new ol.layer.GeoportalWMS({
        layer: "BU.Building"
      }),
      new ol.layer.GeoportalWMS({
        layer: "TN.RoadTransportNetwork"
      }),
      new ol.layer.GeoportalWMS({
        layer: "GN.GeographicalNames"
      })
    ],
    view: new ol.View({
      center: [2, 46],
      zoom: 12,
      projection: "EPSG:4326"
    })
  });
}

Gp.Services.getConfig({
  apiKey: "full",
  onSuccess: go,
  onFailure: (e) => {console.log(e)}
});

var infoDiv = document.getElementById("info");
infoDiv.innerHTML = "<p> Extension OL version " + Gp.olExtVersion + " (" + Gp.olExtDate + ")</p>";

<div id="map"></div>
<div id="info"></div>

#map {
  padding: 5px;
  width: 100%;
  height: 300px;
  box-shadow: 0 0 10px #999;
}

#info {
  padding: 5px;
  width: 100%;
  height: 20px;
  font-family: "monospace";
  font-size: 10px;
}