Solved

CSS breaks Facebook Connect Plugin Part II

Posted on 2010-08-18
5
358 Views
Last Modified: 2012-05-10
This is a follow up to http://w.e-e.com/hHPs4P.

While the "Connect with Facebook" plugin now appears to be working, it is too long.

How do I fix that?
 s
0
Comment
Question by:DrDamnit
  • 3
  • 2
5 Comments
 
LVL 3

Expert Comment

by:WabbitSeason
ID: 33469571
Let's see, you can fix it by changing the html of the connect button, which is located in the file sfc-connect-widget.php in the plugin directory. Try replacing the function sfc_connect_shortcode with the attached one. If you want to experiment, http://fbrell.com/xfbml/fb:login-button contains some examples.
function sfc_connect_shortcode() {
        $login ='<fb:login-button perms="email" v="2" size="small" ';

        if (function_exists('sfc_login_activation_check')) {
                $login .= 'onlogin="window.location=\''. wp_login_url() . "?red$
        }

        $login .= '><fb:intl>Connect</fb:intl></fb:login-button>';
        return $login;
}

Open in new window

0
 
LVL 32

Author Comment

by:DrDamnit
ID: 33469718
It actually is the CSS. The sidebar is too narrow. I am trying to figure out which div I need to change to get the right sidebar wider and the main content just a little smaller.

I only need 20 pixels more in the sidebar.
0
 
LVL 3

Accepted Solution

by:
WabbitSeason earned 500 total points
ID: 33469818
Ah, didn't know you wanted to take that angle :-). Edit the file style.css in your template directory, changing the value after width under div#contentborder (that is the main content) and div#right-sidebar (that is the right sidebar). Be sure to subtract the same value from the main content width that you add to the sidebar width to keep things adding up correctly.
0
 
LVL 3

Expert Comment

by:WabbitSeason
ID: 33469869
Oh, and before I forget: if some areas around a post start showing up too wide after you adapted the main content width, try decreasing the widths under div.postheader, div.postfooter, div#footer and #commentform textarea with the same amount of pixels.
0
 
LVL 32

Author Closing Comment

by:DrDamnit
ID: 33470118
4,000 points on your first day. You're on your way to being one of the top experts. Welcome to EE.
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Since pre-biblical times, humans have sought ways to keep secrets, and share the secrets selectively.  This article explores the ways PHP can be used to hide and encrypt information.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question