Jump to content

Nick_SquareKicker

Circle Member
  • Posts

    276
  • Joined

  • Last visited

  • Days Won

    1

Everything posted by Nick_SquareKicker

  1. Hi @moonlitdesign, You can Enable Horizontal Scroll on mobile with SquareKicker using the Toggle in the tool settings "Mobile Devices" See Screenshot below. It's not on by default because normally there is too much content in the section to all fit on a mobile device and content gets cut off on smaller devices so you may want to reduce the content if you want to enable horizontal scrolling on mobile. It looks like the space you are describing is caused by extra rows in the Fluid Engine Grid. You can use Squarespace's Mobile Edit mode to reduce these rows. The rows of a section is one of the only section settings that is unique to mobile and desktop. If you need further help you can reach out to support@squarekicker.com
  2. Just happy to help. I've been there more times then I can count. Writing code in Squarespace can be so nice and easy, but when things don't work, debugging them can be a pain and you just loose hours of productivity in the end. It's where the idea of SquareKicker came from, because I was sure I wasn't the only one who wished there was and easier way to build custom websites that would free me from technical issues and allow me to stay focused on the design and creativity.
  3. Hi @goosbumps, I've got your DM asking for some help. I've had a look at your site and it just looks like you are missing a closing </style> tag at the end of your CSS in your Footer. Without this, your SQSP code is breaking the SVG's on your site. You could move your CSS to your Custom CSS area so you don't need opening and closing style tags and just leave your Scripts in your Footer. FYI - To reduce your code, you could do most of what your custom code is doing with SquareKicker then you won't have to worry about broken code messing up your site: ie SquareKicker can hide your Social Icons in you overlay menu per screen size, has a built in Back to Top Button, hover animations, etc.
  4. Hi @baileyrl48, SquareKicker only works for Squarespace 7.1 but works on both Classic and Fluid Engine. Now that there is a 7.0 -> 7.1 migration tool, you can migrate your site to 7.1 and install SquareKicker! Check out this helpful video here:
  5. Hi @CliftonRhoad, Have you tried SquareKicker Sticky Blocks? https://www.squarekicker.com/letsmakethis/no-code-sticky-blocks
  6. Hi @REARCH, I've had a look at your site and all of SquareKicker has been removed. Also, it looks like there is some weird styling on your H2 and H4 text with 1200px Margin Left (See Screenshot). If this is removed, it fixes this issue. This is not SquareKicker code, but would happy to help have a look at what is causing this for you, but would need admin access to your site sent to support@squarekicker.com.
  7. Hi @freshlypressed, you can use SquareKicker for this. Great when you want to keep your background banner images or videos with background image effects etc and then overlap a block over another section. See instructions below. In Fluid Engine: 1.) Make the Section Content align to the bottom with Fluid Engine first so you do not have to move it past the Section padding or remove the Section "Fill Screen" to remove the section padding. 2.) Next use the SquareKicker Section Tool to adjust the "Layer Level" to 1. You will need this to adjust the z-index of the section to make sure the image does not get cropped when you move it down. 3.) Lastly move the image block to the bottom of the section and use the SquareKicker position tool to move the image block down. SquareKicker > Position > Vertical. Note: this is automatically set to 0 on mobile devices so you don't need to set a device specific code, but you can micro manage this per devices with SquareKicker. Once you are done, if you don't need to make anymore changes you can cancel SquareKicker and all your saved custom code changes will save forever without an on going subscription. Here is a video showing the Position tool in use.
  8. If you have any broken code in your header this will break your site. Sounds like you accidentally deleted some SK code which will in return have a ripple affects for any code below this site. If you remove all SK’s code and reinstall, SK will rebuild your Saved changes from backup. Thanks for your help @creedon!
  9. SquareKicker gives you the tools to take your Squarespace website to the next level... but sometimes you just need a little inspiration to get your ideas flowing. Here are some of the very best examples of Squarespace Websites to show you just how far you can take your designs with SquareKicker. SEE ALL INSPIRING SQUARESPACE WEBSITE EXAMPLES https://www.squarekicker.com/inspiring-squarespace-website-examples Posting New Websites Every Week!
  10. Hi @44degreesnorth, Something like this looks like a scrolling slideshow. This is not possible with SquareKicker yet, but this is on our roadmap. I recommend using Squarespace's Auto Layout Section. It will be very close to this.
  11. Have you tried Fluid Engine? Within a Fluid Engine Section you can place and resize images (or any block) specifically for mobile or desktop. This gives you the ability to do exactly what your describing natively in Squarespace without using custom code.
  12. @PaulllGlad to hear. Will be look forward to adding this as a SquareKicker Tool in the future. 😉 Try changing control=1 to controls=0
  13. Hi @JoelleM, Youtube and Vimeo have deference parameters and need different code which is why highlight the code for both. Youtube auto playing videos need a “playlist” and in the playlist you have put the same ID as your video. See the example of a YouTube embedded code with a playlist. Notice the playlist ID. You will want to add the below changes to your code. <iframe src="https://www.youtube.com/embed/6LVyy7LeC5Y?rel=0&playlist=6LVyy7LeC5Y&autoplay=1&mute=1&controls=1&loop=1" frameborder="0" allow="accelerometer; " allowfullscreen></iframe>
  14. Are you still having an issue with this? It seems to be working on Mobile and Desktop. I see you have hidden the auto play video on mobile, but this looks intentional, but works fine. Feel free to DM me if you still having issues.
  15. All fixed. You just had an extra / in your custom code about this CSS. Have fun 🙂
  16. Without seeing your site, it looks like you have a syntax error at line 67. The Custom CSS on the screen is right, so it's probably a bit of broken code above this code in the first 64 lines, or you perhaps your pasted this in the middle of some other CSS code ... or pasted over something and removed a closing bracket? Maybe you can paste all your custom CSS here so I can see what bit of your code is broken, of feel free to invite me as a admin contributor and I can have a look for you. support@squarekicker.com
  17. <iframe src="https://player.vimeo.com/video/625215456?autoplay=1&loop=1&autopause=0&background=1&muted=1&color=ffffff&controls=0&portrait=0" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe> The code above has control hidden with “controls=0”. Remove this or change to “controls=1” Same thing for muted as well if you want audio. muted=0 or muted=1 A full list of Vimeo video parameters can be found here. https://vimeo.zendesk.com/hc/en-us/articles/360001494447-Player-parameters-overview
  18. Just guessing, but the Vimeo URL looks like it has an extra set of numbers which usually means that the embed settings need permission??? See below example:
  19. Just an update on the above method. Squarespace has removed the <> feature on video blocks to add iframe's the url to make video blocks autoplay. So you need to use an embed block, but you also need some extra CSS to make the video iframe fill the block nicely. Method and code added at below post:
  20. @PeeCee If you still need some help, check out this post for making autoplay iframe videos in embed blocks.
  21. @Ramish You need to contain the width and height of your video inside an embed block. I have posted a method for doing this using a embed block with your iframe here:
  22. UPDATE: SQUARESPACE HAS REMOVED THE EMBED "<>" FEATURE FOR ADDING IFRAME IN VIDEO BLOCKS. THIS MEANS THAT YOU NEED TO USE A EMBDED BLOCK INSTEAD. HOWEVER, YOU ALSO NEED THE BELOW CSS ADDED TO YOUR CUSTOM CSS AREA TO MAKE THE IFRAME FILL THE EMBED BLOCKS. I have specified this code with this new method here in this post:
  23. SQUARESPACE HAS REMOVED THE EMBED "<>" FEATURE FOR ADDING IFRAME IN VIDEO BLOCKS. THIS MEANS THAT YOU NEED TO USE A EMBDED BLOCK INSTEAD. HOWEVER, YOU ALSO NEED THE BELOW CSS ADDED TO YOUR CUSTOM CSS AREA TO MAKE THE IFRAME FILL THE EMBED BLOCKS. The below screenshot is a youtube iframe embed code in an embed block. The embed block on the left is a iframe without CSS , the embed block on the right is an iframe with the necessary css. Embed Block Iframe Code: Youtube Example: <iframe src="https://www.youtube.com/embed/_OuUbl_WKZU?playlist=_OuUbl_WKZU&autoplay=1&mute=1&controls=0&loop=1" frameborder="0" allow="accelerometer; " allowfullscreen></iframe> Embed Block Iframe Code: Vimeo Example: <iframe src="https://player.vimeo.com/video/625215456?autoplay=1&loop=1&autopause=0&background=1&muted=1&color=ffffff&controls=0&portrait=0" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe> CUSTOM CSS NEEDED (Custom CSS Area) // Embed Block for Video #siteWrapper .embed-block { aspect-ratio: 16/9 ; margin: 17px; padding: 0px !important; iframe { position: absolute; width: 100%; height: 100%; } &:first-child, &:last-child { padding: 0px !important; } }
  24. Hi @rebeccagracedesigns, I've gotten a few customer support tickets from SquareKicker customers complaining about Squarespace not working because the SK UI keeps closing. I found this code above was the issue and after searching google for it, it lead me here. Because it initiates a "Click" every 3-5 seconds, when in EDIT MODE when you open something on Squarespace, (SQSP UI or even Add Section) 3 seconds later it closes. This is because the code above is simulating a click on the screen which force closes the UI. It also should only be in the header injection of a page with a carousel NOT the footer, otherwise your websites console triggers an error every 3 seconds, which is not great for SEO or performance. This code really needs to be wrapped in "Do not run this if the page is in Edit Mode." See code update below: NOTE: For Squarespace 7.1 (untested on 7.0) <script> if $( 'body.sqs-edit-mode-active').length ) { window.onload = function() { var nextArrow = document.querySelector(".summary-carousel-pager-next"); function clickNext() { nextArrow.click(); } setInterval(clickNext, 3000); }; } </script>
×
×
  • 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.