Facebook like box

• 

  adampht · Member · Jan 30, 2015 at 2:08 pm

  • Copy link
  • Add topic to favorites

  Hi,

  I want to add a Facebook like box with html using the text widget because I cant get the Facebook Widget to look the way I want.

  I’ve tried all codes supplied by facebook but nothing works.

  What am I doing wrong?

  Here’s a link to my webpage with the like box that I want:

  http://www.adamphotography.se/About

  The blog I need help with is: (visible only to logged in users)

• 

  shawnajroberts · Member · Jan 31, 2015 at 2:19 am

  • Copy link

  There are several types of embed code that we don’t allow on WordPress.com for security reasons, such as iframes and script. You can read more about the code we do and don’t allow here:

  Add Code to Your Site

  Probably your best option here is to use the Facebook Like Box widget we provide. I can help you out with CSS customizations if you let me know how you’d like it to look.

  Let me know if I can help with anything else!

• 

  adampht · Member · Jan 31, 2015 at 2:43 pm

  • Copy link

  Ok, thanks!

  If you could help me with the CSS I would be very greatful!

  I would like it to look lika the “classic” like box, just like the one I have on my webpage: http://www.adamphotography.se/About

  Thanks a lot!

• 

  shawnajroberts · Member · Jan 31, 2015 at 3:37 pm

  • Copy link

  It sounds like you want just the like button? We don’t directly support this currently, but try unchecking all of the boxes in the widget and adding this code. Its not exactly the same as your other one, but take a look:

  #facebook-likebox-3 iframe {
  	height: 70px !important;
  }

  You’ll need to change the first bit right after the # to match your own widget’s coding, so if you need help with that add the Facebook Like box to your site and post here. I can grab the correct selector for your site.

• 

  adampht · Member · Jan 31, 2015 at 8:42 pm

  • Copy link

  Ok, I’ve added FB-box. Please help grabbing the selector.

  Thanks!

• 

  shawnajroberts · Member · Feb 4, 2015 at 5:23 pm

  • Copy link

  Sorry for the delay! Try this code:

  #widget-3 iframe {
  	height: 70px !important;
  }

• 

  adampht · Member · Feb 5, 2015 at 12:12 pm

  • Copy link

  Thanks Shawna,

  But the widget gets to wide to fit in the sidebar (that’s why its currently in the bottom right corner, I want it under the follow WP button in the sidebar). Is it really not possible to have a simple FB like button on a WordPress.com site?

  What’s the CSS to make the sidebar wider?

  Thanks

  Adam

• 

  shawnajroberts · Member · Feb 5, 2015 at 5:48 pm

  • Copy link

  The code to affect the size of the widget is going to change depending on which widget area you put it. Can you place the widget where you’d like it to appear so I can figure out the code for you?

• 

  adampht · Member · Feb 5, 2015 at 6:17 pm

  • Copy link

  Ok, it’s where I want it now.

  The current code is:

  #facebook-likebox-2 iframe {
  height: 700px !important;
  }

  Thanks

• 

  adampht · Member · Feb 5, 2015 at 6:21 pm

  • Copy link

  Sorry, 70 px

• 

  shawnajroberts · Member · Feb 5, 2015 at 7:36 pm

  • Copy link

  Thanks for doing that! Try adding this line underneath the height line:

  width: 180px !important;

  Does that look work for you?

• 

  adampht · Member · Feb 5, 2015 at 7:52 pm

  • Copy link

  Yes, that looks pretty good, thank you!

  One last thing, could you tell me how to remove the dotted borders in the sidebar?

  Thanks again

• 

  shawnajroberts · Member · Feb 5, 2015 at 7:57 pm

  • Copy link

  Oh good! I’m glad that works for you. :)

  Use this to remove those borders:

  #branding hgroup, #access, #secondary .widget {
  border-bottom: none;
  }