user567665
user567665

Reputation:

Twitter-Bootstrap Menu Not Working

I am trying to write a custom template for the first time in Joomla 3.0 using Twitter-Bootstrap.

[edit]removed link to site[/edit]

Nothing I do is making the template's menu work. Front page only. Forget the inside pages, please.

I think it's due to the fact that the template can't seem to access the javascript's files.

Any advice would be very much appreciated in getting the template's menu working when the window is resized.

I've tried using this:

    <?php
    defined('_JEXEC') or die;
    $doc = JFactory::getDocument();
    $doc->addScript('/templates/' . $this->template . '/js/main.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/jquery.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-transition.js',   'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-alert.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-modal.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-dropdown.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-scrollspy.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-tab.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-tooltip.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-popover.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-button.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-collapse.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-carousel.js', 'text/javascript');
    $doc->addScript('/templates/' . $this->template . '/js/bootstrap-typeahead.js', 'text/javascript');
    ?>

And I've tried this:

<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/jquery.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-transition.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-alert.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-modal.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-dropdown.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-scrollspy.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-tab.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-tooltip.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-popover.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-button.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-collapse.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-carousel.js" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/bootstrap-typeahead.js" />

Upvotes: 0

Views: 461

Answers (2)

Lodder
Lodder

Reputation: 19733

Seeing as you're using Joomla 3.0, the best way to load the Bootstrap framework would be as follows:

JHtml::_('bootstrap.framework');

It uses less lines of code, uses the Joomla 3.0 coding standards and it ensures jQuery is loaded on noConflict mode.

Upvotes: 0

Piotr Stapp
Piotr Stapp

Reputation: 19830

There is an error, which you can see in chrome/firefox console

Uncaught ReferenceError: jQuery is not defined 

You probably did not include jquery.

Moreover

<link href="....

is for CSS not for Javascript

Upvotes: 2

Related Questions