Listico (v2.0)- Listing & Directory HTML Template

Created: 30 July, 2019

Updated: 06 August, 2019

24/7 Support: Send us a message

Thank you for purchasing my template. If you have any questions that are beyond the scope of this help file, please feel free to email us

  1. FTP Upload:
    • Open up your FTP manager and connect to your hosting
    • Browse to required directory (Normally public_html)
    • Upload the files inside Listico folder.
	<!-- Google Fonts
	============================================ -->
	 Quicksand  - <link href='https://fonts.google.com/specimen/Quicksand' rel='stylesheet' type='text/css'>

		
	
	<!-- ===========  All Stylesheet  ================= -->

	<!-- fontawesome css plugins 
	============================================ -->
	<link rel="stylesheet" href="assets/css/font-awesome.min.css">

	<!-- slick CSS
	============================================ -->
	<link rel="stylesheet" href="assets/css/slick.css">
    <
    !-- animate CSS
    ============================================ -->
    <link rel="stylesheet" href="assets/css/animate.css">

	<!-- magnific-popup CSS
	============================================ -->
	<link rel="stylesheet" href="assets/css/magnific-popup.css">
	
	<!-- Owl Carousel CSS
	============================================ -->
	<link rel="stylesheet" href="assets/css/owl.carousel.min.css">

        <!-- Owl Carousel CSS
        ============================================ -->
        <link rel="stylesheet" href="assets/css/owl.theme.css">

	<!-- Bootstrap CSS
	============================================ -->
	<link href="assets/css/bootstrap.min.css" rel="stylesheet">

	<!-- Style CSS
	============================================ -->
	<link rel="stylesheet" href="style.css">

	<!-- Responsive CSS
	============================================ -->
	<link rel="stylesheet" href="assets/css/responsive.css">

		<!-- All JS Plugins -->
		
		<!-- jQuery
		============================================ -->
		<script src="assets/js/jquery-1.12.4.min.js"></script>

		<!-- Bootstrap
		============================================ -->
		<script src="assets/js/bootstrap.min.js"></script>

		<!-- Others jQuery Plugins
		============================================ -->
		<script src="assets/js/jquery.easing.1.3.js"></script>
		<script src="assets/js/popper.min.js"></script>
		<script src="assets/js/scrollUp.min.js"></script>
		<script src="assets/js/owl.carousel.min.js"></script>
		<script src="assets/js/magnific-popup.min.js"></script>
		<script src="assets/js/slick.js"></script>
        <script src="assets/js/wow.min.js"></script>
        <script src="assets/js/meanmenu.min.js"></script>
		<!-- Main JS
		============================================ -->
		<script src="assets/js/main.js"></script>
	

Template 3 Color Code

How to Change Logo

How to Change Favicon

How to Change Add Page Titile Background & Breadcrumb

How to Change Google Map - Slider , Map

How to Change Popular single item - listing item - carousel

How to Change How to work Links

How to Change Social Links

How to Change Mail Address with Your's - Open mail.php file and edit.

How to Change Copyright & Footer Menu Link

CSS Structure

I'm using One CSS files in this theme. You change the CSS Code of style.css file


=================================
|***  Table of contents:   ***|
=================================

1. General styles
2. Typography
3. Helpers
4. Preloader
5. Go up button
6. Header and navigation
7. Hero Section
8. Populer item -  All Items
9. How to work
10. promo section
11. About us
12. Footer Area
13. Single Listing and Sidebar
14. Top Event

*Note: Responsive in responsive.css in assets/css folder

	

If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.

Change the top location section CSS - find and change it on style.css

	
.single-top-location {
    border-radius: 8px;
    background-color: rgb(119, 119, 119);
    box-shadow: 0px 0px 27px 0px rgba(119, 119, 119, 0.04);
    height: 475px;
    position: relative;
    margin-top: 30px;
}

Change section padding CSS - find and change it on style.css

.section-padding {
    padding: 100px 0px;
}

JavaScript Customization



Change The Popular Item Carosuel with your's choice

	
    /*====================================
     # Listico Item Carousel 
     =====================================*/
    $('.listico-item-carousel, .top-locations-carousel').owlCarousel({
        autoplay: true,
        loop: true,
        margin: 30,
        nav: false,
        dots: true,
        responsive: {
            0: {
                items: 1
            },
            500: {
                items: 1
            },
            700: {
                items: 2
            },
            1000: {
                items: 3
            }
        }
    });
		

Credits And Sources

Once again thank you for purchasing one of our Templates

Best Regards

modinatheme

ModinaTheme