I have three pages: main.html, nav.html, sidebar.html
I've separated nav and sidebar for my project. In the nav page, I have button for collapsing the sidebar page. I am using bootstrap framework for the theme. But when I separate it, the sidebar doesn't collapse while the button on nav is clicked. Here are the code of main.html
<link href="global/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css">
<link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<script src="global/js/main/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$( "#nav" ).load( "inc/nav.html" );
$( "#sidebar" ).load( "inc/sidebar.html" );
});
</script>
<div id="nav"></div>
<div class="page-content" style="padding-bottom:70px;">
<div id="sidebar"></div>
<div class="content-wrapper bg-white">
<div class="content">test</div>
</div>
</div>
And this is nav.html
<div class="navbar navbar-expand-md navbar-dark bg-indigo navbar-static" style="background:#81018d;">
<div class="navbar-brand">
<a href="#" class="d-inline-block">
<img src="../../assets/images/logo/headerwhite.png" alt="">
</a>
</div>
<div class="d-md-none">
<button class="navbar-toggler sidebar-mobile-main-toggle legitRipple" type="button">
<i class="icon-paragraph-justify3"></i>
</button>
</div>
</div>
And sidebar.html
<div class="sidebar sidebar-dark sidebar-main sidebar-expand-md">
<div class="sidebar-content">
<div class="card card-sidebar-mobile">
<ul class="nav nav-sidebar" data-nav-type="accordion">
<li class="nav-item-header"><div class="text-uppercase font-size-xs line-height-xs">Main</div> <i class="icon-menu" title="Main"></i></li>
<li class="nav-item">Menu Beranda</li>
<li class="nav-item">Transaksi</li>
</ul>
</div>
</div>
</div>
I am trying to combine bootstrap and fullpage.js to have a vertical scrolling website with a horizontal scroll section that is controlled by its own separate navigation. I an trying to implement a page section just like how this website (http://www.lottanieminen.com/) is done. I am trying to implement the horizontal scroll in the 'Portfolio' page. Here is my code:
`
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, shrink-to-fit=no">
<meta name="description" content=" ">
<meta name="keywords" content=" ">
<meta name="author" content=" ">
<!-- Bootstrap CSS -->
<link href="img/mylogo.ico" rel="shortcut icon">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/fullpage.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.3.0/ekko-lightbox.css">
<title>Stephanie Daniels</title>
<nav class="navbar navbar-expand-lg navbar-light bg-white fixed-top" id="mainNav">
<img src="img/mylogo.png" alt="mylogo" style="display: inline-block;">
<span style="display: inline-block;"></span>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent" role="navigation">
<ul class="navbar-nav ml-auto">
<li class="nav-item"><a class="nav-link" href="#home" data-toggle="tab">Home</a></li>
<li class="nav-item"><a class="nav-link" href="#about" data-toggle="tab">About</a></li>
<li class="nav-item"><a class="nav-link" href="#portfolio" data-toggle="tab">Portfolio</a></li>
<li class="nav-item"><a class="nav-link" href="#contact" data-toggle="tab">Contact</a></li>
</ul>
</div>
</nav>
<section id="home">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="center">
<img src="img/nameheader.png" alt="nameheader" class="img-fluid" size="contain" width="40%" />
<div class="row">
<div class="col-12">
<img src="img/DesktopHomebox.png" alt="desktophomebox" class="img-fluid desktophomebox" size="contain" width="50%" />
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="about">
<div class="container-fluid">
<div class="row">
<div class="col-sm-5">
<img src="img/about.png" alt="aboutme" class="img-fluid aboutme" margin="0px" />
</div>
<div class="col-sm-6">
<h1 align="center">ABOUT</h1>
<h2 align="center"> Hi! I’m Stephanie...</h2>
<p align="center" class="big">I am Nigerian and currently a second year student at the University of Kent, studying Digital Arts. I have always been interested in graphics and digitalised work but I decided I was going to turn this interest into profession by combining my ICT skills with my fine art skills. <br><br>I am quite proficient in a range of design software which include
<span class="software">Adobe Illustrator</span> and <span class="software">InDesign</span>. My interest lies more in designing than developing as I am a very visual-oriented person. <br><br>Also, I am very energetic, although I generally enjoy being indoors and working with other people. This is just a brief overview of myself. Feel free to explore the site!</p>
</div>
</div>
</div>
</section>
<section id="portfolio">
<div class="container-fluid">
<div class="row">
<div class="col-sm-4">
<h1 align="center">PORTFOLIO</h1>
</div>
</div>
</div>
</section>
<section id="contact"> </section>
<footer class="container-fluid">
<div class="row">
<div class="col-12 text-center">
<p> © Stephanie Daniels 2018 </p>
</div>
</div>
</footer>
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/ekko -lightbox/5.3.0/ekko-lightbox.js">
</script>
<script src="js/fullpage.js"></script>
<script type="text/javascript" src="fullpage/fullpage.extensions.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script>
new fullpage('#fullpage', {
});
</script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script src="https://rawgit.com/alvarotrigo/fullPage.js/dev/src/fullpage.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.compatibility.min.js"></script>
<script>
$(document).on('click', '[data-toggle="lightbox"]', function(event) {
event.preventDefault();
$(this).ekkoLightbox();
});
</script>
<script>
$(function() {
$('#mainNav a').on('click', function(event) {
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1500, 'easeInOutExpo');
return false;
});
// Activate scrollspy to add active class to navbar items on scroll
$('body').scrollspy({
target: '#mainNav'
});
// Closes responsive menu when a link is clicked
$('.navbar-collapse>ul>li>a').click(function() {
$('.navbar-collapse').collapse('hide');
});
});
</script>
`
I'm learning Framework7 now, but I'm stuck in this problem. I have created two pages, this is the file
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=1, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="theme-color" content="#673ab7">
<title>Ciptaloka Editor</title>
<link rel="icon" href="assets/img/favicon.png">
<link rel="stylesheet" href="assets/css/framework7.material.min.css">
<link rel="stylesheet" href="assets/css/framework7.material.colors.min.css">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body class="theme-teal">
<div class="views">
<div class="view view-main">
<div class="pages navbar-fixed">
<div data-page="index" class="page">
<!-- off canvas -->
<div class="panel-overlay"></div>
<div class="panel panel-left panel-cover">
a
</div>
<!-- Navbar -->
<div class="navbar">
<div class="navbar-inner">
<div class="left">
<a class="link open-panel" data-panel-left>
<i class="icon material-icons">menu</i>
</a>
</div>
<div class="center">
Custom T-Shirt
</div>
<div class="right">
<a class="link">
Done
</a>
</div>
</div>
</div>
<!-- Toolbar -->
<div class="toolbar toolbar-bottom tabbar tabbar-labels">
<div class="toolbar-inner">
<a href="#produk" class="link tab-link active">
<i class="icon material-icons">dashboard</i>
<span class="tabbar-label">Produk</span>
</a>
<a href="#image" class="link tab-link">
<i class="icon material-icons">add_a_photo</i>
<span class="tabbar-label">Image</span>
</a>
<a href="#text" class="link tab-link">
<i class="icon material-icons">text_fields</i>
<span class="tabbar-label">Text</span>
</a>
<a href="#clipart" class="link tab-link">
<i class="icon material-icons">photo_filter</i>
<span class="tabbar-label">Clipart</span>
</a>
</div>
</div>
<!-- Content -->
<div class="page-content">
<div class="content-block">
<div class="tabs">
<div class="tab active" id="produk">
Go home 2
</div>
<div class="tab" id="image">
Image
</div>
<div class="tab" id="text">
Text
</div>
<div class="tab" id="clipart">
Clipart
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="assets/js/framework7.min.js"></script>
<script type="text/javascript" src="assets/js/my-app.js"></script>
</body>
</html>
index2.html
<div data-page="index2" class="page">
<!-- Navbar -->
<div class="navbar">
<div class="navbar-inner">
<div class="left">
<a class="link open-panel">
<a href="index.html">
<i class="icon material-icons">back</i>
</a>
</a>
</div>
<div class="center">
Custom Case
</div>
</div>
</div>
<!-- Content -->
<div class="page-content">
<div class="content-block">
Success direct page
</div>
</div>
</div>
When I'm click 'go home 2' at index.html, its succesfully direct to index2.html, content is shown, but not with the navbar, its only shown a background, but the text is hidden. This my screenshoot :
Why this is happen? Is I miss something?
your navbar is inside your data-page
you switch to index2 and all page change.
let navbar outside -> view-main -> navbar and then the data-page
sorry my bad english.
Hello I am trying to get a hidden navigation to display as a user starts to scroll down the page. The navigation will not display as the user scrolls. I am not exactly sure why it will not work. I am pretty sure it has something to do with the JavaScript or HTML. If not I can post the CSS as well but for now this is what I have..
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="language" content="english">
<!-- Modernizr -->
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
<script src="js/vendor/modernizr.js"></script>
<!-- jQuery -->
<link href="http://www.jqueryscript.net/css/jquerysctipttop.css" rel="stylesheet" type="text/css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<!-- Foundation -->
<link rel="stylesheet" href="css/foundation.css">
<!-- Alert box -->
<script type="text/javascript" src="js/alertbox.js"></script><!--http://www.w3schools.com/js/js_cookies.asp-->
<!-- News ticker -->
<link href="li-scroller.css" rel="stylesheet" type="text/css">
<script src="jquery.li-scroller.1.0.js"></script>
<!-- Site style -->
<link rel="stylesheet" href="css/SiteStyle.css" />
</head>
<!-- Cookie / Body container -->
<body onload="checkCookie()">
<nav id="fixedbar">
<ul id="fixednav">
<li>Men</li>
<li>Women</li>
<li>Kids</li>
</ul>
</nav>
<div class="large-1 columns void"> </div>
<div class="large-10 medium-12 small-12 columns siteContent">
<header>
<div class="large-12 medium-12 small-12 columns">
<div class="large-3 medium-3 small-12 columns">
<img src="img/logo.jpg" class="logo" alt="Main logo."/>
</div>
<div class="large-9 medium-9 small-12 columns userDash">
<div class="large-9 medium-8 small-12 columns userContainer">
<div id="userName">Sign In or Register
</div>
</div>
<div class="large-3 medium-4 small-12 columns cartContainer">
<img src="img/shoppingBag.svg" alt="Shopping bag icon" class="shoppingBagIcon"/><span> 0 </span><span class="shoppingBagText"> Items in your bag</span>
</div>
</div>
<div class="large-9 medium-9 small-12 columns tickerContainer">
<ul id="ticker01"><li><div>*** WELCOME TO NOVANI DESIGNS! **</div></li><li><div>* SIGN UP TODAY AND RECIEVE 25% OFF YOUR ENTIRE PURCHASE! **</div></li>
<li><div>* SPEND OVER $50 AND ENJOY FREE SHIPPING! ***</div></li></ul><script type="text/javaScript" src="js/newsscroll.js"></script>
</div>
<div class="large-12 medium-12 small-12 columns nav">
<div class="large-5 medium-5 small-12 columns">
<nav>
<ul class="mainNav">
<li>Men</li>
<li>Women</li>
<li>Kids</li>
</ul>
</nav>
</div>
<div class="large-5 medium-5 small-12 columns">
<input type="text" style="height:1.5em;"/>
</div>
</div>
</div>
</header>
<footer style="height:100em;">
1
</footer>
</div>
<div class="large-1 columns void"> </div>
<!-- jQuery -->
<script src="js/vendor/jquery.js"></script>
<!-- Foundation -->
<script src="js/vendor/jquery.min.js"></script>
<script src="js/vendor/what-input.min.js"></script>
<script src="js/foundation.min.js"></script>
<!-- News ticker -->
<script>$(function(){$("ul#ticker01").liScroll();$("ul#ticker02").liScroll({travelocity: 0.15});});</script>
<script type="text/javascript">
$(document).ready(function(){
$('#fixedbar a').on('click', function(e) {
e.preventDefault();
});
$(window).on('scroll',function() {
var scrolltop = $(this).scrollTop();
if(scrolltop >= 215) {
$('#fixedbar').fadeIn(250);
}
else if(scrolltop <= 210) {
$('#fixedbar').fadeOut(250);
}
});
});
</script>
</body>
</html>
delete following lines
<nav id="fixedbar">
<ul id="fixednav">
<li>Men</li>
<li>Women</li>
<li>Kids</li>
</ul>
</nav>
I have this code :
//--Async load page
$("body").on("click", "a:not([data-noajax])", function(){
href = $(this).attr("href");
pageLoad(href + " .page-wrapper", ".page-wrapper", href);
//$('#header').load(href+' #header');
//$('#footer').load(href+' #footer');
return false;
});
function pageLoad(from, where, href)
{
href = typeof href === 'undefined' ? "" : href;
loading();
//$(where).empty();
$(where).load(from, function(data){
loading(false);
$("html, body").animate({ scrollTop: $(".page-header h1").offset().top }, "slow");
title = $(".page-header h1").text();
parent.location.hash = href;
window.history.pushState($(document).html(), title, href);
document.title = title;
$(document).ready(function() {
$('.page-header h1').text(title);
})
});
}
//--
working, but....scripts which will load another page don't work ((
example : go on the http://amour05.ru , click on some post title, and after try reload page;
first we don't see comments widget, and after reload we see it.
p.s. sorry for my english ((
RIGHT SOURCE CODE :
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<meta name="MobileOptimized" content="320"/>
<meta name="HandheldFriendly" content="true"/>
<meta name="viewport" content="width=device_width, initial_scale=1.0" />
<title>кто знает расписание пересдач ...</title>
<style>
body { padding-top: 60px;}
</style>
<link rel="stylesheet" type="text/css" href="/theme/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="/theme/bootstrap/css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="/theme/style/style.css" />
<link rel="stylesheet" type="text/css" href="/theme/style/jquery/jquery-ui.css" />
<script type="text/javascript" src="/theme/scripts/jquery/jquery.js"></script>
<script type="text/javascript" src="/theme/scripts/jquery/jquery-ui.js"></script>
<script type="text/javascript" src="/theme/scripts/custom.js"></script>
<script type="text/javascript" src="//yandex.st/share/share.js"></script>
<script type="text/javascript" src="//vk.com/js/api/openapi.js?105"></script>
</head>
<body>
<div class="page-wrapper">
<div class="header">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<form id="search" action="/search.php" class="navbar-search pull-right" method="POST">
<input type="search" name="search_text" value="" class="search-query" placeholder="Поиск">
</form>
<a class="brand" href="/">amour05.ru</a>
</div>
</div>
</div>
</div>
<div class="container main">
<div class="row">
<div class="span3">
<div class="well well-sm">
<ul class="nav nav-list">
<li class="nav-header">Меню</li>
<li>Главная</li>
<li class="divider"></li>
<li class="active"><a id="add_post" href="/add.php">Добавить признание</a></li>
<li>Поиск по сайту</li>
<li><a id="feedback" href="/feedback.php">Написать админу</a></li>
</ul>
</div>
</div>
<div class="span6">
<div class="page-header well">
<h1>кто знает расписание пересдач ...</h1>
</div>
<div class="well">
<div class="post">
<div class="post_title"><h3 class="title">Анонимно</h3></div>
<div class="post_text">
кто знает расписание пересдач 3-его курса ЮФ пожалуйста скиньте.спасибо огромное)) <br><br>
</div>
<div class="post_data">
<div style="text-align: center" class="yashare-auto-init" data-yashareL10n="ru"
data-yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,gplus" data-yashareTheme="counter"
data-yashareTitle="кто знает расписание пересдач ..." data-yashareDescription ="кто знает расписание пересдач 3-его курса ЮФ пожалуйста скиньте.спасибо огромное)) <br><br>" ></div>
</div>
</div>
<script type="text/javascript">
VK.init({apiId: 4092141, onlyWidgets: true});
</script>
<!-- Put this div tag to the place, where the Comments block will be -->
<div id="vk_comments"></div>
<script type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, width: "100%", attach: "*", mini: "auto"}, 1560 );
VK.Observer.subscribe("widgets.comments.new_comment", commentAdd);
VK.Observer.subscribe("widgets.comments.delete_comment", commentDel);
function commentAdd(num, last, date, sign)
{
$.post('/ajax.php',{
type: 'vk_comment_add',
num: num,
last_comment: last,
date: date,
sign: sign,
id: "1560"
});
}
function commentDel(num, last, date, sign)
{
$.post('/ajax.php',{
type: 'vk_comment_del',
num: num,
last_comment: last,
date: date,
sign: sign,
id: "1560"
});
}
</script>
</div>
</div>
<div class="span3">
<div class="well well-sm">
<div class="panel panel-info">
<div class="panel-heading">Статистика</div>
<div class="panel-body">
<ul class="nav nav-list">
<li class="list-group-item">31.01.2014 18:58</li>
<li class="list-group-item">комментариев : <span class="badge badge-info pull-right">0</span></li>
<li class="list-group-item">просмотров : <span class="badge badge-info pull-right">34</span></li>
<li class="list-group-item">уникальных : <span class="badge badge-info pull-right clearfix">10</span></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="navbar navbar-fixed-bottom">
<div class="navbar-inner">
<div class="container">
<div class="row">
<div class="span6">
<ul class="nav hidden-phone">
<li class="active">Главная</li>
<li class="divider-vertical"></li> <!-- Вертикальный разделитель -->
<li>О проекте</li>
</ul>
</div>
<div class="span6">
<!-- Yandex.Metrika counter -->
<script type="text/javascript">
(function (d, w, c) {
(w[c] = w[c] || []).push(function() {
try {
w.yaCounter23555398 = new Ya.Metrika({id:23555398,
webvisor:true,
clickmap:true,
trackLinks:true,
accurateTrackBounce:true});
} catch(e) { }
});
var n = d.getElementsByTagName("script")[0],
s = d.createElement("script"),
f = function () { n.parentNode.insertBefore(s, n); };
s.type = "text/javascript";
s.async = true;
s.src = (d.location.protocol == "https:" ? "https:" : "http:") + "//mc.yandex.ru/metrika/watch.js";
if (w.opera == "[object Opera]") {
d.addEventListener("DOMContentLoaded", f, false);
} else { f(); }
})(document, window, "yandex_metrika_callbacks");
</script>
<noscript><div><img src="//mc.yandex.ru/watch/23555398" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->
</div>
</div>
</div>
</div>
</div>
</div>
<!--<script type="text/javascript" src="/theme/bootstrap/js/bootstrap.min.js" ></script>-->
</div>
</body>
</html>
GENERATED SOURCE :
<html data-savefrom-tab-data="{"module":"lm","tooltip":"Найдено ссылок: 0"}" lang="ru"><head>
<meta charset="utf-8">
<meta name="MobileOptimized" content="320">
<meta name="HandheldFriendly" content="true">
<meta name="viewport" content="width=device_width, initial_scale=1.0">
<title>кто знает расписание пересдач ...</title>
<style>
body { padding-top: 60px;}
</style>
<link rel="stylesheet" type="text/css" href="/theme/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/theme/bootstrap/css/bootstrap-theme.min.css">
<link rel="stylesheet" type="text/css" href="/theme/style/style.css">
<link rel="stylesheet" type="text/css" href="/theme/style/jquery/jquery-ui.css">
<script src="http://mc.yandex.ru/metrika/watch.js" async="" type="text/javascript"></script><script type="text/javascript" src="/theme/scripts/jquery/jquery.js"></script>
<script type="text/javascript" src="/theme/scripts/jquery/jquery-ui.js"></script>
<script type="text/javascript" src="/theme/scripts/custom.js"></script>
<script type="text/javascript" src="//yandex.st/share/share.js"></script>
<script type="text/javascript" src="//vk.com/js/api/openapi.js?105"></script>
</head>
<body data-savefrom-link-count="20" style="background-image: url("/theme/style/loveimgs/4.jpg");">
<div title="Загрузка" style="max-width: 500px;" id="loading" class="i hide"><img src="/theme/style/imgs/busy.gif" alt="загрузка"> идет загрузка</div><div class="page-wrapper"><div class="page-wrapper">
<div class="header">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<form id="search" action="/search.php" class="navbar-search pull-right" method="POST">
<input name="search_text" value="" class="search-query" placeholder="Поиск" type="search">
</form>
<a class="brand" href="/">amour05.ru</a>
</div>
</div>
</div>
</div>
<div class="container main">
<div class="row">
<div class="span3">
<div class="well well-sm">
<ul class="nav nav-list">
<li class="nav-header">Меню</li>
<li>Главная</li>
<li class="divider"></li>
<li class="active"><a id="add_post" href="/add.php">Добавить признание</a></li>
<li>Поиск по сайту</li>
<li><a id="feedback" href="/feedback.php">Написать админу</a></li>
</ul>
</div>
</div>
<div class="span6">
<div class="page-header well">
<h1>кто знает расписание пересдач ...</h1>
</div>
<div class="well">
<div class="post">
<div class="post_title"><h3 class="title">Анонимно</h3></div>
<div class="post_text">
кто знает расписание пересдач 3-его курса ЮФ пожалуйста скиньте.спасибо огромное)) <br><br>
</div>
<div class="post_data">
<div style="text-align: center" class="yashare-auto-init" data-yasharel10n="ru" data-yasharequickservices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,gplus" data-yasharetheme="counter" data-yasharetitle="кто знает расписание пересдач ..." data-yasharedescription="кто знает расписание пересдач 3-его курса ЮФ пожалуйста скиньте.спасибо огромное)) <br><br>"></div>
</div>
</div>
<!-- Put this div tag to the place, where the Comments block will be -->
<div id="vk_comments"></div>
</div>
</div>
<div class="span3">
<div class="well well-sm">
<div class="panel panel-info">
<div class="panel-heading">Статистика</div>
<div class="panel-body">
<ul class="nav nav-list">
<li class="list-group-item">31.01.2014 18:58</li>
<li class="list-group-item">комментариев : <span class="badge badge-info pull-right">0</span></li>
<li class="list-group-item">просмотров : <span class="badge badge-info pull-right">26</span></li>
<li class="list-group-item">уникальных : <span class="badge badge-info pull-right clearfix">8</span></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="navbar navbar-fixed-bottom">
<div class="navbar-inner">
<div class="container">
<div class="row">
<div class="span6">
<ul class="nav hidden-phone">
<li class="active">Главная</li>
<li class="divider-vertical"></li> <!-- Вертикальный разделитель -->
<li>О проекте</li>
</ul>
</div>
<div class="span6">
<!-- Yandex.Metrika counter -->
<noscript><div><img src="//mc.yandex.ru/watch/23555398" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->
</div>
</div>
</div>
</div>
</div>
</div>
<!--<script type="text/javascript" src="/theme/bootstrap/js/bootstrap.min.js" ></script>-->
</div></div>
</body></html>