Есть куча решений в инете, но всё же методом исследования вывел в joomsocial вот это на всплывающем окне

CSS не правлю пока, ибо суть была не в красоте а в том, чтобы убрать окно с формой входа и заменить его авторизацией через соц сети

Требуется: компоненты Slogin и Jomsocial

1. Добавление на всплывающее окно позиции с выводом модуля Slogin

адрес редактируемых файлов

url сайта/components/com_community/templates/jomsocial/layouts/ajax.login.php

второй файл на всякий случай тоже поправил (не поняв когда он срабатывает)

url сайта/components/com_community/templates/jomsocial/layouts/frontpage/guest.php

после строки с кодом

<?php echo $fbHtml; ?>

в том и другом файле вставляем

<div class="jsoclogin">
<div class="jsoclogintitle"><?php echo JText::_('COM_SLOGIN_AUTO'); ?></div>
<?php
$document = & JFactory::getDocument();
$renderer = $document->loadRenderer('modules');
$options = array('style' => 'xhtml');
$position = 'jsoclogin';
echo $renderer->render($position, $options, null);
?>
</div>

где:

jsoclogin - созданная мною позиция для модуля SLogin

COM_SLOGIN_AUTO - добавленная языковая константа "Авторизоваться через соц сети:"

2. С помощью css решаем проблему отсутствия иконок для авторизации

span.vkontakteslogin {
display: inline-block;
background-image: url(http://ВАШСАЙТ/images/vk.png);
background-repeat: no-repeat;
height: 50px;
width: 50px;
}
span.vkontakteslogin:hover{
text-decoration:none;
}
span.facebookslogin{
display: inline-block;
background-image: url(http://ВАШСАЙТ/images/face.png);
background-repeat: no-repeat;
height: 50px;
width: 50px;
}
span.facebookslogin:hover{
text-decoration:none;
}
.slogin-buttons .facebookslogin, .slogin-buttons .vkontakteslogin {
background-position: 0 !important;
opacity: 0.7;
}

иконки, если нужны, прикреплены к материалу

3. Скроем форму авторизации с помощью добавления в css шаблона 

.mfp-content form {
display: none !important;
}