0

I have searched the other questions but I do not get anything that really solves my problem. I downloaded a template that I want to use as a small portfolio for myself. On my local server everything works fine. But when I upload it to a live server something goes wrong. I believe the problem is with the Bootstrap.js or bootstrap-theme.css

Some functions are not running and dont display at all. Such as the loading bar when you open the site, backgrounds, some images and arrows.

I have done the following.

Checked all the paths to make sure they are correct. Made sure that it is not a cache issue. Tried to run it in private view (still the same problem) Checked the firefox error log but all scripts seem to load.

Here is the template demo - http://designova.net/presence/index01.html

Here is my live version - codethis.co.za

Here is the code in the head and the js at the bottom

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Code This -  Beautiful Website Design and More</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

<script src="http://www.codethis.co.za/bootstrap/js/jquery.js" type="text/javascript"></script>
<script src="http://www.codethis.co.za/bootstrap/js/bootstrap.js" ></script>
<script src="http://www.codethis.co.za/javascripts/jquery.easing.1.3.js" type="text/javascript"></script>

<!-- Standard Favicon--> 
<link rel="shortcut icon" href="images/favicon/favicon.ico">

<!-- Standard iPhone Touch Icon--> 
<link rel="apple-touch-icon" sizes="57x57" href="images/touchicons/apple-touch-icon-57-precomposed" />
<!-- Retina iPhone Touch Icon--> 
<link rel="apple-touch-icon" sizes="114x114" href="assets/touchicons/apple-touch-icon-114-precomposed" />
<!-- Standard iPad Touch Icon--> 
<link rel="apple-touch-icon" sizes="72x72" href="assets/touchicons/apple-touch-icon-72-precomposed" />
<!-- Retina iPad Touch Icon--> 
<link rel="apple-touch-icon" sizes="144x144" href="assets/touchicons/apple-touch-icon-144-precomposed" />

<!-- Bootstrap CSS Files -->
<link href="http://www.codethis.co.za/bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="http://www.codethis.co.za/bootstrap/css/bootstrap-theme.css" rel="stylesheet">
<!-- Custom Fonts Setup via Font-face CSS3 -->
<link href="http://www.codethis.co.za/fonts/fonts.css" rel="stylesheet">

<!-- CSS files for plugins -->
<link href="http://www.codethis.co.za/stylesheets/pace.preloader.css" rel="stylesheet">
<link href="http://www.codethis.co.za/stylesheets/animate.css" rel="stylesheet">
<link href="http://www.codethis.co.za/stylesheets/owl.carousel.css" rel="stylesheet">
<link href="http://www.codethis.co.za/stylesheets/owl.theme.css" rel="stylesheet">
<link href="http://www.codethis.co.za/stylesheets/magnific-popup.css" rel="stylesheet" > 
<link href="http://www.codethis.co.za/stylesheets/jquery.tweet.css" rel="stylesheet"/>
<link href="http://www.codethis.co.za/stylesheets/foliohover.css" rel="stylesheet">
<link href="http://www.codethis.co.za/stylesheets/fancymenu.css"  rel="stylesheet">
<link href="http://www.codethis.co.za/stylesheets/intro.css" rel="stylesheet">
<link href="http://www.codethis.co.za/stylesheets/pricing.css" rel="stylesheet">

<!-- Main Template Styles -->
<link href="stylesheets/main.css" type="text/css" rel="stylesheet">
<!-- Main Template Responsive Styles -->
<link href="stylesheets/main-responsive.css" type="text/css" rel="stylesheet">
<!-- Main Template Retina Optimizaton Rules -->
<link href="stylesheets/main-retina.css" type="text/css" rel="stylesheet">
<!-- LESS stylesheet for managing color presets -->

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">

<!-- LESS JS engine-->
<script src="http://www.codethis.co.za/less/less-1.5.0.min.js" type="text/css"></script>
<script src="http://www.codethis.co.za/javascripts/modernizr.custom.js"></script>

 <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="bootstrap/js/html5shiv.js"></script>
      <script src="bootstrap/js/respond.min.js"></script>
    <![endif]-->

<style>
    .full-height{
        height: 100%;
    }
</style>
</head>

and at the bottom

<!-- JS Plugins -->
<script src="javascripts/pace.min.js"></script>
<script src="javascripts/retina.js"></script>
<script src="javascripts/device.min.js"></script>
<script src="javascripts/owl.carousel.js"></script>
<script src="javascripts/waypoints.min.js"></script>
<script src="javascripts/jquery.tweet.js"></script>
<script src="javascripts/okvideo.js"></script>
<script src="javascripts/jquery.mixitup.js"></script>
<script src="javascripts/flexslider.js" ></script> 

<script src="javascripts/jquery.magnific-popup.js"></script> 
<script src="javascripts/smooth-scroll.js"></script>
<script src="javascripts/form-validation.js"></script>
<script src="javascripts/classie.js"></script>
<script src="javascripts/fancymenu-rollin.js"></script>
<!-- Scroll Animations Setup -->
<script src="javascripts/wow.js"></script>
<script src="javascripts/animations-init.js"></script>
<!-- Custom Scripts Setup -->
<script src="javascripts/carousel-init.js" ></script> 
<script src="javascripts/portfolio.js"></script>
<script src="javascripts/intro.js"></script>
<script src="javascripts/main.js"></script>

Please could someone help me with what is going on here

Improve this question
2
  • i noticed you're loading jquery twice .. remove <script src="codethis.co.za/bootstrap/js/jquery.js" type="text/javascript"></script> Commented Feb 26, 2015 at 17:09
  • You load main.js before you load jQuery. That's also a problem. Commented Feb 26, 2015 at 17:12

2 Answers 2

Reset to default
1

Your page is riddled with 404 errors, which means either (1) your paths are not correct, or (2) the files do not exist on the server.

404 errors in Chrome console

Something to look at would be whether you are using relative paths or absolute paths for your JS, CSS, and image assets. Remember:

  • paths that start with a / will resolve to http://codethis.co.za/<path>
  • paths that do not start with a / will resolve relative to whatever the current path is

Perhaps you are missing a subfolder in your paths?

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Some of the other errors, I suspect, will be resolved once your paths are correct (e.g., Uncaught ReferenceError: $ is not defined will go away once jQuery loads properly).
Thank you. I have checked all the paths and they seem to be fine. All my folders and their sub folders are there as well. I made the following changes. <script src="code.jquery.com/jquery-1.11.0.min.js"></script> <script src="codethis.co.za/bootstrap/js/bootstrap.js" ></script> <script src="codethis.co.za/javascripts/jquery.easing.1.3.js" type="text/javascript"></script> Removed the jquery line I also added codethis.co.za to every path to make sure they are correct. Still have the same problem though
I just realized that some of the requests are looking for assets on the www subdomain, and your server is not configured to allow cross-origin requests (i.e., from codethis.co.za to www.codethis.co.za). You could either configure your server to allow these cross-origin requests, or you could set up a permanent redirect from one to the other. You'll notice that many of the errors go away when visiting http://www.codethis.co.za/.
0

First of all you seem to have a problem loading some of your fonts (cross-origin) It should not be linked with your problem, but you should fix it.

You also have a :

Uncaught ReferenceError: $ is not defined

which could be relative to something with your JQuery, and this could explain a lot if you're using it heavily.

From what I see in network I don't have any missing images.

Thibaut

Improve this answer

1 Comment

Okay I have fixed the errors. But I am still stuck with the same problem. Any other ideas?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.