Search the Community

I see a preview of the code when I insert it into a code box on the page, but when I click save the entire page goes blank. Help? <iframe src="http://daar.rdeskbw.com/kevin-porter/listing/listingsearch.aspx" width="100%" height="100%" frameborder="0"/>

https://coalitionvans.com/terriblecrewshop 1. I have added code to change the header on certain pages of my site which has worked great. I want to do the same to the product pages but cannot seem to access the Page Header Code Injection for these pages. Please could someone recommend how I can change this? Image 1 = edited header (what I wish to display on the product pages) Image 2 = current header on product pages 2. Secondly, I have changed the logo in the header of some pages (the logo shown in the header in Image 1). although the logo shows up when i'm in edit mode (image 3), when I view the site normally it is not there (Image 4). any help would be greatly appreciated. Thank you in advance!

Hello, I'm trying to change the color of of my header (and footer) on the "Access denied screen". I've been injecting the following code on the pages where it's been needed, but can't find a way to insert it for the "Access denied screen" <style> header#header, header.sections .section-background { background: #9b26b6 !important; } .header-nav-item a, .header-nav-folder-item:hover a { color: white !important; } .header-actions-action--social svg { fill: white !important; } </style> Can anyone help me with this?

Site URL: https://pumpkin-pentagon-fmgr.squarespace.com/blk-101-nova-scotia Hi guys, I've implemented a featherlight lightbox biography for my website. However, sections or elements below the lightbox area become interactive and those sections open a lightbox when there should be none opening up. Is there a problem with the coding? I've been having difficulty configuring how the lightbox coding. My current code looks like this: Code Injection (Header and Footer): <link href="//cdn.rawgit.com/noelboss/featherlight/1.7.13/release/featherlight.min.css" type="text/css" rel="stylesheet" /> <script src="//code.jquery.com/jquery-latest.js"></script> <script src="//cdn.rawgit.com/noelboss/featherlight/1.7.13/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script> Code Block: <a href="#" data-featherlight="#bio-Lindell"> <img src=imagelink</a> <div style="display:none;"> <div id="bio-Lindell" style="text-align:center;"> <img src="Image link" width="300" height="300"/> <h3 style="text-align:left">Name</h3> <p style="text-align:left">Text</p> </div> </div> Looking forward to see how to remedy this issue. My password for my site is 7412!

HI, HOW CAN I ADD A COLOR BACKGROUND TO MY FOOTER? THANK YOU!!!

Hello:) I have these black lines on the side of my video. I used this tutorial to add in my video: https://www.katescott.co/blog/squarespace-animations. In code block: <video autoplay="autoplay" muted loop="true" width="100%" controls> <source src="https://static1.squarespace.com/static/61d0f1f92ffb8339ed5a974b/t/639fdda26868072f56a019d3/1671421354482/branding-z_social-implementation-800x450.mp4" type="video/mp4"> </video> CSS: .video { background-color: white; pointer-events: none; position: center; aspect-ratio: 16/9; } How can I get rid of those black lines? BTW, the video itself doesn't have those lines. Site: https://www.makellwebb.com/branding

Hi there, I would love some help with adding breadcrumbs to this page: https://www.fitforlife.foundation/laureates2022 It's a level 2 page that can't be accessed from the main menu. I would like to add breadcrumbs at the top of the page to make it easier for the viewer to understand the page hierarchy. How it this possible? Does it require code-injection?

Hi Community, I am a Blockchain Engineer & NFT Expert.... I want to integrate web3, metamask & my NFT Smart contract on my website https://www.thelastofthewarriors.io/ . I need to put only one "Whitelist" Button where a smart contract will be integrated & Metamask(A Crypto wallet) will be open which will take the amount & perform the transaction on smart contract. Any way I can achieve this???

After going through many tutorials and speaking with the Google Ads team a few times I am still struggling to figure out how to correctly integrate Google Ads conversion tracking on my Squarespace website. To be sure I am not doing commerce. I am simply tracking the conversions of those who fill out a form and submit, like a quote for instance. Most of the tutorials look like they are geared for commerce which might make a difference in setup. To be sure I have a Squarespace Business Account and have fully setup accounts for both Google Ads and Google Analytics. I have copy and pasted the Google Ads Tag into the Settings -> Advanced -> Code Injection -> Header of my site. (see screenshot) I also put the Event Snippet into the Page Settings -> Advanced -> Page Header Code Injection section of the page I redirect to after a successful form submission. (see screenshot) My problem is that after setting it up I still see a "No Recent Conversions" in my Google Ads page (see screenshot). This is after I used another computer, with a VPN, and no account logins to make multiple test submissions. Why is this? Do I need to wait a week for it to fully initialize or did I set something up incorrectly? Is there a better way to do this? I am happy to document anything else and would appreciate any tips possible.

I am looking for code to inject in my header on all pages so that it makes the logo right justified on the page. Can anyone help with that? Thank you

Hi there, I'm curious as to how I would go about creating clickthrough URL's on the individual cards I created in Figma. I'm utilizing an image content section that is designed as a carousel and I uploaded hard designed/flattened "cards" as images in the carousel. I want to make each card it's own clickthrough link to that companies website. I have the option of creating buttons as clickthrough's that live beneath the cards, but I want the clickthrough to live directly on the individual card/image components themselves. Anyone have an idea on how to do this? (I'm proficient in coding so feel free to drop some ideas when it comes to DOM manipulation).

Hello brilliant web-builders! Is there any way to make the below customization possible? A) Summary Block: Images to be displayed in circular shape, instead of the retangular or sqaure from the options under "Design" of the block Move the order of the display layout from "Image > (Blog) Title > Excerpt Text" to "Excerpt Text > (Blog) Title > Image"? B) Testimonial Carousel: Move the order of the display layout of all blocks in the carousel from "Image > Text > Title" to "Text > Title > Image"? Set / change the timer of the auto slider to move every 5 seconds Thanks a million! Freeman xx Site URL: https://www.traveltotransform.com/the-book

I've removed all code injections from existing pages and my settings->advanced->code-injections is completely blank. What should I do to remove this widget?

Site URL: https://fintech.caspianone.com/ Hi everyone - looking for an assist please. I've recently been involved in the development of fintech.caspianone.com. The website needed the ability to present jobs so we used the blogging facility of Squarespace to accommodate this want. It was also requested that jobs be optimised to appear on the new(ish) Google for Jobs platform. In an attempt to action this request we added a code block to each job page (blog page), with rich structured data. As an example, the job at LINK has the below code added. However, this doesn't appear to have provided a solution - and when I run the example URL through Google's Rich Results test (LINK) it appears to be discovering 'Article' schema but not job listing schema. I'd be hugely grateful for any support with ensuring these blog-page jobs rank on Google for Jobs. Many thanks in advance! <script type="application/ld+json"> { "@context": "https://schema.org/", "@type": "JobPosting", "title": "Software Developer- Blockchain - Outside IR35 project", "description": "The client is a Hong Kong based Crypto firm known as BC Group who are looking to build out a London Entity for their Digital Asset Platform subsidiary, OSL. They are looking for strong full-stack or backend Node.JS developers to grow their Blockchain team. BC Group are a Hong Kong based Crypto group who are listed on the Hong Kong Stock Exchange. Joining a growing team, working on critical security platform to the business. Fully remote role, growing a London entity flexible to either an Outside IR35 contract, or a perm position. This role will also give exposure to technologies such as Node.JS, Rust and Golang.", "identifier": { "@type": "PropertyValue", "name": "Caspian One FinTech Recruitment", "value": "10066" }, "hiringOrganization" : { "@type": "Organization", "name": "Caspian One FinTech Recruitment", "sameAs": "https://fintech.caspianone.com/" }, "industry": "Technology","FinTech", "employmentType": "Contract", "datePosted": "12-03-2021", "jobLocation": { "@type": "Place", "address": { "@type": "PostalAddress", "addressLocality": "Remote", "addressRegion": "London", "addressCountry": "UK" } }, "baseSalary": { "@type": "MonetaryAmount", "currency": "GBP", "value": { "@type": "QuantitativeValue", "minValue": 500, "maxValue": 600, "unitText": "DAY" } } } </script>

Hello, Wondering how to have my site header not do this when the tab is shrunk down. Any help would be appreciated!

I have embedded a ConvertKit Form via a code block (Fluid Engine), however there appears to be a large area of extra space below the code block that I cannot get rid of (see attached screenshot). I have tried CSS to no avail and cannot drag the area/rows up any further than it currently is. Any ideas how I can remove this extra space below the embedded form? Link to page: https://www.gracemooreyoga.com/mentorship Any help is much appreciated 🙂

Hello Squarespace community! I tried everywhere to find an answer to my dilemma: how to build a pattern tester on Squarespace. Maybe someone could help me figure out how to build such a pattern tester landing page. Below i am including 2 examples, one colleague made it in Wordpress, and another on Squarespace: https://bardotbrush.com/repeat/ https://majafaber.com/patterntester I'm trying to build the same tester for my website but I search the web through, and no answer hmm. It is a tester for testing pattern tiles for surface pattern design. You drop your pattern tile, and the tester multiplies the tile, so that you can see better what your pattern will look like when repeated. This tester also includes a handle that allows to change the scale of your pattern preview: you can make it smaller or bigger, and this helps you testing if it is a well-balanced pattern. I'm including one screenshot of what it looks like when you drop a pattern tile into it. I'd love to buy you a virtual coffee if you help me figure this out! :)

Hello! I want to add a 'Contact' button on the mobile navigation bar on my website. How do I do this? Using Five template on Squarespace 7.0.

Hello, I added a custom apple touch icon to my site and there is this line of css in there. <link rel="manifest" href="/site.webmanifest"> Can someone explain what "/site.webmanifest" is or what it is that I need to replace this with. Thank you in advance!

Hey guys, on my site i'm trying to change the navigational links on mobile to look like the enquire button at the top of the burger menu via CSS. Any help is greatly appreciated! site is: https://harpsichord-harmonica-ga8f.squarespace.com/ password: 123

Dear all, I have added a review section where people can leave comments and rating on my work! To do so, I added a blog post... Do you know if it's possible to add stars rating in the comment box? https://www.juliestamenic.com/reviews/peoplesay MANY THANKS!

I would like the two pricing lists to appear side-by-side when viewing from mobile for this particular page. I've searched and tried some codes provided by @tuanphan without success. Any info/advice is appreciated! https://www.arielna.com/atompricingchange2023

I would like the two pricing list to appear side-by-side when viewing from mobile for this particular page. I've searched and tried some codes provided by @tuanphan without success. Any info/advice is appreciated! https://www.arielna.com/atompricingchange2023

Hi, I am hoping to get some custom css so I can change the padding for my blog posts (ALL PAGES) for TABLET only. Looks fine on desktop and mobile. As you can see from screenshot there is a lot of space to the right and left which I would like to adjust for tablet only. THANKS!

I'm trying to update a widget from Artplacer that allows you to see art against a photograph from the customer. The basic code injection (in the footer) to add the widget is below - however, it requires customization in order to update the size values when the customer selects a different product variant. I have some coding experience but not with javascript and can read basic html but I was hoping someone can help me figure out how to update the code injection. Widget code: <script src="https://widget.artplacer.com/js/script.js"></script> <script type="application/javascript"> ArtPlacer.insert({ gallery: "30905", default_style: "true", resizable: "false", frames: "true", rotate: "false", catalog: "visible", type: "1", }) </script> 'Vanilla Javascript' from Artplacer to call the artplacer API and update sizes when different variants are selected: document.querySelector(‘input[name=variant_selector]’).addEventListener(change', function(){ const size = this.value; // Get the size from the selected element const height = parseFloat(size.split(‘x’)[0]); // Extract the height from the size const price = document.querySelector(‘.active-price’).innerHTML // Get the price from the price HTML tag, assuming it has already changed ArtPlacer.changeAll(height, size, price); }); It seems like I have to select the attributes from 'data-selected-variant' under the class 'product-variants preFade fadeIn' but I'm not sure how to do that. Thanks for any help!