تسهيل تثبيت Discourse كتطبيق ويب تقدمي (PWA)

I’ve been struggling getting PWA functionality with my Discourse forum (I’m on a hosted plan). I think this is mainly an issue with Chrome, not Discourse itself, but I’m hoping someone knows the answers here.

1 Is there a way to change the install settings on Chrome for Discourse once those settings have been set?

It seems like when you first open the PWA app (Discourse or other app), chrome asks if you want to install it. If you (either on purpose or accidentally) say no, the option to install goes away. Is there a way to get it back?

Similarly, if I have chosen to install Discourse as a PWA to my desktop home screen, but then get rid of the icon, I’m not finding how to “re-install” or otherwise get the icon back.

2 Is there a way to add a button to your Discourse forum to allow users to install it as a PWA (on both desktop and mobile)? This way, your users don’t have to go through the manual installation process, which most of them don’t understand.

4 إعجابات

It may depend on the OS, but I’m on Linux (Ubuntu), and it couldn’t be easier. I have a small “+” on the right side of the URL bar (just before the “favorite” icon). Clic on this, and it installs it. It changes to a “open in Discourse Meta” icon when installed. If I uninstall the PWA, the “+” comes back to allow to install it again.

And if I go into Chrome’s menu while surfing meta here, I have similarly a line “Install Discourse Meta”, which becomes “Open in Discourse Meta” once installed, and becomes again “install…” if I uninstall.

So, one icon in the URL bar + one line in the menu. At least, it’s like that for me. I wouldn’t know what to ask more :wink: You don’t have to rely on the popup message at all.

إعجاب واحد (1)

How do you uninstall the PWA? Note that in my case, for Meta, Chrome (on Mac) shows me the “open” icon in the address bar, but I can’t find the actual meta icon anywhere, so there’s not a way I am seeing to uninstall.

Where is this in the “Chrome’s menu”?


I think the key is to have a button on Discourse to install it on user’s home screens. I am aiming at users who (like most people) do not know what a PWA is, and I want a button they can click that says something obvious like “Install on home screen”.

Note that, AFAIK on Macs, there is no PWA install option on Safari.

إعجاب واحد (1)

Open it and select “Uninstall Discourse Meta” in the menu.
First step: Actually install the PWA. I have a feeling an “open” icon may not be related to this at all.

How long is actually your menu ? It’s one of the lines, around the middle. Not in any sub-section, it’s directly in the main menu (at least it is on Chome on Ubuntu). Sorry, it’s a little difficult for me to provide a screenshot currently.

Mac users :joy:

إعجاب واحد (1)

I think you’re describing something that’s totally different from what I see on Chrome on my Mac.

Is there a way to add a button to discourse to install it as a PWA? I’m fairly confident there’s a way to do it by adding html and javascript code on the front-end; checking to see if anyone has done it before.

Here’s Chrome on my mac, the menu is top right on the PWA:

I found How to provide your own in-app install experience  |  Articles  |  web.dev, perhaps you could build a Theme Component?

There are several very useful PWA Topics on Meta. Might be more info there …

إعجاب واحد (1)

Ah–the key is that the app has to be open already in PWA-mode to see that option (option is not there if open with normal url-mode). On my own forum, I seem to have lost entirely the button to install as a PWA (used to be there…)

I understand that building a button for the user to simply be able to install the app as PWA would probably require a new theme. My question is whether folks have tried that before. I don’t see a topic on meta about that specifically, though I may be missing it.

3 إعجابات

Perhaps @falco might have thoughts on this, but as I see it, this is mostly up to the browser developers.

We do try very hard to tick all the boxes to be a good PWA citizen in Discourse, and stay abreast of all the latest PWA standards because we believe deeply in the PWA concept.

8 إعجابات

What is a “install setting” ?

Discourse does this out of the box. If a user meets both Chrome criteria and is TL1+.

This is tweaked to only occur on mobile, as it would be a bit annoying on Desktop. At least until Chrome launches tabbed mode for PWAs in Desktop.

6 إعجابات

Aha, I thought you guys had done some magic on this already :slightly_smiling_face:

Is this the setting that says: “Displays DiscourseHub app banner on iOS devices to regular users (trust level 1 and up)”?

And (while I understand why you don’t have it set out of the box to work on desktop)–is there a way to have this appear on desktop too? Maybe its some code required in a plugin.

I just meant to be able to install it, and then later uninstall it. What I missed was made clear from earlier in the discussion–that there is an option for this, but you only see it if you have opened the app in PWA mode.

No. DiscourseHub is our app listed in the Google Play and Apple App Store.

And that is completely under the browser control, so there is nothing we can do about how uninstall works.

3 إعجابات

I can confirm PWA is working great on my Chromebook at least! I have PWA set up for both Meta and our internal Discourse :muscle:

3 إعجابات

You have to launch the PWA from either Launchpad or by double-clicking the icon in ~/Applications/Chrome Apps and the uninstall option will appear on the menu.

If it launches in a normal Chrome window instead of as a PWA, just delete the icon in the Chrome Apps folder. The only difference between these methods is the former will offer to cleanup the site data in Chrome and the latter won’t. :slight_smile:

Got it. Thanks for that detail.

Is there a setting in the dashboard that controls this then? I’m not finding it.

Is there a way to have the “install” prompt appear on discourse for desktop like it does for mobile?


p.s. It’s awesome that Discourse supports PWAs. PWAs are a gift to developers, move the open web forward, and all sorts of other good things.

إعجاب واحد (1)

لا أستطيع أيضًا معرفة كيفية إعادة تثبيت تطبيق الويب التقدمي (PWA)، وأتمنى وجود خيار في القوائم أو الإعدادات يقوم بنفس الغرض الذي يحققه هذا الإشعار:

image

كيف أعود إلى ذلك مرة أخرى؟ حاليًا، على جهاز أندرويد/متصفح كروم، لا أستطيع العثور على أي طريقة لتثبيت التطبيق. كل ما أستطيع فعله هو استخدام كروم لإضافته إلى الصفحة الرئيسية. هل هذا هو نفس الشيء؟

بشكل ما، لا يبدو الأمر كما لو كان نفس الشيء، لأنه يضع أيقونة كروم فوق أيقونة موقعي. ومع ذلك، أعتقد أنني أستقبل الإشعارات.

في إصدار Chrome Beta الحالي على أندرويد، يظهر لي هذا على Meta: (“تثبيت التطبيق”)

في إصدار Chrome Stable الحالي على سطح المكتب، يظهر لي هذا على Meta:

@riking شكرًا لك. لكن بالنسبة لي، في متصفح كروم، لدي فقط خيار “التثبيت على الصفحة الرئيسية”. وأود حقًا استعادة نافذة الحوار/المنبثق مرة أخرى، لكنني لا أعرف كيف.

تحديث: أنت محق، حتى بعد إلغاء تثبيت Meta، أجد في قائمة كروم خيار “تثبيت التطبيق”.

لماذا لا ينطبق ذلك على موقع discourse الخاص بي: community.morphmarket.com؟ نحن نستخدم SSO، لكنني لا أستطيع التفكير في أي شيء آخر مميز هناك. أم أن الأمر يتعلق بحالة خاصة دخل إليها هاتفي Pixel 3 الآن؟

كما ذكرت، يبدو نوعًا ما أن التطبيق مُثبَّت بالفعل لأنه يعمل بشاشة كاملة، لكن ذلك تم عبر “الإضافة إلى الشاشة الرئيسية” وليس “تثبيت التطبيق”.

إعجاب واحد (1)

لأنك تستخدم ملف JPG لشعار موقعك. انتقل إلى إعدادات الموقع وقم بتحميل ملف PNG في manifest icon.

3 إعجابات

@Falco، واو، لم أكن لأخمن ذلك. لقد قمت بتحويل الصورة إلى صيغة PNG وقمت بتحديث الأيقونة الوحيدة، لكنني لم ألاحظ أي تأثير حتى الآن فيما يتعلق بـ PWA. هل هناك ذاكرة تخزين مؤقت يجب مسحها على الموقع أو على هاتفي؟

لقد قمت بتحويل شعارك إلى صيغة PNG وقمت برفعه على موقع الاختبار الخاص بي الذي يعمل بأحدث إصدار، ويعمل بشكل ممتاز. على موقعك، لا أزال أرى صورة بصيغة JPG في ملف الويب مانيفست.

هل قمت بتعديل القيم الافتراضية لإعداد الموقع “جودة تحويل PNG إلى JPG”؟

5 إعجابات