Skip to main content
Jul 10, 2013 10:18 PM UTC
Solved

Social Form Fill Formatting

Hi.  Is there a way to adjust the default formatting of the social form fill icon/graphic?  I only want to use LinkedIn (not FB, Twitter) but the graphic defaults to the width of three and is mucking up the look of my landing pages. 

Thanks,

Kevin
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Accepted solution
Jul 11, 2013 11:33 AM UTC
Ideally you'd swap it for a wider button:


If this can't be done today it should be added as an upcoming enhancement.  Twitter and Facebook are important and some will insist they should be there, but Linkedin will continue to be the gold standard for B2B data quality 

9 replies

Jul 11, 2013 10:50 AM UTC
I don't think this is possible.  The width of the social buttons is also constrained by the width of the form below it and a form as narrow as 1 button isn't very practical.  Also, the prompt is also as long as the three social buttons - would you want it to wrap down to just the width of the FB icon?
Translate
Accepted solution
Jul 11, 2013 11:33 AM UTC
Ideally you'd swap it for a wider button:


If this can't be done today it should be added as an upcoming enhancement.  Twitter and Facebook are important and some will insist they should be there, but Linkedin will continue to be the gold standard for B2B data quality 
Translate
Jul 11, 2013 3:48 PM UTC
Thanks Elliott and Steven.  The width of the social button isn't constrained by the form but vice versa, at least that's how it appears to me. I cannot shorten the width of the button and my form can be no narrower than the width of the button.  Ideally, I would like to edit the text above the button to "Use LinkedIn" (for example).
Thanks!
Kevin

Translate
Jul 11, 2013 3:49 PM UTC
Steven, if you can find that button that you show in your answer, that would be an improvement too!
Thanks!
Translate
Jan 28, 2014 6:22 PM UTC
I'm subscribing as I too only need the linkedin button, and the width of the label makes our landing pages unusable
Translate
Sep 16, 2014 9:12 PM UTC
How is this marked as solved?? Using social media fill, whether 1 or all 3, makes the form VERY wide - unnecessarily. Why is there no way to access the CSS or make at least the message wrap??


Translate
Colby_Dix
Level 4
Nov 11, 2014 2:37 PM UTC
I'm with Terri. This is a pretty half assed feature that isn't well implemented. Any insight as to where to access the css on that sucker would be lvoely.
Translate
ooooh shiny.
Nov 28, 2014 2:26 PM UTC
Hi Terri,

Here is how you manage the width of the form.

Add some custom Css to your form and change the width accordingly
.cf_sign_on {
    width: 240px !important;
}



And just to add to that here is the code to replace the entire social part with just a LinkedIN button.
I am sure this should allow you to edit the code and implement your own button/style.

/* Add your custom CSS below */

.cf_sign_on {
    width: 240px !important;
  height: 30px !important;
  background: none !important;
      border: none !important;
}
.cf_synd_icon_li_sm {
background: url('http://www.acme.com/connect-with-linkedin.png') !important;
}

.cf_sign_on_caption{
      text-indent: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}
.cf_icon {
  width: 218px !important;
  height: 34px !important;
}
.cf_sign_on_button {
  width: 230px !important;
  height: 50px !important;
  border: none !important;
  background: none !important;
      text-indent: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}
 
Translate
Jun 4, 2015 7:58 AM UTC

Thanks, exactly what I was looking for!

Translate