EYMOW Posted November 23, 2020 Share Posted November 23, 2020 Hi, I have been building my site for a few months and am now in the final stages before launch. In testing to see how the page responds on other computers/displays, I noticed that a custom code for rotating words that I have on the homepage displays in variable form because the code unfortunately does not let me center the words and have them auto adjust to all displays/browsers. I came across this code here: https://codepen.io/kenwestphal/pen/xqRZYZ to be used for the same purpose, but when I insert it into my site, it does not work how it should (The words do not rotate. They simply appear with a slight bounce but does not proceed to display the following words written) Can anyone tell me what needs to be adjusted in order for it to properly work on 7.1? This is exactly what I need and is the closest thing I have found for my site. I am not very good nor familiar with coding, so any help is more than appreciated. Thanks! Link to comment
IXStudio Posted November 24, 2020 Share Posted November 24, 2020 Hi, Please share your website URL and also check this free extension to build Typewriter without coding! Feel free to ask me if you have a question! Please use the like button if it helps you! Best, Leopold Ninja Kit Extension: Upgrade your Squarespace website without coding.YouTube Preview - FREE DOWNLOAD Link to comment
EYMOW Posted November 24, 2020 Author Share Posted November 24, 2020 Hey, Thank you for the extension! Will check it out and see how it works for the site. Here is the link to my site: https://copper-alpaca-se6n.squarespace.com/ (Password: thorncliffepark) On the home page, the rotating words just below the nav is what i am referring to. I just want it to be centred, but I am open to changing the styling/code to make it work. Thanks for your help! Link to comment
EYMOW Posted November 24, 2020 Author Share Posted November 24, 2020 6 hours ago, IXStudio said: Hi, Please share your website URL and also check this free extension to build Typewriter without coding! Feel free to ask me if you have a question! Please use the like button if it helps you! Best, Leopold Also, I am trying to use the extension and I have followed the same inputs as shown in your Youtube video, but it does not animate for me. I am not sure why. Link to comment
IXStudio Posted November 25, 2020 Share Posted November 25, 2020 Did you follow these steps? And this is the CSS code to center your current text rotator. Use this code in Design -> Custom CSS #block-yui_3_17_2_1_1598542012293_13341 h1.preFade.fadeIn { text-align: center; width: fit-content; display: flex; } .rotating-words.rotating-words-1 { display: flex; width: 313px; } #block-yui_3_17_2_1_1598542012293_13341 .sqs-block-content { width: max-content; justify-content: center; display: flex; align-items: center; text-align: center; margin: 0 auto; } Please use the like button if it helps you! Best, Leopold EYMOW and tuanphan 1 1 Ninja Kit Extension: Upgrade your Squarespace website without coding.YouTube Preview - FREE DOWNLOAD Link to comment
Max098 Posted August 7, 2022 Share Posted August 7, 2022 (edited) Hello! I am looking to add a rotating word in my header. Does anyone know what code I would use for this? Edited August 7, 2022 by Max098 Link to comment
Max098 Posted August 7, 2022 Share Posted August 7, 2022 Hi there! I was wondering if you would be willing to share the code you used for the scrolling words on your website here? https://copper-alpaca-se6n.squarespace.com I am looking to do something similar in my header. Thank you so much! Link to comment
tuanphan Posted August 10, 2022 Share Posted August 10, 2022 On 8/7/2022 at 7:19 PM, Max098 said: Hi there! I was wondering if you would be willing to share the code you used for the scrolling words on your website here? https://copper-alpaca-se6n.squarespace.com I am looking to do something similar in my header. Thank you so much! Hi. How about this code? https://codepen.io/Rathijit/pen/EbQqPd Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
jojod Posted October 10, 2022 Share Posted October 10, 2022 @tuanphan Have you been able to get that code to work? (Re: https://codepen.io/Rathijit/pen/EbQqPd) I've tried and it doesn't animate - it only bounces once and then nothing.... Link to comment
jojod Posted October 10, 2022 Share Posted October 10, 2022 I've been trying to get this one to work on my 7.1 FE site and it won't.... https://codepen.io/kenwestphal/pen/xqRZYZ Link to comment
tuanphan Posted October 12, 2022 Share Posted October 12, 2022 On 10/11/2022 at 4:27 AM, jojod said: @tuanphan Have you been able to get that code to work? (Re: https://codepen.io/Rathijit/pen/EbQqPd) I've tried and it doesn't animate - it only bounces once and then nothing.... That CodePen uses LESS, you will need to compile it to CSS first. Also, the Codepen use jQuery code, not JavaScript, you will need to declare jQuery library Which exact code did you add? & Link to page where you added the code? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) 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