In Task 88 – WordPress Custom Theme Development from Scratch in Urdu – Hindi (Coding Phase) under #WPSpartans300 Mission, we learnt to create Flexslider.
We also added custom classes to Bootstrap buttons etc. We also talked about Photoshop Slider Image Size along with a custom logo for fictional Spartans University.
We learnt how to add custom classes in html to override default Bootstrap colors and styles. First of all:
1) We downloaded jQuery Plugin Flexslider 2 from woothemes.com official site. You can also download it from Github.
2) We extracted downloaded folder and talked about files and fonts.
4) We removed a couple errors from Google Chrome’s Dev Tools.
5) We learnt how to download images from Pixabay and how to create slider document in Adobe Photoshop with specific width and height. Then I demonstrated how to create custom logo with the help of Pen Tool in 5 minutes.
6) We added Flexslider html structure and styles and js snippet in custom.js.
7) It’s responsive slider. WordPress has wonderful responsive slider plugins, but we’ll reach there. Developers must know how to convert any jQuery opensource plugin to WordPress.
8) Then we prepared html pages and linked them with index.
10) We also learnt how to add home icon to home.
Hello, this is Farooq, and I’m online for my #Spartans. #WPSpartans300 Mission is my passion, and I won’t let you down.
Keep on learning. Keep on earning via Upwork, Fiverr etc.
Freelance Pakistan’s Official Website:
Responsive Grid System