We moved to new unified forum!

Please post all new support queries in our New Forum.

T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
  1. Igor Cunha
  2. Vanity Monster Sherlock Holmes The Voice
  3. General Discussion
  4. Thursday, 06 March 2014
  5.  Subscribe via email
How to mount such a site one page and use the original blocks t3 -blank .

File used .

jquery.easing.1.3.js ---> put in templates/t3_blank/js folder

In template/t3_blank/etc , create a assets.xml :


<?xml version="1.0" encoding="utf-8"?>
<assets>
<scripts>

<file>js/jquery.easing.1.3.js</file>

</scripts>

<stylesheets>

</stylesheets>

</assets>














---------------------------------------------------------------------------
Create a new block mainnav :












<?php
/**
* @package T3 Blank
* @copyright Copyright (C) 2005 - 2012 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

defined('_JEXEC') or die;
?>

<!-- MAIN NAVIGATION -->
<nav id="t3-mainnav" class="wrap t3-mainnav navbar-fixed-top navbar-collapse-fixed-top">
<div class="container navbar">
<div class="navbar-inner">

<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<i class="icon-reorder"></i>
</button>

<div class="nav-collapse collapse<?php echo $this->getParam('navigation_collapse_showsub', 1) ? ' always-show' : '' ?>">
<?php if ($this->getParam('navigation_type') == 'megamenu') : ?>
<jdoc:include type="megamenu" />
<?php else : ?>
<jdoc:include type="modules" name="<?php $this->_p('mainnav') ?>" style="raw" />
<?php endif ?>
</div>
</div>
</div>

<!-- //MAIN NAVIGATION -->

<!-- smooth scroll -->
<script type="text/javascript">
!function($) {

var winurl = window.location.href.replace(/([^\#]*)(.*)/, '$1');

window.reflow = function () {
if('ontouchstart' in window){
document.documentElement.style.width = (document.documentElement.offsetWidth + 1) + 'px';
setTimeout(function () {
document.documentElement.style.width = '';
}, 0);
}
};

$('.navbar-fixed-top ul li a').each (function (){
var href = this.href,
target = this.hash ? this.hash : href.replace(/.*(?=#[^\s]+$)/, ''),
target_url = href.replace(/([^\#]*)(.*)/, '$1');

if(this.hostname != window.location.hostname || target.substr(0, 1) != '#'){
return;
}

$(this).attr('href', target).data('target', target);
});

$('.navbar-fixed-top ul li a').click (function(e) {
if (!$(this).data('target')){
return;
}

var target = this.href.replace(/.*(?=#[^\s]+$)/, '');
if (target && ($(target).length)) {
e.preventDefault();

$('html,body').animate({scrollTop: Math.max(0,
$(target).offset().top
- ((!($('html').hasClass('off-canvas') && $('.btn-navbar').is(':visible')) && $('#t3-mainnav').css('position') == 'fixed') ? $('#t3-mainnav').height() : 0)
+ 2)}, {
duration: 800,
easing: 'easeInOutCubic',
complete: window.reflow
});
} else { //not found
var home = $('.navbar-fixed-top ul li a.home').attr('href');
if(home){
window.location.href = home.replace(/([^\#]*)(.*)/, '$1') + target;
}
}
});

$(document).ready(function(){
var ftarget = window.location.href.replace(/.*(?=#[^\s]+$)/, '');

if(ftarget.substr(0, 1) == '#'){
ftarget = $(ftarget);

if(ftarget.length){
$('html,body').scrollTop(Math.max(0, ftarget.offset().top - ((!($('html').hasClass('off-canvas') && $('.btn-navbar').is(':visible')) && $('#t3-mainnav').css('position') == 'fixed') ? $('#t3-mainnav').height() : 0) + 1));
window.reflow();
}
}

var homelink = $('.navbar-fixed-top ul li a.home')[0];
if(homelink){
var home_url = homelink.href.replace(/([^\#]*)(.*)/, '$1'),
home_target = homelink.hash ? homelink.hash : homelink.href.replace(/.*(?=#[^\s]+$)/, '');

if(home_url == winurl){
if(home_target.substr(0, 1) != '#'){
homelink.href = home_target = '#home';
$(homelink).data('target', home_target);
}

home_target = $(home_target);
if(!home_target.length){
home_target = $('<div id="home" style="width: 0; height: 0; visibility: hidden">').prependTo(document.body);
}

} else {
home_target = null;
}

$(homelink).unbind('click').click(function(e){

if(home_target){
e.preventDefault();

$('html,body').animate({scrollTop: Math.max(0, (home_target.offset().top - $('#t3-mainnav').height() + 2))}, {
duration: 800,
easing: 'easeInOutCubic',
complete: window.reflow
});
}
});
}
});
}(window.jQuery);
</script>
<!-- //smooth scroll -->

</nav>






----------------------------------------------------------------------------

You can use a spotlight 4 and create a module ( for text of contact) position 1 and this will have the id 88 .
Now create your menu (contact) as system link and add the link #Mod id number of the module .

Example (# Mod88 )

You can use the 4-position spotlight , but always identify the menu id of the first position , for it to be related to mobile devices .

Each block spotlight with 4 positions you use , you add the link in the menu only the id of the first block position .

On the main (home) page, you can create a menu with featured articles and the link types / css style home you put options.

You have her ready onepage without creating specific blocks and taking advantage of every block and all available positions on the issue.



Make css the way you need.



Bang, Take a test and be happy.


Do not forget to give new names for their custom blocks to protect during update
  Resende - Rio de Janeiro, Brazil
Visit 
Comment
There are no comments made yet.
Accepted Answer Pending Moderation
0
Votes
Undo
Updated information by placing the file assets and the code file with mainav script used.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Hello, thanks for the tutorial. Do you know if this code will work with t3_bs3_blank ?
To be honest I have tried but donĀ“t work, SO I ask you before review in deep the changes I have done.

Thanks and Best Regards
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
For BS3, I believe you will have to make some changes or additions javascript, I'm building websites using t3_blank_bs2. For to use t3_blank_bs3 and be a really pleasant thing for mobile phones, you can get a different script, http://tympanus.net/codrops/ always have codes very good , and it seems I saw one there that would fit perfectly on the project with t3_blank_bs. The button of menu remains at the top of the page on mobile. I saw one script that glides smoothly, but can not remember where, if I find post here.


With this tutorial, you can make improvements. I edit the blocks put all the code inside a div with id = "x", then I do call the menu using this ID block and not the id of the modules, it is much better to work.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
In t3_blank with bootstrap2 also is working perfectly in navigating collapse.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 4
Accepted Answer Pending Moderation
0
Votes
Undo
The correct way to do:
your blocks with a specific id.

For example:

spotlight-1 -> create a copy and rename spot-1

<!---------------SPOTLIGHT 1------------->


<?php if ($this->checkSpotlight('spotlight-1', 'position-1, position-2, position-3, position-4')) : ?>
<!-- SPOTLIGHT 1 -->
<div class="container t3-sl t3-sl-1">
<?php $this->spotlight('spotlight-1', 'position-1, position-2, position-3, position-4') ?>
</div>
<!-- //SPOTLIGHT 1 -->
<?php endif ?>


<!---------------New -> SPOT-1----------------->

<?php if ($this->checkSpotlight('spotlight-1', 'position-1, position-2, position-3, position-4')) : ?>
<!-- SPOTLIGHT 1 -->
<div id="section-1">

<div class="container t3-sl t3-sl-1">
<?php $this->spotlight('spotlight-1', 'position-1, position-2, position-3, position-4') ?>
</div>
</div>
<!-- //SPOTLIGHT 1 -->
<?php endif ?>


<!-- Do changes and rename your blocks -->
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 5
Accepted Answer Pending Moderation
0
Votes
Undo
Hello,

Im New in Joomla and T3

It is an excellent post, I Might help you,
not understand the part of the spotlight, as I put the link in the MegaMenu?
  Vasco De Contreras, Quito 170147, Ecuador
Visit 
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 6
Accepted Answer Pending Moderation
0
Votes
Undo
In first example, you put the id of your module.


In second example, spotlight1 have id="section-1"

Select your menu how link, and put #section-1 in your link
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 7
Accepted Answer Pending Moderation
1
Votes
Undo
3616 views, and counting.....
it seems very interesting :)
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 8
Accepted Answer Pending Moderation
0
Votes
Undo
Hello Igor,

Can you post a link to a demo of your project please?

Also, when you mention JavaScript changes to make this work on Blank BS3 template - can you explain a bit more?
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 9
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.