Joomla Templates Club 406,261 posts

[James Weston Friend James WestonJoin date: September 2014Posts: 1030Downloads:11Uploads:70 Thanks: 408 Thanked: 16 times in 1 posts]

#1084698

Hi Guys I am working on a new site http://www.theplatinumlist.com/ within this section I have a magazine section where we have used the JA Teline V style to get a news site http://www.theplatinumlist.com/magazine

We took the features from another site we have http://www.vivaasiamagazine.com

If you look at this site you will see we had it set up so that when you scrolled down the top menu bar stayed in place so you could view it at all times no matter how far you scrolled. I was trying to find the posts in this forum where I got help to do this. But I couldn’t locate them. I have the Custom.css code and when i added that to the new sites custom.css file it sort of worked apart from the menu bar was staying in position but halfway down the page. I have posted the custom.css code below.

Could someone advise which bits of it I need to paste into the new sites custom.css file and which line controls the height at which the menu bar will stay?

Many thanks I am getting totally confused. Jim

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1084706

Hi
Here is the code you added in custom.css file to fix the topbar and header in JA Teline V template

.t3-header {
    background: none repeat scroll 0 0 #fff;
    height: 150px;
    padding: 35px 0;
    position: fixed;
    top: 48px;
    width: 100%;
    z-index: 9999;
}
.t3-topbar {
    background: none repeat scroll 0 0 #f8f8f8;
    border-bottom: 1px solid #e5e5e5 height: 48px;
    position: fixed;
    width: 100% !important;
    z-index: 9999;
}

.t3-wrapper > .main {
    padding-top: 201px;
}

Remove position fixed and padding-top:201px from the code and menu will no longer be sticky.

Regards

1 user says Thank You to Pankaj Sharma for this useful post

1. James Weston

[James Weston Friend James WestonJoin date: September 2014Posts: 1030Downloads:11Uploads:70 Thanks: 408 Thanked: 16 times in 1 posts]

#1084708

Thanks Pankaj, it kind of works but now I have lost the colour from my menu bar. How do i get that back. Also would i be able to use the code on the rest of the JA Charity site to create the same effect http://www.theplatinumlist.com Kind regards Jim

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1084710

Hi
my suggestion is for this site http://www.vivaasiamagazine.com
You only need to remove the position:fixed and padding style to retain the previous style and colours.

Regards

[James Weston Friend James WestonJoin date: September 2014Posts: 1030Downloads:11Uploads:70 Thanks: 408 Thanked: 16 times in 1 posts]

#1084712

Sorry Pankaj you have completely confused me now. The code you sent me was so i could make the JA Teline styled section of the Platinum List website http://www.theplatinumlist.com/magazine act the same way as it does on the http://www.vivasiamagazine.com website. That is that the top menu stays at the top when you scroll down. The code yous ent me worked as you can see but all the colour disappeared.

Jim

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1084721

Hi
This site does not open at my end http://prntscr.com/hvvqm7
The code is shared to remove the sticky effect. you can revert the change and give me one working URL also let me know u want to make it sticky or not.
If you want to copy the same style color from another template you have to do customisation in the header and topbar php file to get the same code also you have to check the style code used in the template using firebug and then use that in your template.
As i understand you want to make a sticky menu in JA Charity template. This form page is for JA Charity template only.

1 user says Thank You to Pankaj Sharma for this useful post

1. James Weston

[James Weston Friend James WestonJoin date: September 2014Posts: 1030Downloads:11Uploads:70 Thanks: 408 Thanked: 16 times in 1 posts]

#1084742

sorry its http://www.vivaasiamagazine.com that is the site that is fine and everything is ok. Now I want to have the same effect on the http://www.theplatinumlist.com site and on the http://www.theplatinumlist.com/magazine section (which is using the Teline template)

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1084895

Hi
For this site http://www.theplatinumlist.com/magazine you already have code in custom.css file
You can remove that code and use this code

.t3-header {
    padding: 35px 0;
    position: fixed;
    width: 100%;
    z-index: 9999;
}

For http://www.theplatinumlist.com
Add this code in custom.css file

.t3-topbar {
    height: auto;
    position: fixed;
    width: 100%;
}
.t3-header   {  position: fixed;
    width: 100%;
    top: 64px;
}

Also, i request you to open thread on JA Teline V forum for this template questions.

Regards

1 user says Thank You to Pankaj Sharma for this useful post

1. James Weston

[James Weston Friend James WestonJoin date: September 2014Posts: 1030Downloads:11Uploads:70 Thanks: 408 Thanked: 16 times in 1 posts]

#1084923

Thanks Pankaj much appreciate all your guidance. The solution for the main site worked fine thanks. The code for the Teline part of the site didn’t change anything http://www.theplatinumlist.com/magazine

Many thanks Jim

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1084924

Hi
You have added the code correctly

.t3-header {
    padding: 35px 0;
    position: fixed;
    width: 100%;
    z-index: 9999;
}

If you want to add the background or any other style you can add it to the above code.

Kindly open a new thread on JA Teline V forum page for further questions of this template.

Regards

[Author]

Posts