HautBranding Posted May 30, 2020 Share Posted 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 Link to comment
Solution paul2009 Posted May 30, 2020 Solution Share Posted May 30, 2020 The brackets should be curly braces like this: {} not () Improve your online store with our extensions.About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links.Catch up on all the release notes and announcements 2023 [for Circle members only] (there's a public version here)Buy me a coffee Link to comment
HautBranding Posted May 31, 2020 Author Share Posted May 31, 2020 Thanks Paul, It's working now! Link to comment
Cyperpunk-girl-333 Posted April 28, 2021 Share Posted April 28, 2021 <!DOCTYPE html> <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta charset="utf-8"> <title>Model Viewer</title> <!-- Import the component --> <script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script> <style> Model viewer { Width:400px; Height:600px; Margin: 0 auto; } </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 Link to comment
creedon Posted April 28, 2021 Share Posted 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. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
Cyperpunk-girl-333 Posted April 28, 2021 Share Posted 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, Link to comment
creedon Posted April 28, 2021 Share Posted 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. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
Cyperpunk-girl-333 Posted April 28, 2021 Share Posted 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. 🙂 Link to comment
Cyperpunk-girl-333 Posted April 29, 2021 Share Posted 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> Link to comment
angelorman Posted February 20 Share Posted February 20 Syntax Error on line 1 <!-- Start Square Appointments Embed code --> <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> <!-- End Square Appointments Embed code --> 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 Link to comment
creedon Posted February 20 Share Posted 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. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment