BeYoga Header - how to duplicate?

awrymag · September 2015

Hi there,

What I really want to do is duplicate the colors and behavior of the BeYoga demo for my site. Then, instead of the hidden navigation items, I want them to be aligned right with underline as currently in my install.

My install is here: http://amypettyyoga.com/

Can you tell me how to do this?

Thanks J

Albert · September 2015

Hi,

below we paste complete css we used for header on Be|Yoga demo:

/* Header */
@media only screen and (min-width: 1240px) {
#Top_bar #menu { background-color: transparent !important; }
}
#Header .top_bar_left, 
.header-fixed #Top_bar,
#Top_bar #menu { background-color: rgba(0,0,0,.3); }

#Top_bar .menu > li > a { letter-spacing: 4px; font-style: normal; }

Except that we did not used anything else.

awrymag · September 2015

What do you mean by "Except that we did not used anything else."?

awrymag · September 2015

This didn't work. The header is still plain white and there is no color behind the drop-down menu items. Could you please take a look at the install and see if you can fix this?

Is there a private way for me to provide you with login details?

J

Albert · September 2015

"Except that we did not used anything else." - it means that this is whole custom css we used for header for Be|Yoga demo. Where did you pasted this css if it does not work for you? Is all you want to do, change background color of fixed header? Is that everything?

awrymag · September 2015

I gave up on a bunch of this because my client is waiting.

One thing I cannot give up on is:

Why is there no overlay under the links in the header when you click on the "menu" icon?

You can see what I mean in this screengrab:

https://www.evernote.com/l/ANfXw23GRUxOOYWOO0h12vwFGOoT8GC9pzE

Here are the color options I have chosen for Menu & Action bar:

https://www.evernote.com/l/ANdg4b1eyH9ONb7stALIKosTqArzMu-DVIM

And here are the ones I have chosen for header:

https://www.evernote.com/l/ANd6JTjxJnpLQrzQkuMqOUhvNK4Vq0HCNNY

The only Custom CSS I am using is:

/* Header */

@media only screen and (min-width: 960px) {

#Top_bar .menu > li > a { letter-spacing: 4px; font-style: normal; }

Thanks, J

Albert · September 2015

On what screen size you don't have overlay behind menu items? Which browser and computer? Because we checked your site on our side and it looks different http://pasteboard.co/Hy6xVim.png

awrymag · September 2015

See, this is what I've been telling you about random styling changes. The header looked completely different last night when I went to bed. Now, it looks the same as your screengrab, even though I haven't touched any of the settings

Furthermore, if you look at my color settings in the links I shared above, you'll see that a white header with a white header background is NOT what I have set in the settings.

It would be awesome if you could actually log in to my install and take a look at it for me, because I think you'll agree this is very weird.

J

PS. I want to repeat what I've said before. I create wordpress sites for clients for a living, so I have used a LOT of different themes from different providers and I've never seen anything like this before.

Albert · September 2015

And so far we personally built over 1000 of sites with this theme and did never noticed anything similar so we are sure it's not because of theme. All settings looks great for us and we do not see anything wrong. We checked your site once again on 4 different computers (pc's and macs) and all is good. Something must be wrong with your browser or cache on your side definitely.

awrymag · September 2015

No, all is not good.

I have set the colors to have the header background NOT WHITE as you can see in the screen grabs I sent, yet the header appears white on the site.

This is not good and it is not okay to just shrug your shoulders and blame the problem on me. You should be trying to help me solve the problem.

At the very least you could send me the proper setting for the Be Yoga theme (a screen grab of you r color and header settings would be fine) so I can try and see what is different!

Thanks. J

Albert · September 2015

We are not blaming you at all. We just tell you the truth. Maybe instead of making a lot of images with settings it will be much easier to import all options for this demo manually if you want to get exactly the same colors and settings? Please look at http://forum.muffingroup.com/betheme/discussion/6679/manual-import-of-muffin-options-panel where we explained how to import settings from pre-made layouts manually.

BeYoga Header - how to duplicate?

Comments