Answered

white border on Embed in a web page -button


Badge

how to get rid ofthe of white color around  the buttons?

I can easily change the button colour, but the white border somehow not. At least I cant find where … :(

please help - THANKS

icon

Best answer by Liz 1 April 2021, 16:36

View original

11 replies

Badge

is there any possibility to use my own buttons with the typforme functionality?

Userlevel 7
Badge +5

Hi @chris2021 thanks for stopping by! Would you mind sharing the URL where your form is embedded and any screenshots of the issue? 

As for buttons, are you looking to add the form to your own button on your site? If so, I’d suggest taking a look at our Embed SDK, which will give you a bit more flexibility with the embed!

Badge

Hey Liz, thanks for your answer - the coding secrtio is a bit too much for me. Will ask A PROGRAMMER IF THERE IS NO OTHERWAY …

 

ANYWAY, the white boarder of the “jetzt starten” button is here. The button also has to be in the middle of the column - how do I do that?:

 

https://neckattack.net/staedte/mobile-massage-muenchen-test/

 

THANKS for your help! cheers chris

 

Userlevel 7
Badge +6

@chris2021 - from a user here.. 

in your embed code area, put the <center>     …. </center>  tags around the code and it should show up ok.. 

Userlevel 7
Badge +5

Hi @chris2021 looking at the code, are you using a custom button of your own or adding the code into a module on Wordpres? If so, both of these can cause the white spacing issue. Or, if you could send a screenshot of how you’re adding the code to your site, this will help me more specifically. :) 

Badge

Hey Liz … OK, sure. Here is the screenshot. I am using wordpress, right! But as “unfiltered HTML”:

 

see attachment

 

Userlevel 7
Badge +5

@chris2021 thank you! I looked at the code and because the typeform code is being placed into a block, the block is automatically adding a white background. I tried editing the code on my end to match the border color you’re seeing, and this code should change that border color to be the same color you currently have. Would you mind adding: 

border-color: #313131

to your Typeform code? It should look something like this: 

style="display:inline-block;text-decoration:none;background-color:#313131;color:white;cursor:pointer;font-family:Helvetica,Arial,sans-serif;font-size:20px;line-height:50px;text-align:center;margin:0;height:50px;padding:0px 33px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:bold;-webkit-font-smoothing:antialiased;border-color: #313131;-moz-osx-font-smoothing:grayscale;"

 

(I didn’t paste the entire code in case it then just added the Typeform directly into this post.)

 

Hopefully that makes sense!

 

Userlevel 7
Badge +5

Hi @chris2021 did that solution work for you?

Badge

hey Liz .. well, I have the same or a similar problem at the moment … its kind of nor very nice to your button design form .. :(

 

I need now a button in whit, without boarder and black or grey text, how can I add those parameters?

 

border-color

… what else? text-color??

Badge

by the way, a mouseover effect of the button would be nice. Any Idea how to do that`?

Userlevel 7
Badge +5

Hi @chris2021 We don’t have a hover option, but most of these settings can be edited when you click on the embed options in the share panel. Have you given this a look recently? We’ve made a few changes since the last time we chatted to add some more features! :grinning:

Though, it isn’t possible to change the button text color yet. :\

 

Reply