Topic-icon Display a CSS Facebook login button

Support Specialist
5 days 6 hours ago #67991 by mel
So the easysocial style is targeting the button with an ID of es. Easysocial adds this id in their view.
#es .btn-es-facebook {
    color: #fff !important;
    background-color: #4267b2 !important;
    border-color: #4267b2 !important;

The id is not present within the SCSocialWidget, since that is our module. The quickest way to fix this would be to remove the #es from the CSS specifier, so it would look like this:
.btn-es-facebook { color:... }
Hello there,

It's fine now for the CSS, thank you.

But, i found out that this custom button for Facebook Login always display from SCSocial Widget module even if i select "Like Button" for instance instead of "Login" in module setting.
What is the best way to insert custom Facebook login button code in SCSocial Widget module so it displays only if you select "Login" and lets other features of module work as expected when selecting?
Please find the original code as below (public_html/templates/TEMPLATE_NAME/html/mod_scsocialwidget/default.php):

 * @package         JFBConnect
 * @copyright (c)   2009-2021 by SourceCoast - All Rights Reserved
 * @license GNU/GPL
 * @version         Release v9.0.197
 * @build-date      2022/02/01
if (!(defined('_JEXEC') || defined('ABSPATH'))) {     die('Restricted access'); };
if ($userIntro != '') {
    echo '<div class="sc_social_widget">'.$userIntro."</div>";
    echo $widget->render();

Help please.
Support Specialist
1 day 11 hours ago #67995 by mel
In your override for the SCSocialWidget tmpl/default.php file, replace
    echo $widget->render();

if($widgetType == "login" && $providerType == "facebook")
    echo "blah"; //replace with your button code
else if($widget)
    echo $widget->render();
14 hours 30 minutes ago #67998 by [email protected]
Hello there,

I edited file as that in attachment, but i get an error.

File Attachment:

File Name: JFBCSupport2.txt
File Size:1 KB

Could you kindly share with me the right complete code in a text file? Thank you.

Best regards.
Social Stream
Hide. Seek. Play!

Countdown Hide & Seek Game

Countdown, the new hide & seek toy, is available now! Designed and developed by the founders of SourceCoast, it's the perfect toy to get your kids moving at all ages.

Get the Hide and Seek Toy on Amazon