# Landing Page Assets Setup ## Overview Folder ini berisi assets untuk landing page SODAKDesa yang menggunakan template iLanding Bootstrap. ## Struktur Folder ``` public/assets/landing/assets/ ├── css/ │ └── main.css # CSS utama (placeholder) ├── js/ │ └── main.js # JavaScript utama (placeholder) ├── vendor/ # Vendor libraries (perlu di-download) │ ├── bootstrap/ │ ├── aos/ │ ├── glightbox/ │ ├── swiper/ │ └── purecounter/ └── img/ # Images (perlu di-copy dari template) ├── clients/ ├── testimonials/ └── various images... ``` ## Setup Instructions ### 1. Download Template Assets Anda perlu mengunduh template iLanding Bootstrap dari: - **Template URL**: https://bootstrapmade.com/ilanding-bootstrap-landing-page-template/ - **License**: https://bootstrapmade.com/license/ ### 2. Copy Assets Setelah mengunduh template, copy file-file berikut: #### CSS Files ```bash # Copy dari template ke folder ini cp template/css/main.css public/assets/landing/assets/css/ ``` #### JavaScript Files ```bash # Copy dari template ke folder ini cp template/js/main.js public/assets/landing/assets/js/ ``` #### Vendor Libraries ```bash # Copy vendor libraries cp -r template/vendor/* public/assets/landing/assets/vendor/ ``` #### Images ```bash # Copy images cp -r template/img/* public/assets/landing/assets/img/ ``` ### 3. Vendor Libraries yang Diperlukan - **Bootstrap 5.3.3**: https://getbootstrap.com/ - **Bootstrap Icons**: https://icons.getbootstrap.com/ - **AOS (Animate On Scroll)**: https://michalsnik.github.io/aos/ - **GLightbox**: https://biati-digital.github.io/glightbox/ - **Swiper**: https://swiperjs.com/ - **PureCounter**: https://github.com/srexi/purecounterjs ### 4. Alternative: Download Manual Jika tidak ingin mengunduh template lengkap, Anda bisa mengunduh library secara manual: #### Bootstrap ```bash # Download Bootstrap CSS dan JS wget https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css -O public/assets/landing/assets/vendor/bootstrap/css/bootstrap.min.css wget https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js -O public/assets/landing/assets/vendor/bootstrap/js/bootstrap.bundle.min.js ``` #### Bootstrap Icons ```bash # Download Bootstrap Icons CSS wget https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css -O public/assets/landing/assets/vendor/bootstrap-icons/bootstrap-icons.css ``` #### AOS ```bash # Download AOS CSS dan JS wget https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.css -O public/assets/landing/assets/vendor/aos/aos.css wget https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.js -O public/assets/landing/assets/vendor/aos/aos.js ``` #### GLightbox ```bash # Download GLightbox CSS dan JS wget https://cdn.jsdelivr.net/npm/glightbox@3.2.0/dist/css/glightbox.min.css -O public/assets/landing/assets/vendor/glightbox/css/glightbox.min.css wget https://cdn.jsdelivr.net/npm/glightbox@3.2.0/dist/js/glightbox.min.js -O public/assets/landing/assets/vendor/glightbox/js/glightbox.min.js ``` #### Swiper ```bash # Download Swiper CSS dan JS wget https://cdn.jsdelivr.net/npm/swiper@10.3.1/swiper-bundle.min.css -O public/assets/landing/assets/vendor/swiper/swiper-bundle.min.css wget https://cdn.jsdelivr.net/npm/swiper@10.3.1/swiper-bundle.min.js -O public/assets/landing/assets/vendor/swiper/swiper-bundle.min.js ``` #### PureCounter ```bash # Download PureCounter JS wget https://cdn.jsdelivr.net/npm/purecounter@1.0.0/dist/purecounter_vanilla.js -O public/assets/landing/assets/vendor/purecounter/purecounter_vanilla.js ``` ### 5. Images Untuk images, Anda perlu: 1. Mengunduh template lengkap 2. Copy folder `img/` dari template ke `public/assets/landing/assets/img/` 3. Atau menggunakan placeholder images dari CDN ### 6. Testing Setelah setup selesai, test landing page di: ``` http://localhost:8000/ ``` ## Troubleshooting ### CSS/JS tidak load - Pastikan path di `layouts/app.blade.php` sudah benar - Pastikan file assets sudah ada di folder yang tepat - Check browser console untuk error ### Images tidak muncul - Pastikan folder `img/` sudah di-copy - Check path images di components - Gunakan placeholder images sementara ### Vendor libraries error - Pastikan semua vendor libraries sudah di-download - Check versi compatibility - Gunakan CDN sebagai alternatif ## Notes - File CSS dan JS saat ini adalah placeholder - Anda perlu mengganti dengan file asli dari template - Pastikan license template sudah sesuai dengan kebutuhan