-
AuthorPosts
-
August 8, 2017 at 7:11 pm #836017
Hi,
I’d like to display the phone number left to search icon in the top nav instead of the top bar.
What would be the easiest steps to do it please?Thanks a lot for your help
August 9, 2017 at 2:34 pm #836425Hey sdachos,
You could try to add a widget to the header: http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/
Best regards,
RikardAugust 9, 2017 at 5:10 pm #836503Hi
Thank you for your help,
after looking up in the widget I was able to add the phone number.
But I can’t add the phone icon before the text phone number, how do I add this first icon from this list:
http://fontello.com/#search=phoneAlso, I’d like to have the font of the menu a little bolder too, where should I do the modification for this?
Thanks a lot again for your help
August 14, 2017 at 6:30 pm #838864Hi,
You can go ahead and create a new page as a demo, add the icon inside from the shortcodes and then copy ( switch to text editor )
and copy that and add it on top inside the widget.
This is how it works and you can do it for other stuff also if you need.Thank you
Best regards,
BasilisAugust 14, 2017 at 10:02 pm #838968thank you,
it worked.August 15, 2017 at 10:26 am #839158Hi,
Great, glad you got it working. Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
RikardAugust 15, 2017 at 3:39 pm #839351The only last thing is: is there a way to reflect vertically the icon? Usually phone icons are display tilting the other way …
Thanks again a lot for your help
August 17, 2017 at 4:25 pm #840474Hi sdachos,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
#menu-item-3294 .av-icon-char:before{ -webkit-transform: rotate(130deg); -moz-transform: rotate(130deg); -ms-transform: rotate(130deg); -o-transform: rotate(130deg); transform: rotate(130deg); display: inline-block; }
If you need further assistance please let us know.
Best regards,
VictoriaAugust 17, 2017 at 5:29 pm #840522Awesome it works!
With this code is it adding the zoom effect?
Is it possible to just have the icon displays without effect?Thanks again a lot
August 19, 2017 at 6:29 pm #841352Hi sdachos,
No, this code just rotates the icon, no zoom there.
Best regards,
VictoriaAugust 22, 2017 at 9:20 pm #842777Thank you,
so how do I stop the zoom animation and only displays the icon?August 23, 2017 at 12:52 pm #842998Hi sdachos,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
#menu-item-3294 .avia_transform .avia_start_delayed_animation.av_font_icon { -webkit-animation: none; animation: none; -webkit-transform: none; -ms-transform: none; transform: none; }
If you need further assistance please let us know.
Best regards,
VictoriaAugust 23, 2017 at 3:11 pm #843058Thank you,
I added the code
– first only either in quick css or custom.css
– then in bothbut none of options worked. Should I do it differently?
August 23, 2017 at 4:03 pm #843116Hi sdachos,
Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?
Best regards,
VictoriaAugust 23, 2017 at 5:36 pm #843196Ok,
I added them below.Let me know if you can access.
Thank you again lotsAugust 25, 2017 at 1:13 pm #843932Hi sdachos,
Cannot stop animation for some reason. It appears fast, but in your case there are parse blocking errors in JavaScript and so animation kind of lags.
Best regards,
Victoria- This reply was modified 7 years, 4 months ago by Victoria.
August 25, 2017 at 3:14 pm #844021I agree the animation is feels weird now.
If it is not possible to remove animation, then I’ll revert back to old animation. Do I simply replace the code in Quick CSS or you modified other files?Thanks again for checking this animation issue.
August 28, 2017 at 6:07 pm #844937Hi sdachos,
Yeas, I think it’s better to remove the latest code I gave you.
Best regards,
VictoriaAugust 28, 2017 at 6:33 pm #844955Thank you, I revert it back.
I’m not sure if it was from the previous code but the phone icon in mobile menu is in same orientation the same than desktop.
Which line should I add to make it similar?August 30, 2017 at 3:04 pm #845828Hi,
I added following code to Quick CSS
#header .av_font_icon { -webkit-animation: none !important; animation: none !important; opacity: 1 !important; -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; }
Please review your website
Best regards,
YigitAugust 30, 2017 at 7:02 pm #845918Thank you so much Yigit!
For the mobile menu, which code should I add to have similar orientation of the icon?
August 30, 2017 at 8:33 pm #845954Hey!
Please add following code to Quick CSS as well
.av-active-burger-items .av-icon-char:before { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); display: inline-block; }
Regards,
YigitAugust 30, 2017 at 9:01 pm #845962Thanks so much again Yigit, it worked.
August 30, 2017 at 11:36 pm #846010Hi,
You are welcome! :)
For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/
And if there are features that you wish Enfold had, you can request them and vote the requested ones here – https://kriesi.at/support/enfold-feature-requests/
For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you :)Best regards,
Yigit -
AuthorPosts
- The topic ‘How to add phone number in top nav instead of top bar?’ is closed to new replies.