custum login page

Hi everyone

I have built a custom login page for my elgg site using elgg_view_form('login'); I am also using third party login through HybridAuth plugin (https://elgg.org/plugins/1314997).

My login form works perfectly but third third party login icon are not displayed on my login form. But following string is displayed  'or connect with' but no icon for social media providers user the string or connect with'. When I disable my custom login form everything works perfectly.

Could someone help me to know what's wrong with my process ?

Best regard

 

  • We can not help you without the code of your custom login form

  • I have built a simple plugin and my source code looks as followed.

    start.php l

    <?php
    
    
    elgg_register_event_handler('init','system','pessek_theme_init');
    
    function pessek_theme_init() {
    
    elgg_register_event_handler('pagesetup', 'system', 'pessek_theme_pagesetup', 1000);
    
    elgg_extend_view('css/elgg', 'pessek_theme/css');
    
    elgg_register_plugin_hook_handler('head', 'page', 'pessek_theme_setup_head');
    
    elgg_register_js('respond', 'mod/pessek/vendors/js/respond.min.js');
    
    elgg_load_js('respond');
    
    if (!elgg_is_logged_in()) {
    
    elgg_unregister_plugin_hook_handler('output:before', 'layout', 'elgg_views_add_rss_link');
    
    }
    
       elgg_register_plugin_hook_handler('index','system','pessek_index');
    
    }
    
    function pessek_index() {
    
        if (!include_once(dirname(dirname(__FILE__)) . "/pessek/index.php"))
    
            return false;
    
        return true;
    
    }
    function pessek_theme_setup_head($hook, $type, $data) {
    
    $data['metas'][] = array(
    
    'name' => 'viewport',
    
    'content' => 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0',
    
    );
    
        $data['metas'][] = array(
    
            'name' => 'mobile-web-app-capable',
    
            'content' => 'yes',
    
        );
    
    
        $data['metas'][] = array(
    
            'name' => 'apple-mobile-web-app-capable',
    
            'content' => 'yes',
    
        );
    
    
    $data['links'][] = array(
    
    'rel' => 'apple-touch-icon',
    
    'href' => elgg_normalize_url('mod/pessek/graphics/homescreen.png'),
    
    );
    
    
    return $data;
    
    }
     
    index.php
     
    <?php
    
    if (elgg_is_logged_in())
    {
    forward ('activity');
    }
    
    ?>
    
    
    <!DOCTYPE HTML>
    
    <html>
    
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    
    <link rel="stylesheet" type="text/css" href="mod/pessek/css/form_style.css" />
    
    <link rel="stylesheet" href="mod/pessek/css/skel.css" />
    
    <link rel="stylesheet" href="mod/pessek/css/style.css" />
    
    <link rel="stylesheet" href="mod/pessek/css/style-wide.css" />
    
    </head>
    
    <body class="landing">
    <section class="main">
    
    <?php
    
    echo elgg_view_form('login');
    
    ?>
    
    </section>
    
    </body>

     

    Best regard


    </html>

  • index.php

    and

    function pessek_index() {
    
        if (!include_once(dirname(dirname(__FILE__)) . "/pessek/index.php"))
    
            return false;
    
        return true;
    
    }

    This is a wrong code.

     

    Look at this example that calls this page which displays a new page's type included this element.

    You can override last example element added your existing template with CSS etc (don't forget about PHP syntax and path-to-your-assets rewrited with Elgg -- see above example code).

    P.S.: code from 2015 and requires the refactoring. But it's works very well with latest Elgg.

     

     

  • I still have some troubles. I css view cannot be loaded and I dont know why. I did the following

    start.php

    <?php
    
    elgg_register_event_handler('init','system','pessek_theme_init');
    
    function pessek_theme_init() {
            
    elgg_register_css('pessek.css', elgg_get_simplecache_url('css', 'pessek/core'));
    elgg_register_simplecache_view('css/pessek/core');
    elgg_load_css('pessek.css');
    
    elgg_register_plugin_hook_handler('head', 'page', 'pessek_theme_setup_head');
    
    if (!elgg_is_logged_in()) {
    elgg_unregister_plugin_hook_handler('output:before', 'layout', 'elgg_views_add_rss_link');
    }
       elgg_register_plugin_hook_handler('index','system','pessek_index');
    }
    
    function pessek_index() {
        require_once dirname(__FILE__) . '/pages/index.php';
        return true;
    }

    The I have created my css view in mod/pessek/views/default/css/pessek/core.php

    But My CSS view is not loaded. I dont know what's wrong with my code 

    Best regard

     

  • Instead of

    elgg_register_css('pessek.css', elgg_get_simplecache_url('css', 'pessek/core'));
    elgg_register_simplecache_view('css/pessek/core');
    elgg_load_css('pessek.css');

    Try

    elgg_extend_view('elgg.css', 'css/pessek/core');
  • Still not working... I dont know what's wrong

  • 1. Your CSS file must be to locate in mod/pessek/views/default/css/pessek/core.php

    2. Move your plugin at the bottom on Plugins page

    3. Flush the caches

Beginning Developers

Beginning Developers

This space is for newcomers, who wish to build a new plugin or to customize an existing one to their liking