-
Posts
-
Hello,
I was wondering if you could help me, as I’m trying to add a phone number and contact button into my main header (not the bar above). I found some documentation on it here : https://kriesi.at/support/topic/header-with-social-icons-and-bottom-use-text-instead-of-social-icons/#post-215140 , but I am not seeing the code that you’re mentioning to find in header.php, and there are also a variety of conversations for various fixes… was wondering if you could condense it and let me know what my next steps are? Thanks so much! :)
Hi ChelseaH
Please add following code to Funtions.php file in Appearance > Editor
add_action('ava_after_main_menu','logo_text'); function logo_text() { echo "<div class='logo-text'>This is my custom text!</div>"; }then add following code to Quick CSS in Enfold theme options under General Styling tab and adjust as needed
.logo-text { position: relative; top: -120px; left: 80%; }Cheers!
YigitSorry, one quick question to add to this, where do I adjust my custom content here? Is it in the functions.php page, or elsewhere? I was hoping to also add a button. Thanks :)
ChelseaHi Chelsea!
In functions.php, to add a button:
add_action('ava_after_main_menu','logo_text'); function logo_text() { echo "<div class='logo-text'>"; echo "This is my custom text!"; echo do_shortcode("[av_button label='Click me' link='manually,http://' link_target='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' size='small' position='center' icon_select='yes' icon='ue800' font='entypo-fontello']"); echo "</div>"; }Cheers!
JosueHey!
Please see the first code i posted, there is “This is my custom text!”, this is where you should change. You can simply use HTML inside it as shown here – http://pastebin.com/9GVtxqgg
But please use single quotes for HTML codesCheers!
YigitHi guys,
This doesn’t seem to work with the latest version of Enfold (v2.9) – I get a white screen of death.
Also, what would the code be if I wanted to add it to a child theme’s functions.php rather than Enfolds functions.php please? (I’m a php newbie sorry!)
Thanks,
Matt
Hey!
Please undo the changes you made on functions.php file via FTP, site should be working once again. If you do not mind, please post a temporary admin login so we can add the code for you
Cheers!
YigitHi Yigit,
Thanks. I was able to undo the change no problem and although I’m clueless when it comes to PHP you only have to give me the code and I know where to put it, I just don’t know the exact code.
Regards,
Matt
Hey!
You can copy&paste this code – http://pastebin.com/gThAyenF
Then you can style the button using following code in Quick CSS.header-button { padding: 5px; border-radius: 5px; background-color: red; color: white; }If you would like to use Enfold’s default buttons, please use the code Josue posted here – https://kriesi.at/support/topic/adding-phone-number-text-and-button-to-main-header/#post-292289
Regards,
YigitHey!
Thank you for the update.
Maybe you added an apostrophe on the custom text. Please get a new copy of functions.php then override the old one via FTP.
Regards,
IsmaelThanks for getting back to me… I’ve re-uploaded a new functions.php file, and have removed the old, and now I can work in the back end, but my site is still not showing up. I haven’t done any changes to the new functions.php page yet.
Hi!
The functions.php file should be located in the theme folder root (/wp-content/themes/enfold). Regarding the custom function try using this plugin to add it.
Regards,
JosueAhhh ok, awesome thank you!! Hopefully just two more questions (I’m working in the Functionality plugin now, and it’s working great), but I’m wondering how I format my button to be aligned with my phone number. Also, is there a way to make it so that it doesn’t increase the size of the header ?I don’t want it to look like it does now, pushing down on top of the web page content.
Hey!
Try adding this code to the Quick CSS:
#header_main_alternate .avia-button-wrap { position: absolute; left: 10px; top: 65px; }Cheers!
JosueThanks so much Josue, that worked great. The only issue I have now, though, is that there’s space beneath the menu which overlaps my slider and content below. I don’t see any padding anywhere in the css, and am not sure how to get rid of it :S Also, I would love to get my gold background beneath my text in my layer slider to cover the entire background (it only does on mobile at this point). Any pointers for that?
Hi!
Please add following code to Quick CSS as well
.html_header_top.html_header_sticky #top #wrap_all #main { padding-top: 178px; } h3.ls-l, .ls-gpuhack { left: 0!important; }Cheers!
YigitGreat, thank you! Is there a way that the phone number and quote button can float below the main logo when on mobile? Also, I’m having issues with getting my link for the button to work. Sorry for all the questions :S
Hey!
Try adding this code to the Quick CSS:
div#header_main_alternate { z-index: 10; } @media only screen and (max-width: 767px) { div#header_main_alternate { display: block; } div.logo-text { top: 0; left: 0; font-size: 0; } #header_main_alternate .avia-button-wrap { top: -6px; left: 0px; } #header { height: 120px; } }Cheers!
JosueAwesome, the only thing is that the phone number doesn’t show. Argh I am so sorry for all the questions!
I disabled it on the code because i don’t think it would fit, you can change it though, modify this part:
div#header_main_alternate { display: block; } div.logo-text { top: 0; left: 0; font-size: 0; /* Remove this */ } #header_main_alternate .avia-button-wrap { top: -6px; left: 0px; } #header { height: 120px; /* Increase this number to increase the header size */ }Cheers!
JosueOh I see! I think I prefer to just have the phone number, rather than the quote on mobile, since that makes it easier for people to call :). You must be in a different time zone than me, or else you’re working much too late :) Thanks so much for your help :)
- The topic ‘Adding Phone Number text and button to Main Header’ is closed to new replies.