Jump to content

How to treat HTML file as web page?

Recommended Posts

This has got to be asked somewhere already, but I can't seem to find it.

I'm written some web pages directly as *.html files.

Is it possible to upload them as files, then add links to them on a Squarespage page, so that the link DISPLAYS IT AS A WEB PAGE?

(Everything I do seems to treat the .HTML file as a file, and asks "do you want to download this file?" I don't want to download it, I want to display it in the user's browser)

Link to comment
  • Replies 6
  • Views 3.7k
  • Created
  • Last Reply

Top Posters In This Topic

  • 8 months later...
5 hours ago, crystalstokowski said:

Did you figure out how to do this? I'm trying to upload an html file that I created on InDesign and I was able to upload it onto squarespace but it did not give me a url to open the file up with. Any help would be greatly appreciated! Thanks

Can you share html file here? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 year later...

Hello,

Do you have any luck with this topic?
We are also trying to upload an html file that would just be open as as new page but it doesn't seem to work.

I created a page and inserted the code in a Code Block but I have the constraint of the website design (header, spacing, and the full screen button does not work properly): https://www.uzufly.com/demo

Find below the HTML code within the *.html file:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <!-- Include the CesiumJS JavaScript and CSS files -->
  <script src="https://cesium.com/downloads/cesiumjs/releases/1.86/Build/Cesium/Cesium.js"></script>
  <link href="https://cesium.com/downloads/cesiumjs/releases/1.86/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>

<body>

  <div id="cesiumContainer"></div>
  <script>
    Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI4NTg3YzE5YS00ZDkxLTQzNzUtYTM1ZC0wOWQ1YmEyZTdmM2QiLCJpZCI6NDMyMzMsImlhdCI6MTYxMjM0MDk5MX0.i9LhK5vkwyysMYU36KBJ0EzO75FqfyDL4gkn_e4RrD8';    // Initialize the Cesium Viewer in the HTML element with the `cesiumContainer` ID.

    // Add Cesium OSM Buildings, a global 3D buildings layer.
    // const buildingTileset = viewer.scene.primitives.add(Cesium.createOsmBuildings());

    var rectangle = Cesium.Rectangle.fromDegrees(
      5.013926957923385,
      45.35600133779394,
      11.477436312994008,
      48.27502358353741
    );

    var imageryProvider = new Cesium.UrlTemplateImageryProvider({
      url:
        "https://wmts20.geo.admin.ch/1.0.0/ch.swisstopo.swissimage-product/default/current/4326/{z}/{x}/{y}.jpeg",
      minimumLevel: 8,
      maximumLevel: 17,
      tilingScheme: new Cesium.GeographicTilingScheme({
        numberOfLevelZeroTilesX: 2,
        numberOfLevelZeroTilesY: 1
      }),
      rectangle: rectangle
    });

    //imageryProvider.defaultBrightness = 1.5;

    var viewer = new Cesium.Viewer('cesiumContainer', {
      timeline:false,
      geocoder:false,
      animation:false,
      vrButton:true,
      sceneModePicker:false,
      infoBox:true,
      scene3DOnly:true,
      baseLayerPicker: false,

      terrainProvider: new Cesium.CesiumTerrainProvider({
            url:
              "https://terrain100.geo.admin.ch/1.0.0/ch.swisstopo.terrain.3d"
          }),
      imageryProvider
    });


    const tilesets = {
      tileset_LeMont_est: new Cesium.Cesium3DTileset({
        url: Cesium.IonResource.fromAssetId(670321),
        maximumScreenSpaceError : 1
      }),
      tileset_LeMont_ouest: new Cesium.Cesium3DTileset({
        url: Cesium.IonResource.fromAssetId(670323),
        maximumScreenSpaceError : 1
      }),
    }

    // Override behavior of home button
    viewer.homeButton.viewModel.command.beforeExecute.addEventListener(function(commandInfo) {
      // Fly to tileset
      viewer.flyTo(tileset);

      // Tell the home button not to do anything
      commandInfo.cancel = true;
    });

    // Add tileset to viewer and set initial camera position
    viewer.scene.primitives.add(tilesets.tileset_LeMont_est);
    viewer.scene.primitives.add(tilesets.tileset_LeMont_ouest);

    function offSettileset(tileset) {
        // Set the camera to view the newly added tileset
        var heightOffset = -50;
        var boundingSphere = tileset.boundingSphere;
        var cartographic = Cesium.Cartographic.fromCartesian(boundingSphere.center);
        var surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 0.0);
        var offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, heightOffset);
        var translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());
        tileset.modelMatrix = Cesium.Matrix4.fromTranslation(translation);
    }

    function zoomToTileSet(tileset) {
        viewer.zoomTo(tilesets[tileset]);
    }

    tilesets.tileset_LeMont_est.readyPromise.then((tileset) => {
        offSettileset(tileset);

        viewer.zoomTo(tileset);
    });

    tilesets.tileset_LeMont_ouest.readyPromise.then((tileset) => {
        offSettileset(tileset);
    });

    var measureWidget = new Cesium.Measure({
     container : 'measureContainer',
     scene : scene,
     units : new Cesium.MeasureUnits({
         distanceUnits : Cesium.DistanceUnits.METERS,
         areaUnits : Cesium.AreaUnits.SQUARE_METERS,
         volumeUnits : Cesium.VolumeUnits.CUBIC_FEET,
         angleUnits : Cesium.AngleUnits.DEGREES,
         slopeUnits : Cesium.AngleUnits.GRADE
     })
});


  </script>
</body>
</html>

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.