Before you start: a short teaching 🧠 lesson
If you have only little experience with the integration of JavaScript libraries, which are supplemented by a CSS file like Swiper, you should read this Twitter Thread carefully.
You need to understand that if you include Swiper's CSS file in your project (which I recommend if you have only a moderate understanding of CSS) AND you use Swiper's suggested classes for the elements such as ".swiper-button-prev", your CSS styles will be overwritten and possibly extended for that element.
So if you use the Swiper suggested class for all Swiper related elements, you have to overwrite them with custom CSS if they don't look the way you want on the live page.
Swiper Simple Starter 1
Swiper Simple Starter 2
Custom Pagination Swiper
Swiper with Scrollbar
Swiper Build-In Animation
Swiper Tabs 1
Swiper Tabs 2
Modal Gallery Swiper
Gallery Swiper
Swiper in Rich Text
Greetings, dear readers!
Today, we're going to talk about why you should never, ever, ever piss off a designer or developer who's creating something for you.
The Importance of Designers
Let's start with designers. Now, these creative souls are the ones responsible for making your website look pretty, your flyers look snazzy, and your logo look professional. They spend countless hours coming up with the perfect color palette, typography, and layout to make sure that everything looks just right. So, when you start nitpicking about every little detail or constantly changing your mind, you're not just wasting their time - you're also insulting their hard work.
🔽🔽🔽🔽🔽🔽🔽🔽🔽🔽
{{swiper="10"}}
🔼🔼🔼🔼🔼🔼🔼🔼🔼🔼
The Importance of Developers
And let's not forget developers. These are the tech wizards who make your website come to life. They're the ones responsible for making sure that everything works properly and that your website runs smoothly. When you start demanding unrealistic features or constantly changing the requirements, you're not just frustrating them - you're also making their job a lot harder.
The Expertise of Designers and Developers
While designers and developers are certainly there to bring your vision to life, it's important to remember that they're also experts in their field. They know what works and what doesn't, and if they're telling you that something won't work or won't look good, it's probably best to listen to them.
The Consequences of Pissing Off a Designer or Developer
So, what happens if you do manage to piss off a designer or developer? Well, let's just say that you don't want to find out. They might start secretly adding in little Easter eggs (read: bugs) to your website, or they might make your logo a little bit... questionable. And while it might be tempting to just fire them and move on, remember that finding a new designer or developer will take time and money - and who knows if they'll be any better?
Conclusion
In conclusion, the next time you're working with a designer or developer, remember to treat them with respect. Listen to their advice, trust their expertise, and don't be a pain in the you-know-what. Trust me, it'll be worth it in the long run.
How to start
1. Clone this project
Before you can copy and paste elements from this project into your project, you must first clone this project in Made in Webflow.
2. Copy and paste / rebuild the slider you want to integrate into your project
Each complete component is wrapped in an Element with the class name ⚡component .
If you want to rebuild a complete slider component instead of copying it, note the attributes set on corresponding elements such as slider_component, swiper, swiper-button, swiper-pagination, swiper-scrollbar and so on.
Yes, you can also build all sliders static and you don't have to use them with the CMS.
3. Style the slider and associated elements
Customise the content and look of your sliders and related elements the way you want them to look. But as mentioned above, you should understand how Webflow generates your page and how you can style the elements. As a reminder, please read the thread on Twitter about this.
4. Copy and paste the Code from the HTML file to your project
In the HTML file for each slider, which you receive for your support on Patreon or via Lemon Squeezy, you will find everything that gives the components their function. Open these files with a code editor or in a browser and look at the source code. Follow the comments in the file and add the corresponding codes to your project.
5. Adjust the functions of the slider if desired
If you want to customise the slider code and find out what is possible, I strongly recommend you to have a look at the Swiper documentation.