1. Главная
2. Программирование
3. PHP
4. Laravel
5. Laravel - создание виджета Disqus

Laravel - создание виджета Disqus

воскресенье, 13 января 2019 07:57:15, написал admin

С помощью arrilot/laravel-widgets создадим свой виджет для комментариев Disqus

Вообще тем кто хочет супер быстро и просто развернуть Disqus ко всем страницам сайта - посмотрите здесь: https://github.com/yajra/laravel-disqus

Но у меня это расширение не получилось использовать. Мои комменты привязаны к идентификаторам. А в расширении идет привязка на абсолютный урл. Поэтому пришлось сделать свой виджет.

Ставим расширение https://github.com/arrilot/laravel-widgets

composer require arrilot/laravel-widgets

Выполняем

php artisan make:widget DisqusWidget

Код App\Widgets\DisqusWidget

<?php

namespace App\Widgets;

use Arrilot\Widgets\AbstractWidget;

class DisqusWidget extends AbstractWidget
{
    /**
     * The configuration array.
     *
     * @var array
     */
    protected $config = [
        'page_id' => ''
    ];

    /**
     * Treat this method as a controller action.
     * Return view() or other content to display.
     */
    public function run()
    {
        return view('widgets.disqus_widget', [
            'config' => $this->config,
        ]);
    }
}

Дальше займемся конфигом. Выполним

touch config/disqus.php

- для создания конфига под комментарии. Впишем туда shortname 

<?php
return [
    'shortname' => env('DISQUS_SHORTNAME', ''),
];

В .env добавим нашу переменную

DISQUS_SHORTNAME=your_short_name;

Займемся вью нашего виджета. Про сам Disqus подробнее здесь: https://help.disqus.com/installation/universal-embed-code

Мы же пишем в widgets.disqus_widget такой код:

<div id="disqus_thread"></div>
<script>
    /**
     *  RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT
     *  THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR
     *  PLATFORM OR CMS.
     *
     *  LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT:
     *  https://disqus.com/admin/universalcode/#configuration-variables
     */

    var disqus_config = function () {
        // Replace PAGE_URL with your page's canonical URL variable
        //  this.page.url = PAGE_URL;

        // Replace PAGE_IDENTIFIER with your page's unique identifier variable
        this.page.identifier = '{{ $config['page_id'] }}';
    };


    (function() {  // REQUIRED CONFIGURATION VARIABLE: EDIT THE SHORTNAME BELOW
        var d = document, s = d.createElement('script');

        // IMPORTANT: Replace EXAMPLE with your forum shortname!
        s.src = 'https://'+'{{ config('disqus.shortname') }}'+'.disqus.com/embed.js';

        s.setAttribute('data-timestamp', +new Date());
        (d.head || d.body).appendChild(s);
    })();
</script>
<noscript>
    Please enable JavaScript to view the
    <a href="https://disqus.com/?ref_noscript" rel="nofollow">
        comments powered by Disqus.
    </a>
</noscript>

Вызов виджета во вью:

        @widget('DisqusWidget', ['page_id' => route('blog.show', ['slug'=> $article->slug], false)]);

Поделиться статьей с друзьями: