Joomla Templates Club 406,261 posts

[inviribus Friend inviribusJoin date: September 2014Posts: 18Downloads:221Uploads:0]

#207765

Hello is it possible to have the header sticky in Ja Hotel template

I want to make sticky the Header so the t3-header

That includes topbar-1, topbar-2, the logo and the main menu

You can see my site in http://www.stellapalace/joom

Thank you in advanced

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#575291

Hi

Please revert any custom code for the sticky menu on your site and follow this way:
– Open the PHP file of 2 blocks ‘topbar’ and ‘header’:
root/templates/ja_hotel/tpls/blocks/header.php
root/templates/ja_hotel/tpls/blocks/topbar.php

– Add the class affix in:
Header block:
<header id=”t3-header” class=”wrap t3-header”>
change it to:
<header id=”t3-header” class=”wrap t3-header affix”>

Topbar block:
<div id=”t3-topbar” class=”wrap t3-topbar”>
change it to:
<div id=”t3-topbar” class=”wrap t3-topbar affix”>

– Go to css file: root/templates/ja_hotel/css/custom.css (create this file if it doesn’t exist) and add this rule:


.t3-topbar.affix .container {
width: 100%;
position: fixed;
}
.has-slideshow .t3-header.affix {
position: fixed;
top: 40px;
}
.t3-topbar {
z-index: 2;
}


[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#641621

Hi

Please revert any custom code for the sticky menu on your site and follow this way:
– Open the PHP file of 2 blocks ‘topbar’ and ‘header’:
root/templates/ja_hotel/tpls/blocks/header.php
root/templates/ja_hotel/tpls/blocks/topbar.php

– Add the class affix in:
Header block:
<header id=”t3-header” class=”wrap t3-header”>
change it to:
<header id=”t3-header” class=”wrap t3-header affix”>

Topbar block:
<div id=”t3-topbar” class=”wrap t3-topbar”>
change it to:
<div id=”t3-topbar” class=”wrap t3-topbar affix”>

– Go to css file: root/templates/ja_hotel/css/custom.css (create this file if it doesn’t exist) and add this rule:


.t3-topbar.affix .container {
width: 100%;
position: fixed;
}
.has-slideshow .t3-header.affix {
position: fixed;
top: 40px;
}
.t3-topbar {
z-index: 2;
}


[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#740283

Hi

Please revert any custom code for the sticky menu on your site and follow this way:
– Open the PHP file of 2 blocks ‘topbar’ and ‘header’:
root/templates/ja_hotel/tpls/blocks/header.php
root/templates/ja_hotel/tpls/blocks/topbar.php

– Add the class affix in:
Header block:
<header id=”t3-header” class=”wrap t3-header”>
change it to:
<header id=”t3-header” class=”wrap t3-header affix”>

Topbar block:
<div id=”t3-topbar” class=”wrap t3-topbar”>
change it to:
<div id=”t3-topbar” class=”wrap t3-topbar affix”>

– Go to css file: root/templates/ja_hotel/css/custom.css (create this file if it doesn’t exist) and add this rule:


.t3-topbar.affix .container {
width: 100%;
position: fixed;
}
.has-slideshow .t3-header.affix {
position: fixed;
top: 40px;
}
.t3-topbar {
z-index: 2;
}


[Author]

Posts