Rozwiązany problem – Wtyczka Disqus nie działa na nowych szablonach WordPress

Rozwiązany problem – Wtyczka Disqus nie działa na nowych szablonach WordPress. Namęczyłem się w znalezieniu rozwiązania jak aktywować a w zasadzie co zrobić by poprawnie działała wtyczka Dusqus na moim szablonie.

Nie będę teraz pisał dlaczego chciałem to zrobić bo swoje racje dotyczące zdecydowania się na tą wtyczkę opiszę w artykule o samej wtyczce (recenzja).

Wtyczka Disqus nie działa – przyczyny

W tym poradniku chciałem opisać rozwiązanie tego problemu. A dlaczego ten problem się pojawia? Otóż jeszcze kilka lat temu szablony do WordPress były po prostu mało skomplikowane. Oczywiście ktoś powie, że były mocno zaawansowane ale naprawdę przez te kilka lat stały się jeszcze bardziej zaawansowane. Obecne szablony do WordPress są potężnymi kombajnami. Zauważyłem, że w przypadku niektórych motywów ilość wtyczek, które muszę zainstalować dodatkowo mocno spada. Po prostu szablony mają już tyle funkcji, że nie potrzebuję dodatkowego wsparcia.

Dodając do tego silnie rozbudowujące się wtyczki (np. do SEO) o nowe funkcje to okazuje się, że generalnie potrzebujemy coraz mniej “narzędzi” bo dostajemy potężne zestawy.

Kolejną przyczyną pojawiających się problemów z poprawnością działania Disqus jest po prostu totalny spadek popularności tej wtyczki. Znów pominę tu moją opinię (zostawię sobie to na recenzję). Warto jednak podkreślić, że ewidentnie twórcy szablonów (ci przynajmniej najlepsi) starają się testować poprawność działania swoich szablonów z wtyczkami. Ale tylko tymi najpopularniejszymi. A jeżeli tak to po prostu naturalną koleją rzeczy jest to, że zaprzestali wspierać kompatybilność tej wtyczki z swoimi szablonami.

Co więcej! Obecny trend wskazuje na ponowne odkrywanie Ameryki czyli powrót do natywnych komentarzy CMS WordPress. Czyli na blogach mamy standardowy (taki jak w instalacji CMS) system komentarzy. Po tzw. “tyłku” dostali wszyscy dostawcy systemów komentarzy. Po prostu ludzie przestraszyli się, że historia się powtórzy (nadmienię tylko informację, że powrót po wielu latach korzystania z Disqus do natywnego systemu komentarzy był niemożliwy albo raczej możliwy ale okraszony stratą komentarzy – tych najstarszych).

No ale pomijając te kwestie są zapewne tacy straceńcy jak ja co się uparli na wtyczkę Disqus. I natknęli się na problemy.

Wtyczka Disqus nie działa – od wielu lat bez wsparcia!

Proszę się nie martwić, że przy wyszukaniu tej wtyczki z repozytorium wtyczek na poziomie admina w CMS WordPress zobaczymy adnotację, że od wielu lat nie była aktualizowana oraz nie jest testowana z najnowszą wersją CMS WordPress. Ona działa. Sam niedawno (kilka dni temu) zainstalowałem ją na kilku moich stronach internetowych (np. BeVario Aquatic) i stwierdzam, że wtyczka ta działa wyśmienicie. Oczywiście mówię o efekcie końcowym.

Wtyczka Disqus nie działa – cache?

Cache? Ale o co chodzi? Chodzi o to, że wtyczka może działać poprawnie i poprawnie wyświetla się na postach ale mamy jeszcze starą zapisaną wersję strony w sytuacji jeżeli korzystamy z wtyczek do cache (przyspieszania działania stron). Wystarczy wyczyścić cache i odświeżyć stronę.

To powinna być nasza pierwsza czynność. Jeżeli to nie pomogło to znaczy, że problem leży w innym miejscu.

Wtyczka Disqus nie działa – szablon

Zakładam, że sama instalacja wtyczki jest prawidłowa. Zakładam, że przeszliście etap sprawdzenia cache. A jak sprawdzić czy nasz szablon nie jest za dużym kombajnem i nie pozwala zastąpić swojego systemu komentarzy (opartego na natywnym systemie komentarzy WordPress)?

Wystarczy przejść na chwilę na szablon podstawowy (kojarzycie te motywy typu Twenty Twenty-Three? One się instalują z bazową wersją CMS WordPress).

Czyścimy po przejściu na nowy motyw cache (! pamiętać) i odświeżamy stronę. Jeżeli wtyczka Disqus nie wyświetla poprawnie komentarzy to znaczy, że prawdopodobnie źle zainstalowaliśmy samą wtyczkę i źle podpięliśmy usługę.

A jeżeli poprawnie wyświetla to oznacza, że nasz szablon marudzi. No i jak wyjść z tego klinczu?

Wtyczka Disqus nie działa – potrzebujemy kod

Próbowałem rozwiązać swój problem z wywołaniem działania wtyczki poprzez shortcodes ([js-disqus]) a także poprzez kod umieszczający ten shortcodes (php + shortcodes czyli <?php echo do_shortcode(‘[js-disqus]’); ?>). To nie działało poprawnie. Dopiero zaimplementowanie pełnego kodu pobranego z strony Disqus pomogło.

Kod wygląda tak:

<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 = PAGE_IDENTIFIER; 
    };
    */
    
    (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://EXAMPLE.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">
        comments powered by Disqus.
    </a>
</noscript>

Tu mała ale istotna adnotacja: musimy zamienić w tym kodzie EXAMPLE na odpowiedni “Shortname”. A co to jest? Jeżeli rejestrujemy Disqus dla strony internetowej uzyskujemy skróconą nazwę projektu czyli ten “Shortname”. Jeżeli chcecie więcej przeczytać to daję link do źródła.

Kolejną ważną sprawą jest to, że by kod ten poprawnie działał potrzebujemy widżetu obsługującego HTML.

Wtyczka Disqus nie działa – implementacja do szablonu

Opiszę te rozwiązanie na bazie szablonu Newspaper. Szablon Nespaper jest o tyle łatwym do pokazania jak sobie poradzić z wtyczką Disqus, która nie działa poprawnie, bo ma ten motyw rozbite “punkty dostępowe” do poszczególnych wyświetlanych elementów w ramach tzw. szablonów tych elementów.

Mamy szablon artykułów – zmieniając ten szablon automatycznie wdrażamy zmiany do każdego przeszłego czy przyszłego artykułu. W przypadku innych motywów WordPress musimy albo zastosować odpowiednie widżety albo niestety wejść już w php motywu, odnaleźć fragment odpowiadający za wyświetlanie komentarzy i go zmienić. A także czasami zmienić arkusz stylów.

Wtyczka Disqus nie działa – walczyć za wszelką cenę?

W mojej opinii jeżeli mamy sytuację wymagającą naszych dużych prac czy zmian w szablonie to zalecam po prostu zmianę szablonu albo nie korzystania z tej wtyczki. Dlaczego? Wystarczy mała aktualizacja szablonu by znów wtyczka przestała poprawnie wyświetlać komentarze. Cała nasza praca pójdzie na marne a nasz wysiłek można określić mianem “bez sensu”.

Więc jeżeli do etapu poprawnego umieszczenie widżetu wyświetlającego nowe komentarze i bez modyfikacji całego szablonu wyłączenie wyświetlania starych komentarzy nam się to uda to możemy działać. W przypadku szablonu Newspaper wszystko powinniśmy zrobić na etapie modyfikacji szablonu artykułu. Wszystko co ponadto stawia pod znakiem zapytania sens naszej pracy.

A więc likwidacja widżetu pokazującego komentarze (natywne) i wstawienie w to miejsce widżetu obsługującego kod powinno załatwić sprawę. Oczywiście czyścimy cache strony i możemy cieszyć się (powiedzmy) w pełni działającą wtyczką Disqus.

Powiązane artykuły

Komentarze