-
AuthorPosts
-
November 20, 2017 at 12:17 am #878915
my website is http://www.ichauffer.co.uk, I would like to create a button at at the bottom of page along with the social media icons where if the user click it dials the number.
Please can you help?
November 20, 2017 at 1:13 am #878927Please can you let me know what steps do I need to follow to show the phone button like it is shown in the following website, both for on desktop and on mobile (with phone icon on the side)
I found this article but couldn’t get it setup.
Thank you.
November 20, 2017 at 1:14 am #878928Since then I have found this website with a phone button in the slider.
https://www.budgetlocksmiths-edinburgh.co.uk/
How can I achieve this? I want to show the phone icon on the left as well.
November 20, 2017 at 10:54 am #879031Hi,
Please try this in the copyright field:
<a href="tel:123456789">123456789</a>
Best regards,
RikardNovember 20, 2017 at 5:11 pm #879233Hi Rikard,
Thank you for your reply.
Unfortunately it has done nothing the code displays as it is at the bottom of footer.
I even tried to copy the code in a button and still didn’t work.
Please find the login details in case you want to have a look.
Just to reiterate I want to create a button in header, anywhere in the content section and in the footer where I have insert the button and when the user clicks on it then it dials the number behind that button.
November 22, 2017 at 4:56 am #880036Hi,
Thank you for the info.
We added the “tel code” in the Enfold > Header > Extra Elements panel and modified the text block at the bottom of the front page.
Best regards,
IsmaelNovember 22, 2017 at 1:00 pm #880226Hi Ismael,
I know how to add the phone number in Extra Elements but my question is completely different ….
I want to do the following with the phone number.
– Add the phone number button with custom colour as a menu item
– Add the phone number as a button with custom colour anywhere in the website (using button element)I hope this makes sense.
Kind regards,
November 24, 2017 at 5:41 am #881051Hi,
ou can add a unique css class attribute to the link tag and then modify its style or look in the Quick CSS field. Example.
<a class="custom-phone" href="tel:123456789">123456789</a>
Quick CSS field:
.customn-phone { padding: 5px 10px; background: red; border: 1px solid blue; color: white; }
Adjust the values as needed. Please provide a screenshot of the button design that you’d like to create.
Best regards,
IsmaelNovember 24, 2017 at 12:42 pm #881148Hi Ismael,
Thank you for your reply.
I apprecaite all your help.
I have created 5 different situations where I could need a call us functionality.
1). https://www.ichauffer.co.uk (Menu item – Call Us) – As you can see it doesn’t do anything. I would like this option to only show on mobile menu and I want customer to be able to click and call.
2). I have set up a test page here https://www.ichauffer.co.uk/test-page, and have created the following types on buttons on the page.
a). Icon Box (I would like to make it click and call icon)
b). A Button Element (I would like to make it click and call button)
c). I have inserted an image call now (I would like the image to be a click and call button)I hope this will clarify things and we can finalise the thread and carry on building awesom websites using ENFOLD.
Looking forward to your response.
PS. the information you provided has helped a bit by created a section with background but the button I have created is overlaping the logo area and if I increase the size of header then my logo area become big as well. I only want to the increase the area of header where the phone number is shown.
- This reply was modified 6 years, 11 months ago by projectt_co_uk.
November 27, 2017 at 4:36 am #882091Hi,
and I want customer to be able to click and call.
You don’t need to add the whole markup in the image link. Just use the “:tel” scheme. Example.
tel:YOUR_NUMBER_HERE
Please note that the “:telYOUR_NUMBER_HERE” scheme or feature is supported on mobile devices only. It’s not going to work on desktop.
Best regards,
IsmaelNovember 27, 2017 at 1:21 pm #882203Yes, thats what I wanted …
You are a legend Ismael :)
You can close the thread now.
But before you close it please can you let me know how to increase the area of Phone number section above the header and how to remove the border line?
Once again thank you for all your help.
November 27, 2017 at 1:28 pm #882207Hi,
Glad Ismael the legend could help! :)
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:
#top #header_meta { border: none!important; } #header_meta .container { min-height: 60px; }
Best regards,
YigitNovember 27, 2017 at 1:34 pm #882213Don’t feel jealous Yigit … You are a legend as well … :)
It has worked but the coloured button I have created with Call Us text in the extra element is not showing the text in the middle of button is there any wa, it can aligned perfectly in the middle.
I have used the following code to create the button.
.custom-phone {
padding: 20px 40px;
background: gold;
border: 1px solid blue;
color: white;
}
.phone-info { font-size: 30px; }Looking forward to your response.
November 27, 2017 at 1:45 pm #882214 -
AuthorPosts
- You must be logged in to reply to this topic.