0 Пользователей и 1 Гость просматривают эту тему.
  • 1 Ответов
  • 859 Просмотров
*

rubinded

  • Осваиваюсь на форуме
  • 34
  • 0
Здравствуйте. Делаю верстку шаблона для Joomla на Bootstrap. Проблема в том, что боковые колонки с модулями не хотят размещаться по бокам, а спрыгивают вниз под материал. Модуль входа на сайт размещаю в позицию слева (position-7), но он все равно спрыгивает вниз под материал. И к тому же текст в материале не хочет сжиматься при маленьком разрешении экрана. Помогите пожалуйста.

Вот ссылка на мой сайт: http://rybalcyn.bget.ru/index.php/ru/news

Вот index.php:
Код
<?php
/**
 * @package     Joomla.Site
 * @subpackage  Templates.protostar
 *
 * @copyright   Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 */

defined('_JEXEC') or die;

$app             = JFactory::getApplication();
$doc             = JFactory::getDocument();
$user            = JFactory::getUser();
$this->language  = $doc->language;
$this->direction = $doc->direction;

// Getting params from template
$params = $app->getTemplate(true)->params;

// Detecting Active Variables
$option   = $app->input->getCmd('option', '');
$view     = $app->input->getCmd('view', '');
$layout   = $app->input->getCmd('layout', '');
$task     = $app->input->getCmd('task', '');
$itemid   = $app->input->getCmd('Itemid', '');
$sitename = $app->get('sitename');

if($task == "edit" || $layout == "form" )
{
$fullWidth = 1;
}
else
{
$fullWidth = 0;
}

// Add JavaScript Frameworks
$doc->addScript($this->baseurl . '/templates/' . $this->template . '/js/bootstrap.js');

// Add Stylesheets
$doc->addStyleSheet($this->baseurl . '/templates/' . $this->template . '/css/bootstrap.css');
$doc->addStyleSheet($this->baseurl . '/templates/' . $this->template . '/css/style.css');
$doc->addStyleSheet($this->baseurl . '/templates/' . $this->template . '/css/template.css');

// Load optional RTL Bootstrap CSS
JHtml::_('bootstrap.loadCss', false, $this->direction);

// Adjusting content width
if ($this->countModules('position-7') && $this->countModules('position-8'))
{
$span = "col-md-6";
}
elseif ($this->countModules('position-7') && !$this->countModules('position-8'))
{
$span = "col-md-9";
}
elseif (!$this->countModules('position-7') && $this->countModules('position-8'))
{
$span = "col-md-9";
}
else
{
$span = "col-md-12";
}

// Logo file or site title param
if ($this->params->get('logoFile'))
{
$logo = '<img src="' . JUri::root(). $this->params->get('logoFile'). '" alt="' . $sitename . '" />';
}
elseif ($this->params->get('sitetitle'))
{
$logo = '<span class="site-title" title="' . $sitename . '">' . htmlspecialchars($this->params->get('sitetitle')). '</span>';
}
else
{
$logo = '<span class="site-title" title="' . $sitename . '">' . $sitename . '</span>';
}
?>

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<jdoc:include type="head" />
</head>
<body>
<div class="container" id="main">
<div class="row">
           <div class="col-xs-12 col-md-6 col-md-push-3 hidden-xs" style="background:#2780e3; text-align:center;">
<font color="#FFFFFF"; size="5"><b>Полтавский Банк Информации</b></font>
           </div>
           <div class="col-xs-12 col-md-3  col-md-pull-6">
<p class="fig"><img src="images/uapoltava.png" style="align:center"; alt="Полтавский банк информации" />
</div>
<div class="col-xs-12 col-md-3" id="social">
<a href="http://vk.com/rybalchenkoiv" target="_blank" class="icon-vk"></a>
<a href="" class="icon-facebook2"></a>
<a href="" class="icon-twitter"></a>
<a href="" class="icon-google-plus2"></a>
</div>
<div class="row">
<div class="col-xs-12">
<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#topmenu" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="topmenu">
      <jdoc:include type="modules" name="position-1" style="none" />
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>
</div>
<div class="row">
<div class="col-xs-12">
<jdoc:include type="modules" name="position-5" style="none" />
</div>
<div class="row">
<div class="col-md-3>
<jdoc:include type="modules" name="position-8" style="xhtml" />
</div>
<div class="col-md-6>
<jdoc:include type="message" />
<jdoc:include type="component" />
</div>
<div class="col-md-3>
<jdoc:include type="modules" name="position-7" style="xhtml" />
</div>
</div>
</div>
<div class="row"></div>
<div class="row"></div>
</div>
</body>
</html>
« Последнее редактирование: 16.03.2016, 21:02:43 от rubinded »
*

rubinded

  • Осваиваюсь на форуме
  • 34
  • 0
Re: Bootstrap не работают колонки
« Ответ #1 : 16.03.2016, 21:02:05 »
Нашел причину ;D Все дело в том, что забыл кавычки в классе закрыть.
Было так:
Код
<div class="col-md-3>
А нужно так:
Код
<div class="col-md-3">

Всем спасибо что помогли ребята ::)
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Как плагин аккордеона заставить работать с новой версией Bootstrap?

Автор sergey-911

Ответов: 9
Просмотров: 224
Последний ответ 05.08.2017, 21:33:59
от capricorn
Фиксированное при прокрутке горизонтальное меню на шаблоне Bootstrap

Автор sergey-911

Ответов: 1
Просмотров: 236
Последний ответ 30.07.2017, 14:29:44
от sergey-911
[Решено] Высота сайдбара на всю высоту контента страницы

Автор yarikk

Ответов: 4
Просмотров: 174
Последний ответ 21.06.2017, 15:05:33
от yarikk
Bootstrap 3 + J3.7 и меню

Автор tiraz

Ответов: 2
Просмотров: 156
Последний ответ 15.06.2017, 20:42:18
от Septdir
Изменит ширину блока шаблона на bootstrap 3

Автор Galiakberow

Ответов: 15
Просмотров: 321
Последний ответ 06.06.2017, 14:03:41
от Galiakberow