Тёмный

Animate Text On Your Squarespace Website (Updated Version) 

Rebecca Grace Designs - Squarespace Coding Expert
Подписаться 4,8 тыс.
Просмотров 16 тыс.
50% 1

Опубликовано:

 

23 окт 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 41   
@RebeccaGraceDesigns
@RebeccaGraceDesigns 4 года назад
For more tips and tricks on customizing your Squarespace Website join my Squarespace Tips and Tricks Community 👉 www.rebeccagracedesigns.com/squarespace-tips-and-tricks
@ezekieldarian8421
@ezekieldarian8421 3 года назад
InstaBlaster...
@brialashae5126
@brialashae5126 3 месяца назад
Hello! Thank you for this tutorial! I'm having a slight hiccup. The animation works when I am in editing mode, but when I save or just check the website on any browser, the animation does not work. Do you happen to know why this is happening?
@umwmedia-web-development
@umwmedia-web-development 2 года назад
Great video for animate text on squarespace websites.
@RebeccaGraceDesigns
@RebeccaGraceDesigns 2 года назад
Glad it was helpful!
@dominickwhite4007
@dominickwhite4007 3 года назад
Hello, could an animation be created where the text pops out and shakes from side to side? Sort of like being frightened...have something I'm working on something this could really help
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
That is definitely possible but I don't believe it is one of the options available within Justin's code. I would be happy to help on a 1:1 Help Session. You can find out more and book a call time at www.rebeccagracedesigns.com/coaching
@barbarakirchheimer7754
@barbarakirchheimer7754 Год назад
Hi Rebecca, thank you for this! I wanted to ask you, I have a second line of text animated in the first section, the first line animation load without scrolling but for the second line I have to scroll down a bit for it to load, is it possible to load both lines at the same time? Thanks a lot!
@RebeccaGraceDesigns
@RebeccaGraceDesigns Год назад
You can adjust the height at which is loads without scrolling by changing the 400.
@kesliebido9834
@kesliebido9834 8 месяцев назад
how to change the font color from black while using these codes?
@sarahschulz1246
@sarahschulz1246 2 года назад
Is it possible to use only CSS to animate without Code Injection (advanced version)? :) Thanks
@RebeccaGraceDesigns
@RebeccaGraceDesigns 2 года назад
Yes, you can use block ids instead of adding your own classes.
@hryde1
@hryde1 3 года назад
Is there a way to animate more than one word? For example, can you animate a word to fade in, then that fades out and a new word will fade in and so on?.So you can essentially communicate a list of words through one animation?
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
This is possible but you would need different code than is provided here. I would be happy to help during a 1:1 Help Session. You can find out more that www.rebeccagracedesigns.com/coaching
@saramcbeen8928
@saramcbeen8928 3 года назад
Thank you for this tutorial! Is it possible to share the code for if you want the text to be bold? Thanks!
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
the css property for bold text is font-weight. So you would add font-weight: 700; in between the brackets.
@jessiecarvalho4302
@jessiecarvalho4302 3 года назад
Worked like a charm, thank you
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
You're welcome!
@julienroussel7606
@julienroussel7606 3 года назад
Great tutorial. Thanks!
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
You're welcome!
@nicknytz2491
@nicknytz2491 3 года назад
Hi Rebecca, Great tutorial!
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
Glad it was helpful!
@Sequence001
@Sequence001 4 года назад
How Can you apply this code to a button/link? I have the Hayden style template but It doesn't provide an actual option to add code option. Any Help?
@RebeccaGraceDesigns
@RebeccaGraceDesigns 4 года назад
You would follow the same steps but instead of using a tag you would have to add code for a button. I would be happy to help you with this during a 1:1 Help Session. You can find out more at www.rebeccagacedesigns.com/coaching
@konaing2827
@konaing2827 3 года назад
Hi! the link u supported from Justin Aguilar's website is not work anymore. But I downloaded it from his github. thanks anyway.
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
Thank you for letting me know. The link still works but it looks like he doesn't have an SSL Certificate so his site is listed as "not secure".
@marisaglasercreative
@marisaglasercreative 3 года назад
Hmm so I followed the steps to a T, I wanted some text to fadeIn, but instead of fading it's sliding in from the left? I used the "fadeIn" code, not the one you used. hmmm
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
Interesting... well it sounds like the code is working but the wrong animation is going. I would try the animation part of the code again.
@ryanchabot5629
@ryanchabot5629 4 года назад
How would you make the animated text bold or increase the weight?
@ryanchabot5629
@ryanchabot5629 4 года назад
I got the html to work for making the font bold, was a simple error, but I used the pulse animated, and it usually works great, but sometimes creates a border box around the text and pulses or animates the text box and not the text or font.
@RebeccaGraceDesigns
@RebeccaGraceDesigns 4 года назад
It could be that you are using the incorrect selector. I have also noticed that sometimes it does this in the Squarespace Editor but is fine on the Live Site.
@ryanchabot5629
@ryanchabot5629 4 года назад
@@RebeccaGraceDesigns you are correct, it just does it in the editor, but not on the live site. FYI for people, I also adjusted the pulse animation to start at size (1) rather then (.9) so the animation doesn't start off like a lag if the screen is scrolling when the animation begins. It's much smoother.
@lukewulsin641
@lukewulsin641 2 года назад
I got it to show up for slideDown and slideRight, but weirdly nothing is showing up for stretchRight. Anyone else having this issue?
@RebeccaGraceDesigns
@RebeccaGraceDesigns 2 года назад
I would be happy to help during a 1:1 Help Session. You can find out more and book a call time at www.rebeccahgracedesigns.com/coaching
@xhellerx
@xhellerx 2 года назад
it fails when you add the visibility hidden code...if you remove that it works...not sure why that's the case but yea...
@romuluscreative
@romuluscreative 3 года назад
not working for me at all.. does this work with 7.1 and 7.0?
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
Yes, this works on both versions. I would be happy to help during a 1:1 Help Session. You can find out more that www.rebeccagracedesigns.com/coaching
@kellsiedomnitz4904
@kellsiedomnitz4904 3 года назад
This isn't working for me, I can't figure out where I am going wrong. I've watched the video 3 times now, I am trying to do a pulse animated effect. HALP lol
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
Hello Kellsie! I would be happy to help you during a 1:1 Help Session! You can find out more and book a call time at www.rebeccagracedesigns.com/coaching
@dannyboy2499
@dannyboy2499 3 года назад
yo becca you kinda clutch tho
@RebeccaGraceDesigns
@RebeccaGraceDesigns 3 года назад
Thank you! Glad to help!
Далее
Resize Images for Mobile | Squarespace 7.1
9:45
Просмотров 22 тыс.
Тупой и ещё тупее. (и поддоны)
00:37
aespa 에스파 'Whiplash' MV
03:11
Просмотров 30 млн
How to Make an Animated Logo on Hover Squarespace
7:30