Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Search the Community

Showing results for tags 'coding'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location

Found 30 results

  1. hello everyone, i am trying to figure out the following. I currently have a list of brands with dropdown models. Instead of one long column i'd like to do 2 or maybe 3 columns side by side. is there any way to do this in just one box? or am i going to have to add 3 boxes side by side? this is current code <ul class="accordion"> <a class= "toggle" href= "javascript:void (0);"><h3>Aalborg Industries</h3></a> <ul class= "inner"> <li>KBO-R40M <li>MISSION OC 3000/2400 KG/H <li>MISSIONTM OC <li>OID 01 A <li>AQ – 16 <li>RMS9 <li>AQ-12 <li>And any other Aalborg industry models you might need.</li> </ul> from here on it repeats with different brand and models. how can i get this done?
  2. Hi all, I'm trying to disable mobile responsive design for only some blocks on my website. My website URL is: https://cheap-talk.com/ On mobile, the products on my home page stack and it's not the best UX for customers. I want these to stay in rows of two instead of stacking 1:1. Anyone know how to do this? Custom CSS?
  3. Hi all, I'm trying to disable mobile responsive design for only some blocks on my website. My website URL is: https://cheap-talk.com/ On mobile, the products on my home page stack and it's not the best UX for customers. I want these to stay in rows of two instead of stacking 1:1. Anyone know how to do this? Custom CSS?
  4. So, Im from India. but, unfortunately, i don't find INR in the store currency, which i really want. i honestly wouldn't go anywhere but SquareSpace, since its just so good! but, without INR, there, it make it impossible to make a eCommerce website so, is there an option to change it to INR , maybe by even a code? or, when is it coming to SquareSpace(the INR?) home-commerce-payments-store currency
  5. Hello community, I want to show 3 Metadata types on my blog posts (author , date, and tags). The brine template which I am using, only allows to show 2 types of Metadata. If I show the author & date using the standard site style options, is there any custom code I can use to show the blog tags at the bottom of each post? I understand how to hide certain elements in Squarespace using custom CSS e.g Item.name{ display:none; } Maybe it is possible to do the reverse with the hidden tags ? If someone could shed some light on this I would great appreciate it. Max
  6. Hi, I am currently using the native template and trying to remove the like button with the heart icon from a blog page. How do I do this? Any help would be appreciated here. Thanks, Jayson
  7. I added a bit of matrix text to my homepage. But, I want to slow it down a little. Does anyone know how to do this?
  8. Hello, I have recently implemented a hamburger menu for a website I am working on for the desktop & mobile versions. I was previously using a nice code that underlines the navigation menu when you hover over the links, now that I have switched to a hamburger menu style I was wondering if I could slightly alter my code to target the hamburger menu navigation? I am assuming I can re-target the code to work the same but just targetting the hamburger menu nav instead now. Below is part of the code I am using - I have highlighted the part it currently targets which was my old navigation menu. Is it as simple as replacing header nav a with the source for the hamburger menu nav? Does anyone know how to target this section of the site and if so what is it? // Left Nav Line // @media all and (min-width:840px){ header nav a { display: inline-block !important; float: left; } I am using the original version of squarespace and I am using the brine template - I've changed the mobile break point so I could achieve the hamburger menu, now I would like to have the ability to underline the navigation options when a user highlights over them.
  9. Anyone know how to add social icons to the mobile menu?
  10. How can you style summary block carousel arrows? I am using it as a testimonial slider and want the arrows, and the text bigger.
  11. How can I increase the size of a carousel on mobile? Also, I have obtained a css code to allow rotating words on the home page, as well as the html for it. But, it doesn't display right on mobile. How do I fix this? Here's the code: // Rotating Word 1 // .rotating-words-1 span:nth-child(2) { -webkit-animation-delay: 3s; -moz-animation-delay: 3s; -o-animation-delay: 3s; -ms-animation-delay: 3s; animation-delay: 3s; color: #4FEAAB; } // Rotating Word 2 // .rotating-words-1 span:nth-child(3) { -webkit-animation-delay: 6s; -moz-animation-delay: 6s; -o-animation-delay: 6s; -ms-animation-delay: 6s; animation-delay: 6s; color: #4FEAAB; } // Rotating Word 3 // .rotating-words-1 span:nth-child(4) { -webkit-animation-delay: 9s; -moz-animation-delay: 9s; -o-animation-delay: 9s; -ms-animation-delay: 9s; animation-delay: 9s; color: #4FEAAB; } // Rotating Word 4 // .rotating-words-1 span:nth-child(5) { -webkit-animation-delay: 12s; -moz-animation-delay: 12s; -o-animation-delay: 12s; -ms-animation-delay: 12s; animation-delay: 12s; color: #4FEAAB; } // Rotating Word 5 // .rotating-words-1 span:nth-child(6) { -webkit-animation-delay: 15s; -moz-animation-delay: 15s; -o-animation-delay: 15s; -ms-animation-delay: 15s; animation-delay: 15s; color: #4FEAAB; } // Rotating Words // .rotating-words{ display: inline; text-indent: 5px; } .rotating-words-1 span{ position: absolute; opacity: 0; overflow: hidden; color: #6b969d; -webkit-animation: rotateWord 18s linear infinite 0s; -moz-animation: rotateWord 18s linear infinite 0s; -o-animation: rotateWord 18s linear infinite 0s; -ms-animation: rotateWord 18s linear infinite 0s; animation: rotateWord 18s linear infinite 0s; } // Rotating Animation Keys // @-webkit-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -webkit-transform: translateY(-30px); } 5% { opacity: 1; -webkit-transform: translateY(0px);} 17% { opacity: 1; -webkit-transform: translateY(0px); } 20% { opacity: 0; -webkit-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-moz-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -moz-transform: translateY(-30px); } 5% { opacity: 1; -moz-transform: translateY(0px);} 17% { opacity: 1; -moz-transform: translateY(0px); } 20% { opacity: 0; -moz-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-o-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -o-transform: translateY(-30px); } 5% { opacity: 1; -o-transform: translateY(0px);} 17% { opacity: 1; -o-transform: translateY(0px); } 20% { opacity: 0; -o-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-ms-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -ms-transform: translateY(-30px); } 5% { opacity: 1; -ms-transform: translateY(0px);} 17% { opacity: 1; -ms-transform: translateY(0px); } 20% { opacity: 0; -ms-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; transform: translateY(-30px); } 5% { opacity: 1; transform: translateY(0px);} 17% { opacity: 1; transform: translateY(0px); } 20% { opacity: 0; transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } }
  12. Anybody know how I can hide the navigation menu in mobile (both tablet and phone) and use a hamburger or like navigation instead? Also, Id like to create a header on my home page with a few phrases at the end that rotate between them. Any idea how? Thanks!
  13. I have a css code I added. How do I get this to only display on desktop and tablet, but not phone? Here's the code. // Rotating Word 1 // .rotating-words-1 span:nth-child(2) { -webkit-animation-delay: 3s; -moz-animation-delay: 3s; -o-animation-delay: 3s; -ms-animation-delay: 3s; animation-delay: 3s; color: #ffff00; } // Rotating Word 2 // .rotating-words-1 span:nth-child(3) { -webkit-animation-delay: 6s; -moz-animation-delay: 6s; -o-animation-delay: 6s; -ms-animation-delay: 6s; animation-delay: 6s; color: #ffff00; } // Rotating Word 3 // .rotating-words-1 span:nth-child(4) { -webkit-animation-delay: 9s; -moz-animation-delay: 9s; -o-animation-delay: 9s; -ms-animation-delay: 9s; animation-delay: 9s; color: #ffff00; } // Rotating Word 4 // .rotating-words-1 span:nth-child(5) { -webkit-animation-delay: 12s; -moz-animation-delay: 12s; -o-animation-delay: 12s; -ms-animation-delay: 12s; animation-delay: 12s; color: #ffff00; } // Rotating Word 5 // .rotating-words-1 span:nth-child(6) { -webkit-animation-delay: 15s; -moz-animation-delay: 15s; -o-animation-delay: 15s; -ms-animation-delay: 15s; animation-delay: 15s; color: #ffff00; } // Rotating Words // .rotating-words{ display: inline; text-indent: 10px; } .rotating-words-1 span{ position: absolute; opacity: 0; overflow: hidden; color: #6b969d; -webkit-animation: rotateWord 18s linear infinite 0s; -moz-animation: rotateWord 18s linear infinite 0s; -o-animation: rotateWord 18s linear infinite 0s; -ms-animation: rotateWord 18s linear infinite 0s; animation: rotateWord 18s linear infinite 0s; } // Rotating Animation Keys // @-webkit-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -webkit-transform: translateY(-30px); } 5% { opacity: 1; -webkit-transform: translateY(0px);} 17% { opacity: 1; -webkit-transform: translateY(0px); } 20% { opacity: 0; -webkit-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-moz-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -moz-transform: translateY(-30px); } 5% { opacity: 1; -moz-transform: translateY(0px);} 17% { opacity: 1; -moz-transform: translateY(0px); } 20% { opacity: 0; -moz-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-o-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -o-transform: translateY(-30px); } 5% { opacity: 1; -o-transform: translateY(0px);} 17% { opacity: 1; -o-transform: translateY(0px); } 20% { opacity: 0; -o-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-ms-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -ms-transform: translateY(-30px); } 5% { opacity: 1; -ms-transform: translateY(0px);} 17% { opacity: 1; -ms-transform: translateY(0px); } 20% { opacity: 0; -ms-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; transform: translateY(-30px); } 5% { opacity: 1; transform: translateY(0px);} 17% { opacity: 1; transform: translateY(0px); } 20% { opacity: 0; transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } }
  14. Hi, can anyone help me with displaying the tagline on the mobile version of my site please? www.vibeyogaandpilates.co.uk P/W mysite100 Thanks in advance Mike
  15. Hello, I want to change the font for a specific page. If I change it from the Site Styles, it would edit the whole website's font. What custom css should I use to have a different font for a specific blank page. This is it: https://mastercarsreview.com/gallery Thank you!
  16. I'm currently using the Hayden template and wondering if there is code to add my uploaded font to my squarespace banner. I don't want the typical squarespace text style in each banner section, but looking to add my own custom text and possibly adding text animation if at all possible. Here is my website homepage: https://www.mccloskeycoaching.com/ The text on the screen now is on the image itself I created in picmonkey. But is there a way to code the text on the website directly? I have done it everywhere else on my site except for the banner image. Thanks!
  17. When I click to read my blog the title shows up on my header but I don't want it there. Is there a code to insert to remove this?
  18. I want to block China (I don't mean to sound offensive) but chinese based companies constantly steal peoples artwork and try to sell on cheap products as their own (this has been happening ALOT recently to people I know) and i'd like to block the country all together from my website. I'm not too knowledgeable on coding and since I can't seem to find an option to do this i'm hoping you can via coding. Thank you!!
  19. Hi All, I am building a new site in 7.1 and need to hide a few pages on desktop/mobile etc as I have done many times in 7.0 using the below code. For the life of me I can figure out how to get this working in 7.1 with the new index page builder?? Before it was using #page-name as the target but I have tried several things as the target but no joy. // hide desktop banner image on mobile @media screen and (max-width: 640px) { #corporate-header {visibility: hidden !important; display: none !important; }} // hide mobile banner image on desktop @media screen and (min-width: 640px) { #corporate-header-mobile {visibility: hidden !important; display: none !important; } Any advice appreciated! Thanks! C.
  20. Hello! I'm trying to insert a coding block of some maps brought in from ArcGIS in a Brine template page, using some code suggested by ArcGIS. However, when the map is brought in, it's very tiny, and does not fill the entirely of the block. When I add any specific pixel widths to the code, it extends outward to the right so a majority of the map is out of view. I'd like to get it so that it at least extends the same width as the image at the top of the page. This is what I'm using: <iframe width=”100%" height=”750” frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://njrgp.maps.arcgis.com/apps/opsdashboard/index.html#/a856ba6b11df4a0bb5098b8ad1cadda3"></iframe> Sadly, my coding skills sort of peaked, then went into a coma around 1999, so I'm out of ideas trying to figure this out. Thank so much! Jason Wickersty
  21. Can somebody please please help me with my website. I am trying to remove the left & right padding of the images on the top of my blog.(Mobile only) I have four blogs in total on my website but I want this modification to only effect two blogs. (https://www.thecigarbible.com/en/newsblog) and (https://www.thecigarbible.com/de/newsblog) I am using the following code to adjust other padding settings on website primarily the homepage: I am facing the complication that when I change the following code, padding is added to both text and images in the blog. I only want to remove the padding on the top image and not the text. If somebody could help or point me in the right direction that would be amazing!
  22. Hi, my website is www.thecigarbible.com On the mobile website I want to remove all left, right and top padding on the image blocks containing the text "Newsfeed" and the one with "Cigar of the month", so that the image block has no padding top, left and right of the mobile screen. I have tried several different options posted on the forum herea but none seem to work right. I am either left with padding at the top, some small padding either left or right or other content blocks on my website are effected. I am using the template: Brine. I would really appreciate some help.
  23. Hi, Is there a way to have just a certain amount of block(s) shown in mobile function that are normally shown on Desktop?
  24. Hello Everyone ! I am reaching out because I am a bit stuck on some little coding tweak. I already went through the forum but the answers I found do not really work. Here is my issue: I have the pro version of Squarespace which allow me coding. I have a website (Brine template) with an english/french version and on both version I created a event calendar page. In order to have my logo color to pop-out and keep up with my branding / visual identity, I added a green background to that calendar page. Desktop / Tablet version: It's looking good as a small image is displayed on the day I m running a class/event. Mobile version: There is no image displayed, fair enough, however with that green color, I cannot really see the days there is an event. My idea is to: When there is an event schedule I want to change the color of the square from that weird light green color to a gold color, numbers would be in white. So on the mobile version, an event would be displayed like that : The entire square would be gold & the date displayed in white. What code shall I insert ? Shall I insert it in the advance option custom css of my page? Here are some pictures of the calendar on the desktop & mobile. Here is the link to my website www.qualitycupofcoffee.com PS: Don't mind, I have been working on it on the last few days, the videos banners seems to be loading slower than usual. I still need to have a look at it. Many thanks ! Manon
  25. Hi there, I am building a website for a client and they have asked that the gallery grid lightbox 'X' is darker and the left and right arrows are darker and are visible all the time (rather than only on hover). I have scoured the forum and can't seem to find a code that works for the site. The template is Foster. The website is https://apricot-frog-pc6a.squarespace.com Password: lynne.2019 An example of this can be viewed on any of the pages under 'work'. Any help would be greatly received! Many thanks, Hannah
×
×
  • Create New...