× Joomla Facebook Connect support forum

Topic-icon How to allign a custom set of plugin functions

Active Subscriptions:

None
Hello all, i was trying to create a custom set of buttons to put on the front page that differ from how they look on normal articles. I intend to put this in the front page article but i cannot get them to align properly. I want them to align side by side accross the top and instead they stack on top of each other. Here is the code.
{JFBCLike url=http://www.resultsrehab.com layout=standard show_faces=true show_send_button=true width=300 action=like font=verdana colorscheme=light}
{SCTwitterShare url=http://www.resultsrehab.com data_count=horizontal}
{SCGooglePlusOne url=http://www.resultsrehab.com annotation=bubble size=standard}
{JLinkedShare url=http://www.healin4soul.com/jlinked/ counter=top}

thanks you much!
The topic has been locked.
Support Specialist
12 years 2 months ago #18584 by alzander
Jaguar,
Sorry we didn't respond to your other post ( here ). I was working on the answer.

The reason it's coming up differently is because when you use our Content Plugin, we include an additional stylesheet to have those buttons show horizontally. That stylesheet isn't included when you manually add them. We're looking into the best way to correct this, as it'd be good to have the stylesheet available always. For now though, if you want to make a quick modification to a file, it will include the file on the page whenever you add the buttons.

In the /plugins/jfbcsystem.php file, at line 1188, you'll see:
private function _getSCTwitterShare($paramList)
    {
Add 2 lines directly after that, so it looks like:
private function _getSCTwitterShare($paramList)
    {
        $doc =& JFactory::getDocument();
        $doc->addStyleSheet("components/com_jfbconnect/assets/jfbconnect.css");

That will only add the stylesheet when the Twitter button is manually added, but I think will work for you. A similar thing can be done for the G+1 and LinkedIn share buttons a few lines lower in that file.

Hope that helps, but if not, or you need more info, just let us know.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
12 years 2 months ago #18656 by jaguar3d
Hello Alex, i tried adding the lines of code to the file. I saw two of them and selected the one in the plugins/system/ folder. I added the lines per the directions but after adding a banner module with the lines of code above i still see them stacking on top of each other.
On thing to note is this particular site is hosted out of godaddy under a sub directory. There are other sites hosted on the same location. Not sure if this makes a difference with the path or not. I don't get any errors though and the other regular content plugins work fine.

thanks Alex

Hugo
The topic has been locked.
Support Specialist
12 years 2 months ago #18676 by alzander
Hugo,
The sub-directory thing isn't a problem. I realized after I sent it (and I passed the question along to the developer of the social buttons stuff) that I told you an incorrect way to add the tags.

Instead of where I told you, you'll want to add those lines in the same file toward the top in the __construct function. You'll see this around line 43, and when done, your code should look like:
function __construct(& $subject, $config)
    {     
        $doc =& JFactory::getDocument(); 
        $doc->addStyleSheet("components/com_jfbconnect/assets/jfbconnect.css");
This bug has been fixed in the 4.1.2 release which is expected to be out later this week.

Hope this helps get you started... or, if you want to, just wait a few days for the updated release.

Good luck,
Alex
The topic has been locked.
Active Subscriptions:

None
12 years 2 months ago #18701 by jaguar3d
Oh ok. thank you Alex. So i understand correctly i can either do this with my site now to get the custom plugins to line up horizontally OR i can just wait for the next release. At whichi time I would do an update and then i should be able to add the same custom entries as requested and they will line up horizontally by default? Am i right in my understanding?

Thanks!!! again wonderful support on this.

hugo
The topic has been locked.
Support Specialist
12 years 2 months ago #18705 by alzander
Hugo,
That's correct. The 4.1.2 release is coming out later tonight or tomorrow and should fix it so that the CSS stylesheet is included normally. Once that's done, you can add the tags how you want, and they should go horizontal. Should you want to change that behavior, you'll have a stylesheet file that you can edit to do something different.

No problem for the support, it's what we do, and how we continuously make JFBConnect better.. through listening to feedback. Thank you!

Alex
The topic has been locked.
Active Subscriptions:

None
12 years 2 months ago #18728 by jaguar3d
Good evening Alex, I undid the last code change and put everything to stock. I then did the update and added a new banner in a position where i would like it horizontal but again they are stacked. Here is my code for the banner module i added in position of "banner 3". I also attached a pic to show you the results. Maybe I misunderstood your instructions Alex and I do apologize about that.
{JFBCLike url=http://www.resultsrehab.com layout=standard show_faces=true show_send_button=true width=300 action=like font=verdana colorscheme=light}{SCTwitterShare url=http://www.resultsrehab.com data_count=horizontal}{SCGooglePlusOne url=http://www.resultsrehab.com annotation=bubble size=standard}{JLinkedShare url=http://www.healin4soul.com/jlinked/ counter=top}

File Attachment:
The topic has been locked.
Support Specialist
12 years 2 months ago #18741 by mel
This should be a simple fix. The CSS is properly included in 4.1.2 now. However, you will need to add a div around the tags, so they pick up the proper styles.

Update your content to be the following please:
<div class="scsocialbuttons">
{JFBCLike url=http://www.resultsrehab.com layout=standard show_faces=true show_send_button=true width=300 action=like font=verdana colorscheme=light}{SCTwitterShare url=http://www.resultsrehab.com data_count=horizontal}{SCGooglePlusOne url=http://www.resultsrehab.com annotation=bubble size=standard}{JLinkedShare url=http://www.healin4soul.com/jlinked/ counter=top}
</div>
The topic has been locked.
Support Specialist
12 years 2 months ago #18765 by alzander
An alternative solution to wrapping the tags in a div is that you can simply add the following styles to your template. These will make these buttons always float left. It should work the same as the above solution, but every template and site is different.. so please test:
.sc_twittershare, .sc_gplusone, .jlinkedShare, .jfbclike { float: left; };

Alex
The topic has been locked.
Active Subscriptions:

None
12 years 2 months ago #18783 by jaguar3d
Thank you both for the quick and effective responses. Works perfectly. Alex, i will also try your suggestion to see what options i have. I mainly want the main page to have the "like" button like the main URL instead of a specific article that the content plugin associates the home page with.

Thank you all for the great support.

V/R
Hugo
The topic has been locked.