Jump to content

Fi2

Members
  • Posts

    1
  • Joined

  • Last visited

Posts posted by Fi2

  1. To make a simple information website for my partner's local chicken farm, I got one of those website builders where you're supposed to just upload a template and tweak the html/css a bit but now I think I have gotten way over my head on this one! I have messed with html and css some in the past, that's why I thought I could do this, but the template we love (because we don't have a lot of text) is built with/on bootstrap and I am not at all familiar with it!  can't seem to find where to tweak to remove/replace the background images of the different sections of the template. I don't even know what question I should be asking right now (in technical terms) so I will just drop the code here and hope someone here will be kind enough to tell me what I need to do, and thanks in advance.

    To be clear, I am trying to replace the (building) images in the different containers/sections/backgrounds in the code below with our chicken images:

    
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
    
        <title>Chozeq Farms</title>
    <!--
    Strip
    http://www.templatemo.com/tm-482-strip
    -->
        <!-- load stylesheets -->
        <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400">   <!-- Google web font "Open Sans" -->
        <link rel="stylesheet" href="css/bootstrap.min.css">                                      <!-- Bootstrap style -->
        <link rel="stylesheet" href="css/templatemo-style.css">                                   <!-- Templatemo style -->
    
    <link rel="stylesheet" href="custom.css">  
    
        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
            <!--[if lt IE 9]>
              <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
              <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
              <![endif]-->
    
    
            <div class="container tm-container">
                
                <div class="row navbar-row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 navbar-container mynav">
                        
                        <a href="javascript:void(0)" class="navbar-brand" id="go-to-top">Chozeq Farms</a>
                        
                        <nav class="navbar navbar-full">
                            
                            <div class="collapse navbar-toggleable-md" id="tmNavbar">                            
    
                                <ul class="nav navbar-nav">
                                    <li class="nav-item">
                                        <a class="nav-link" href="#tm-section-1">Home</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" href="#tm-section-2">Services</a>
    								</li>
    					<li class="nav-item">
                                        <a class="nav-link" href="#tm-section-3">Trainings</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" href="#tm-section-4">Contact</a>
                                    </li>
    								
    							</ul>
                                
                            </div>
    
                        </nav>    
                        
                        <button class="navbar-toggler hidden-lg-up" type="button" data-toggle="collapse" data-target="#tmNavbar"></button>
                        
                    </div>
                </div>
                
                
                <div class="tm-page-content">                
                    
                    <!-- #home -->
                    <section id="tm-section-1" class="row tm-section">
                        <div class="tm-white-curve-left col-xs-12 col-sm-12 col-md-12 col-lg-7 col-xl-6">
                            <div class="tm-white-curve-left-rec"></div>
                            <div class="tm-white-curve-left-circle"></div>
                            <div class="tm-white-curve-text">
                                <h2 class="tm-section-header blue-text">About Us</h2>
                                <p>
                                    Chozeq Farms is involved in the production of poultry meat, eggs, and processed and packaged poultry. Our farm is located in a serene rural environment and we strive to operate the best practices of poultry farming in order to offer the highest quality meat to our customers.
                                </p>                           
                            </div>                        
                        </div>
    
                        <div class="tm-home-right col-xs-12 col-sm-12 col-md-12 col-lg-5 col-xl-6">
                        </div>
                        
                    </section> <!-- #home -->
    
                    <!-- #vision -->
                    <section id="tm-section-2" class="row tm-section">
                        <div class="tm-flex-center col-xs-12 col-sm-6 col-md-6 col-lg-5 col-xl-6">
                            <img src="img/XXX.jpg" alt="Image" class="img-fluid tm-img">
                        </div>
    
                        <div class="tm-white-curve-right col-xs-12 col-sm-6 col-md-6 col-lg-7 col-xl-6">
                            
                            <div class="tm-white-curve-right-circle"></div>
                            <div class="tm-white-curve-right-rec"></div>
                            
                            <div class="tm-white-curve-text">
                                <h2 class="tm-section-header red-text">Our Vision</h2>
                                <p>To provide top-quality white meat and egg protein within the most environmentally scrupulous conditions.</p>    
                            </div>
                            
                        </div>
                    </section> <!-- #services -->
    
                    <!-- #mission -->
                    <section id="tm-section-3" class="row tm-section">
                        <div class="tm-white-curve-left col-xs-12 col-sm-6 col-md-6 col-lg-7 col-xl-6">
                            <div class="tm-white-curve-left-rec">
                                
                            </div>
                            <div class="tm-white-curve-left-circle">
                                
                            </div>
                            <div class="tm-white-curve-text">
                                <h2 class="tm-section-header gray-text">Our Mission</h2>
                                <p class="thin-font">To impact, in the first instance, the local poultry industry, and evolve into a national and regional player, and to become a dominant force in the industry.</p>    
                            </div>
                            
                        </div>
                        <div class="tm-flex-center col-xs-12 col-sm-6 col-md-6 col-lg-5 col-xl-6">
                            <img src="img/XXX.jpg" alt="Image" class="img-fluid tm-img">
                        </div>
                    </section> <!-- #about -->
    
                    <!-- #contact -->
                    <section id="tm-section-4" class="row tm-section">
                        <div class="col-xs-12 col-sm-6 col-md-6 col-lg-5 col-xl-6 tm-contact-left">
                        </div>
    
                        <div class="tm-white-curve-right col-xs-12 col-sm-6 col-md-6 col-lg-7 col-xl-6">
                            
                            <div class="tm-white-curve-right-circle"></div>
                            <div class="tm-white-curve-right-rec"></div>
                            
                            <div class="tm-white-curve-text">
                                
                                <h2 class="tm-section-header green-text">Contact</h2>
                                <p>We're available to take your orders and answer any of your enquires between the hours of 8:00 am to 5:00 pm (Monday - Friday) and 10:00 am to 4:00 pm (Saturday).</p>
    
                                <h3 class="tm-section-subheader green-text">Our Address</h3>
                                <address>
                                    Ibadan 200261, Oyo State-NG
                                </address>
                                
                                <div class="contact-info-links-container">
                                    <span class="green-text contact-info">
                                    	Tel: <a href="tel:+2348134865720" class="contact-info-link">+2348134865720</a></span>
                                    <span class="green-text contact-info">
                                    	Email: <a href="mailto:info@chozeqfarms.com" class="contact-info-link">info@chozeqfarms.com</a></span>    
                                </div>
                                
                            </div>                        
    
                        </div>
                    </section> <!-- #contact -->
    
                    <!-- footer -->
                    <footer class="row tm-footer">
                        
                        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
    
                            <p class="text-xs-center tm-footer-text">Copyright © 2020 Chozeq Farms</p>
                            
                        </div>
                        
                    </footer>                      
    
                </div>
                 
            </div> <!-- .container -->
            
            <!-- load JS files -->
            
            <script src="js/jquery-1.11.3.min.js"></script>             <!-- jQuery (https://jquery.com/download/) -->
            <script src="https://www.atlasestateagents.co.uk/javascript/tether.min.js"></script><!-- Tether for Bootstrap, http://stackoverflow.com/questions/34567939/how-to-fix-the-error-error-bootstrap-tooltips-require-tether-http-github-h --> 
            <script src="js/bootstrap.min.js"></script>                 <!-- Bootstrap (http://v4-alpha.getbootstrap.com/) -->
            <script src="js/jquery.singlePageNav.min.js"></script>      <!-- Single Page Nav (https://github.com/ChrisWojcik/single-page-nav) -->
            
            <!-- Templatemo scripts -->
            <script>     
    
            var bigNavbarHeight = 90;
            var smallNavbarHeight = 68;
            var navbarHeight = bigNavbarHeight;                 
        
            $(document).ready(function(){
    
                var topOffset = 180;
    
                $(window).scroll(function(){
                   
                    if($(this).scrollTop() > topOffset) {
                        $(".navbar-container").addClass("sticky");
                    }
                    else {
                        $(".navbar-container").removeClass("sticky");
                    }
    
                });
    
                /* Single page nav
                -----------------------------------------*/
    
                if($(window).width() < 992) {
                    navbarHeight = smallNavbarHeight;
                }
    
                $('#tmNavbar').singlePageNav({
                   'currentClass' : "active",
                    offset : navbarHeight
                });
    
    
                /* Collapse menu after click 
                   http://stackoverflow.com/questions/14203279/bootstrap-close-responsive-menu-on-click
                ----------------------------------------------------------------------------------------*/
    
                $('#tmNavbar').on("click", "a", null, function () {
                    $('#tmNavbar').collapse('hide');               
                });
    
                // Handle nav offset upon window resize
                $(window).resize(function(){
                    if($(window).width() < 992) {
                        navbarHeight = smallNavbarHeight;
                    } else {
                        navbarHeight = bigNavbarHeight;
                    }
    
                    $('#tmNavbar').singlePageNav({
                        'currentClass' : "active",
                        offset : navbarHeight
                    });
                });
                
    
                /*  Scroll to top
                    http://stackoverflow.com/questions/5580350/jquery-cross-browser-scroll-to-top-with-animation
                --------------------------------------------------------------------------------------------------*/
                $('#go-to-top').each(function(){
                    $(this).click(function(){ 
                        $('html,body').animate({ scrollTop: 0 }, 'slow');
                        return false; 
                    });
                });
                
            });
        
            </script>             
    
        
        

     

×
×
  • Create New...