Syntax Error on Line 1

HautBranding · May 30, 2020

I've been watching a couple Squarespace videos on how to do small customizations on my website via the Custom CSS section and I type in the code exactly and it constantly gives me the Syntax Error on Line 1.

Not sure what I'm doing wrong?

Here's the code I was trying out.

.sqs-block-button-element--medium(background-color:#f69477)

Thanks

paul2009 · May 30, 2020

The brackets should be curly braces like this:

{} not ()

HautBranding · May 31, 2020

Thanks Paul,

It's working now!

Cyperpunk-girl-333 · April 28, 2021

<!DOCTYPE html>
<html>
   <head>
       <meta http-equiv="X-UA-Compatible" content="IE=edge">
       <meta charset="utf-8">
       <title>Model Viewer</title>

<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>

</style>
</head>
<body> <model-viewer> scr="https://products.aspose.app/3d/assets/js/aspose.3d-2.0.js" camera-controls auto-rotate</model>
</body>
</html>

I keep getting syntax error one line? what does this mean

creedon · April 28, 2021

@christina_marie_333

The code you have there wouldn't be valid entered anywhere in SS.

Please explain what you are trying to accomplish and we may be able to guide you.

Cyperpunk-girl-333 · April 28, 2021

Hi Creedon thank you so much for your reply I'm trying to add a 3D model image to my sqaure space website that visitors can grab / rotate and view all angles I have the same image file saved as OBJ FBX PLY STL

I'd like the web user to be able to hover mouse over image and drag and pull move and interact with the 3D model file I have of a laser scan of a pipe.

To show website visitors the defects in the image. I have uploaded a still Jpeg of the 3D model file. I've tired using paid third party programs like Vectary but I can't seem to get those embeded codes to work on Sqaurespace either.

Really stuck because entire site is build on sqaurespace for a rov engineering company,

creedon · April 28, 2021

@christina_marie_333

I'm starting to understand. I think this is the technology you are trying to use.

<model-viewer>

Looking at the Quick Start on the above page your code has some of the elements. But it appears to have been munged. I don't see a glb file. I've spent all of about two minutes so I'm no expert.

Cyperpunk-girl-333 · April 28, 2021

Yes this is the code I was trying to use, however I'm also no expert. would be happy to pay you to help me via paypal?

I added my glb file but could't work out how to implement it into the html? would you know how to un mangle it? I could email you the file? Any help would be amazing. Just give me a rough quote. 🙂

Cyperpunk-girl-333 · April 29, 2021

<!DOCTYPE html>
	<html lang="en">
	<head>
	<title><model-viewer> Interactive Example</title>
	<meta charset="utf-8">
	<meta name="description" content="<model-viewer> interactive example">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link type="text/css" href="../styles/examples.css" rel="stylesheet" />
	<link rel="shortcut icon" type="image/png" href="../shared-assets/models/favicon.png"/>

	<!-- 💁 OPTIONAL: The :focus-visible polyfill removes the focus ring for some input types -->
	<script src="../node_modules/focus-visible/dist/focus-visible.js" defer></script>
	<style>
	body, html {
	height: 100%;
	font-size: 10pt;
	}

	label {
	display: inline-block;
	width: 120px;
	height: 24px;
	}

	input {
	vertical-align: middle;
	}

	input.number {
	border: 0;
	background: transparent;
	font-size: 16px;
	width: 32px;
	outline: none;
	}

	select {
	font-size: 14px;
	}

	#container {
	display: flex;
	height: 100%;
	}

	model-viewer {
	flex-grow: 1;
	height: 100%;
	}

	#instructions {
	width: 320px;
	margin-top: 10px;
	margin-left: 30px;
	margin-bottom: 20px;
	}

	.hotspot{
	width: 20px;
	height: 20px;
	border-radius: 10px;
	border: none;
	background-color: blue;
	}

	.annotation{
	background-color: #888888;
	position: absolute;
	transform: translate(10px, 10px);
	border-radius: 10px;
	padding: 10px;
	text-align: left;
	}

	.hotspot.selected{
	background-color: red;
	}

	.hotspot:not(.selected) > .annotation{
	display: none;
	}

	@media screen and (max-width: 320px) {
	#instructions {
	display: none;
	}
	}
	</style>
	</head>
	<body>

	<div id="container">
	<div id="instructions">
	<h1>
	<a href="https://github.com/google/model-viewer" target="_blank" rel="noopener"><model-viewer></a>
	</h1>
	Drop a <a href="https://github.com/KhronosGroup/glTF" target="_blank" rel="noopener">glTF or GLB</a> for the model =><br/>
	Drop an <a href="https://hdrihaven.com/" target="_blank" rel="noopener">HDR or JPG</a> for the skybox =><br/>
	<input type="file" id="input" multiple><br/><br/>

	<label for="src">src:</label>
	<select id="src">
	<option value="../shared-assets/models/Astronaut.glb">Astronaut</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/BoomBox/glTF-Binary/BoomBox.glb">Boom Box</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/BrainStem/glTF-Binary/BrainStem.glb">Brain Stem</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/Corset/glTF-Binary/Corset.glb">Corset</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/DamagedHelmet/glTF-Binary/DamagedHelmet.glb" selected>Damaged Helmet</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/FlightHelmet/glTF/FlightHelmet.gltf">Flight Helmet</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/Lantern/glTF-Binary/Lantern.glb">Lantern</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/Suzanne/glTF/Suzanne.gltf">Monkey</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/SpecGlossVsMetalRough/glTF-Binary/SpecGlossVsMetalRough.glb">Water Bottles</option>
	<option value="../shared-assets/models/RobotExpressive.glb">Robot Expressive</option>
	<option value="../shared-assets/models/alpha-blend-litmus.glb">Transparency Test</option>
	<option value="../shared-assets/models/glTF-Sample-Models/2.0/MetalRoughSpheres/glTF/MetalRoughSpheres.gltf">Metal Rough Spheres</option>
	</select><br/>

	<label for="environmentImage">environment-image:</label>
	<select id="environmentImage">
	<option value="" selected>default</option>
	<option value="../shared-assets/environments/spruit_sunrise_1k_HDR.hdr">spruit sunrise HDR</option>
	<option value="../shared-assets/environments/spruit_sunrise_1k_LDR.jpg">spruit sunrise JPG</option>
	<option value="../assets/music_hall_01_1k.hdr">music hall</option>
	<option value="../assets/whipple_creek_regional_park_04_1k.hdr">whipple creek</option>
	<option value="../shared-assets/environments/aircraft_workshop_01_1k.hdr">aircraft workshop</option>
	<option value="../assets/pillars_1k.hdr">pillars</option>
	</select><br/>

	<label for="useSkybox">use as skybox:</label>
	<input id="useSkybox" type="checkbox" disabled="true"><br/>

	<label for="exposure">exposure:</label>
	<input id="exposure" type="range" step="0.01" min="0" max="2" value="1">
	<input id="exposureValue" value="1" class="number"><br/>

	<label for="shadowIntensity">shadow-intensity:</label>
	<input id="shadowIntensity" type="range" step="0.01" min="0" max="1" value="0">
	<input id="shadowIntensityValue" value="0" class="number"><br/>

	<label for="shadowSoftness">shadow-softness:</label>
	<input id="shadowSoftness" type="range" step="0.01" min="0" max="1" value="1">
	<input id="shadowSoftnessValue" value="1" class="number"><br/>

	<label for="autoRotate">auto-rotate:</label>
	<input id="autoRotate" type="checkbox"><br/><br/>

	To create a seamless poster:<br/>
	Orient model and resize window to desired size (small is recommended), then click:<br/>
	<button onclick="createPoster()">Create Poster</button><br/>
	Then resize window to any aspect ratio and click:<br/>
	<button id="display" onclick="reloadScene()">Display Poster</button><br/>
	Click the model to dismiss the poster and interact. To save your poster, click:<br/>
	<button id="download" onclick="downloadPoster()">Download Poster</button><br/>
	camera-orbit:
	<div id="cameraOrbit"></div><br/><br/>

	To calculate hotspot locations, click:<br/>
	<button onclick="addHotspot()">Add Hotspot</button><br/>
	Then click on the model.<br/>
	To remove a hotspot, select it, then click:<br/>
	<button onclick="removeHotspot()">Remove Hotspot</button><br/>

	</div>
	<model-viewer id="loading-demo" autoplay camera-controls interaction-prompt="none"
	src="../shared-assets/models/glTF-Sample-Models/2.0/DamagedHelmet/glTF-Binary/DamagedHelmet.glb" alt="A 3D model">
	</model-viewer>
	</div>

	<div class="footer">
	<ul>
	<li class="attribution">
	<a href="https://poly.google.com/view/dLHpzNdygsg">Astronaut</a> by <a href="https://poly.google.com/user/4aEd8rQgKu2">Poly</a>,
	licensed under <a href="https://creativecommons.org/licenses/by/2.0/">CC-BY</a>.
	</li>

	<li class="attribution">
	<a href="https://github.com/KhronosGroup/glTF-Sample-Models/tree/master/2.0/DamagedHelmet">Damaged Helmet</a> by <a href="https://sketchfab.com/theblueturtle_">theblueturtle_</a>,
	licensed under <a href="https://creativecommons.org/licenses/by-nc/3.0/us/">Creative Commons Attribution-NonCommercial</a>.
	</li>

	<li class="attribution">
	<a href="https://github.com/mrdoob/three.js/tree/dev/examples/models/gltf/RobotExpressive">RobotExpressive</a> by <a href="https://www.patreon.com/quaternius">Tomás Laulhé</a>,
	licensed under <a href="https://creativecommons.org/publicdomain/zero/1.0/">CC0</a>.
	</li>

	<li class="attribution">
	<a href="https://hdrihaven.com/hdri/?h=small_hangar_01">small_hangar_01_1k.jpg</a> by <a href="https://hdrihaven.com">HDRI Haven</a>,
	licensed under <a href="https://hdrihaven.com/p/license.php">CC0</a>.
	</li>

	<li class="attribution">
	<a href="https://hdrihaven.com/hdri/?h=whipple_creek_regional_park_04">whipple_creek_regional_park_04_1k.hdr</a> by <a href="https://hdrihaven.com">HDRI Haven</a>,
	licensed under <a href="https://hdrihaven.com/p/license.php">CC0</a>.
	</li>
	</ul>
	<div style="margin-top:24px;" class="copyright">©Copyright 2018-2020 Google Inc. Licensed under the Apache License 2.0.</div>
	<div><a href="https://github.com/google/model-viewer">Github</a> ∙ <a href="https://model-viewer.glitch.me/">Glitch</a> ∙ <a href="https://github.com/google/model-viewer/issues">Bug report</a></div>
	</div>

	<script type="module" src="./built/tester.js"></script>

	<!-- Documentation-specific dependencies: -->
	<script type="module"
	src="./built/dependencies.js">
	</script>
	</body>
	</html>

angelorman · February 20

Syntax Error on line 1

<a target="_top" style="
background-color: transparent;
border: 2px solid #e7d1b5;
color: #e7d1b5;
height: 40px;
text-transform: uppercase;
font-family: 'Square Market', sans-serif;
letter-spacing: 1px;
line-height: 38px;
padding: 0 28px;
border-radius: 8px;
font-weight: 500;
font-size: 14px;
cursor: pointer;
display: inline-block;
" href="https://squareup.com/appointments/book/y3zoxs7mwpetmr/LRHJY8WVT5BEB/start" rel="nofollow">Book Now</a>

this is the code trying to add a button that takes visitors to a booking calendar keep getting the same error not sure how to handle this. please if anyone can help

creedon · February 20

35 minutes ago, angelorman said:

this is the code trying to

The code you show is HTML. I suspect you've tried to add it to Design > Custom CSS. Custom CSS is for CSS code, HTML can not go in there.

You probably want to add the code Either the site-wide HEADER for FOOTER code injection.

It's hard to know for sure how to advise you. It helps if we have a site URL and a description of the effect you want.

I suggest you start a new thread with what you want to accomplish, supply some details, and then perhaps we can help. This thread has several different issues being discussed and it's easier on everyone if we can keep threads down to one set of issues.

Syntax Error on Line 1

Recommended Posts

HautBranding

Link to comment

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Posted Images

paul2009

Link to comment

HautBranding

Link to comment

Cyperpunk-girl-333

Link to comment

creedon

Link to comment

Cyperpunk-girl-333

Link to comment

creedon

Link to comment

Cyperpunk-girl-333

Link to comment

Cyperpunk-girl-333

Link to comment

angelorman

Link to comment

creedon

Link to comment

Create an account or sign in to comment

News

Resources

Squarespace Webinars

Hire a Designer

Support

Community

Developers

Resources