- 7
- 33 673
Abdulsalam Abdulsalam
เข้าร่วมเมื่อ 31 ม.ค. 2015
Contents on building Saas startups and no code
Framer Landing Page Roast
Dev Tools Roasted Episode 1: Roasting Dev Tools Landing Pages If you want your website to be roasted on the next episode, Comment your website URL below! 👇
มุมมอง: 112
วีดีโอ
How to create a preloader screen in framer II
มุมมอง 3992 หลายเดือนก่อน
To follow along this tutorial, use the link below to remix framer.com/projects/new?duplicate=UvIGK2d3M7SUx2yts21r&via=tola_io To view final result click link below many-development-226226.framer.app/ If you’re new to framer get started with framer using my affiliate link www.framer.com/?via=tola_io If you need my my service (Framer expertise, development or any issues need fixing or even a whol...
HOW TO CREATE A COPY MAIL BUTTON
มุมมอง 1.5K9 หลายเดือนก่อน
Remix link: framer.com/projects/new?duplicate=xarV44DWfqlTFpHhHHJO If you’re new to framer you can start from here: www.framer.com/?via=tola_io
How to create preloader screen in framer
มุมมอง 17Kปีที่แล้ว
To follow along this tutorial, use the link below to remix framer.com/projects/new?duplicate=vnnTx7RHLiQ7vB4jfNtF To view final result click link below framer.com/projects/new?duplicate=we837zHXC3T1A37WxwjD If you’re new to framer get started with framer using my affiliate link www.framer.com/?via=tola_io
How to create overlapping parallax card effect in framer
มุมมอง 5Kปีที่แล้ว
You can use this effect in your personal work, note the followings Always set overflow to visible Give stacks sticky position and add position top to it. You can follow along with the tutorial by remixing the design framer.com/projects/new?duplicate=StrAeR8b5eU7KazQxUBX Final result framer.com/projects/new?duplicate=8Msv8kJY0G3MVdIje8AA If you’ve never used framer before get started using my af...
How to integrate mailchimp with framer - Framer Tutorial
มุมมอง 9Kปีที่แล้ว
Mailchimp can be used to capture emails to be used for contact, marketing, or product update, learn how to integrate mailchimp with framer Try framer using my affiliate link below www.framer.com?via=tola_io Use this link to go to the mailchimp landing page mailchimp.com/guesswork/?
Very helpfull thank you brother
👋 Open to work, if you're looking for a framer expert, or you need a landing page, web app designed, Book a Call → cal.com/abdulsalam-abdulsalam-zicnh8/60-min?duration=60&date=2024-09-30&month=2024-09
👋 Open to work, if you're looking for a framer expert, or you need a landing page, web app designed, Book a Call → cal.com/abdulsalam-abdulsalam-zicnh8/60-min
👋 Open to work, if you're looking for a framer expert, or you need a landing page, web app designed, Book a Call → cal.com/abdulsalam-abdulsalam-zicnh8/60-min
thanks
DUDEEEE THAT'S SO SIMPLE AND AMAZING!!!! THX A LOT
Very confusing and slow tutorial
‼I have made a part 2 to this video and resolved your problems sorry it took longth-cam.com/video/PIGPA6JdOrk/w-d-xo.html
great work thank you
whenever i try to add a preloader screen it doesnt let me press buttons. its like an overlay that doesnt let me press anything or interact with anything. u know how to fix this?
th-cam.com/video/PIGPA6JdOrk/w-d-xo.html
This is not how you create a preloader, as the component still remains at the top of the Z Index when invisible. The opacity slider does not remove user interaction, so your tutorial is only going to make every button on the website completely unusable.
th-cam.com/video/PIGPA6JdOrk/w-d-xo.html
Quite helpful. Thanks!
Hey! Thanks for the explanation! But I have a question about if there is any way to block site from scrolling down while there is a preloader screen? Hope this question would be useful for others as well. Thanks a lot again!
Hey, you can add some code to the site to prevent scrolling beyond a certain timeframe: 1. Put this into the start of the <head> tag: <style> body { overflow: hidden; } </style> 2. Put this into the start of the <body> tag: <script> setTimeout(function() { document.body.style.overflow = 'auto'; }, 3500); // Your loading transition's length in miliseconds. </script> 3. Where it states "3500", you may alter this value to the appropriate time frame for the animation.
all black top left only thing shown underground symbol
Thank you so much bro!
Hi, I used this loader on my website. Please help me with when I go to another screen from the Nav bar and come back to my Homepage, I see the loader every time. I just want this loader once when I open the website for the first and not whenever I come to Homepage.
send a remix to this email let me take a look at it tollaabs@gmail.com
I had the same issue while copying, been struggling with it for days only to find out that we both had the same issue while copying, it was so hilarious
Hey man, what about the Scroll? How to lock it?
The way to preload isn't real preloader. This is nothing but a draft of tric for reviewing stakeholder.
Thank you. Big help 👍
You are a crack bro 💥
Hey Man, The sign-up button is not redirecting to the NEXT page for Some reason in the browser, but it works when Previewed in Framer…. How do I do it????
Did it show the success message?
@@Tola_io Ohh I figured it out bro Thanks for the Video 😊
Love you my brother, needed your instructions and guidance on this feature . Thank you so much 🙏
thank you! im going to try it out.
tutorial is good but can't hear you properly, increase your volume
but if its set to fixed, it not gonna be responsive
Use constraints to make it responsive, set constraints to 0 on both sides
Hey man, Thank you so much for sharing this! It works perfectly. Quick question for you: is there a way to ensure the preloader only loads once during the initial website visit? Ideally, after that, the animation would be stored in the user's cache, negating the need for the preloader in subsequent visits. Cheers
Hey men, I am looking for the same as you, its called a SessionKey (as long as you have the tab not closed), but i dont know how to solve that Problem in Framer. Did you find out in the Meantime? Thanks alot mate!
it works but it its afecting my hover effects, and links cannot be clicked
afer doing everything he said please remember to set the style of the pre loader component "pointer event to none". this way it doesn't affect your hovers and link
Try setting pointer event to none for the preloader frame
thank you so much@@yellowtheslayer8759
you can still scroll through the page tho..
How to fade a preloader out through the top?
Not sure I understand but I think the solution if your buttons are not clickable due to the high Z index of the preloader from then you can set the pointer event of the preloader screen to none
awe bru💥
JESUS LOVES YOU
very useful. please do more framer video. thank you so much.
PLease how can I create pop up form on framer?
I appreciate the information you are giving but just a suggestion. Please increase your microphone volume based on how low your voice projects. Thank you!
can I use other services? does framer support that?
Yeah, but there’s more and this video is little bit outdated
@@Tola_io Does This Method STILL works ? Can I get Lead's Details ? If they enter ? Also an Updated Video On This Will help..
@@mrkaran3949 sure looking forward to it
Hello, I think the remix link is incorrect
its empty. Put the correct file
Hi and thank you for this tutorial g! I was able to create the loading screen but when it disappears, I cannot click on the content underneath. Is there a way to bypass this? Thank you
same problem here.
Set the second loarder variant visibility to "No" instead of lowering it's opacity. This will remove the entire element from the page after the animation; giving you access to the elements underneath.
My elements on the home screen comes with effects but due to the loader i can't view the effect hope you understand what I'm saying and how can i solve that@@clarancefarley6822
This is not working the variant 2 opacity is 0 but the z index is still high so it’s still there above every other thing on the page so, nothing underneath is clickable
Turn the pointer events none
@@iynfraga1 thank you mate! It works
you saved my life@@iynfraga1
@@iynfraga1 how do I do that?
Thanks plz make a video on how to add blogging page on framer
Searching for this. Awesome. thanks for sharing this. upload more tutorial for framer
Hi and thank you for this tutorial g! I was able to create the loading screen but when it disappears, I cannot click on the content underneath. Is there a way to bypass this? Thank you
I had the same problem and found the solution: On the homepage you click on the preloader layer and go to styles, add "pointer events" and select "none", that should do the trick. Hope it works!
@@gispertnuria You're an amazing person. Just so you know !
@@gispertnuria Thanks buddy
@@gispertnuria You, my friend, deserve a Nobel prize for this.
Was looking for something just like this, awesome work man
Thanks a lot, glad you loved it
Thanks for the tutorial, really helpful! Do you known if it's possible to add tags to the embed form? Or maybe create multiple mailchimp forms for different tags? Thanks
Yeah it’s possible, you need to create a new tag in the “embedded form builder”
I've tried this with some extra form fields. Doesn't work
If you want extra form field, copy all the codes and drag an embed component in your framer then add the code
Thanks, man. But i noticed that if we have more fields than only email. Than better to use embed code and put it as embed code in framer. Thanks a lot, man!
Yeah tried this out as well, and the code is customizable
Thank you g
Hey! I noticed you're interested in Dan Koe Style Animations. I reached out to you because I thought you'd be interested in the course I'm developing for how to create these Dan Koe Style Animations and the behind-the-scenes videos I've uploaded on my TH-cam, if you're interested :) I hope you find this helpful :D
Thank you so much! very clear and easy to follow explanation.