راه‌اندازی سریع

نکته: در صورتی که از وردپرس استفاده می‌کنید می‌توانید از پلاگین پوشه برای وردپرس استفاده کنید

برای راه‌اندازی وب‌پوش ابتدا به کنسول پوشه رفته و در صفحه وب‌سایت‌ها دکمه وب‌سایت جدید را زده و مشخصات سایت خود را وارد کنید.

تعداد مراحل برای راه اندازی حداکثر ۲ مرحله می باشد و اینکه مرحله ۲ دو بار آمده که یک بار برای محیط HTML و دیگری برای محیط npm می باشد.

مرحله ۱: اضافه کردن فایل سرویس ورکر (فقط برای سایت با پروتکل https)

نکته: در صورتی که سایت‌تان از پروتکل http استفاده می کند نیازی به این مرحله یعنی قرار دادن فایل سرویس وررکر ندارید

در روت پروژه‌تان (منظور در قسمتی از سورس سایت‌تان) که به نوعی کنار index.html و یا index.php محسوب می‌شود یک فایل جدید بسازید و نام این فایل را pushe-sw.js قرار دهید.

دقت کنید که این فایل باید در انتهای url سایت‌تان قابل دسترس باشد مثلا اگر آدرس دومین سایت https://pushe.co می باشد باید فایل pushe-sw.js توسط url با آدرس https://pushe.co/pushe-sw.js قابل مشاهده باشد.

بعد از ساخت این فایل ، کد زیر را درون این فایل قرار دهید:

importScripts("https://static.pushe.co/pusheweb-sw.js");

مرحله ۲: قرار دادن اسکریپت های کتابخانه در کد html سایت‌

نکته: در صورتی که سایت یا وب اپلیکیشن خود را با استفاده از npm یا yarn ایجاد کرده اید از ادامه این مرحله صرف نظر کرده و به مرحله ۳ بروید

برای راه‌اندازی کتابخانه پوشه کد زیر را درون کد html سایت‌تان در انتهای تگ body قرار دهید

<script src="https://static.pushe.co/pusheweb.js"></script>
<script>
Pushe.init("app_id");
Pushe.subscribe();
</script>

دقت کنید که در داخل Pushe.init به جای app_id مقدار app_id که باید آن ‌را از داخل کنسول دریافت کنید را قرار دهید

مرحله ۲: نصب کتابخانه با استفاده از npm

نکته: در صورتی که از مرحله ۲ استفاده کرده اید از این مرحله چشم پوشی کنید ، این مرحله برای وب‌اپلیکیشن‌هایی است که با ‍‍‍npm ساخته شده اند

برای نصب کتابخانه پوشه از طریق npm می توانید از طریق دستور زیر پوشه را نصب کنید:

npm i -P pushe-webpush

می توانید پوشه را به یکی از روش های زیر در کد خود import کنید:

var Pushe = require('pushe-webpush');

و یا در ES6

import Pushe from "pushe-webpush";

سپس توسط کد زیر کتابخانه را راه اندازی کنید:

Pushe.init("app_id");
Pushe.subscribe();

دقت کنید که در داخل Pushe.init به جای app_id مقدار app_id که باید آن ‌را از داخل کنسول دریافت کنید را قرار دهید ‍‍‍

در اینجا فرایند راه اندازی وب پوش تمام شده و در صورتی که مراحل بالا را به درستی طی کرده باشید باید در سایت‌تان بتوانید دیالوگ عضویت وب‌پوش را مشاهده کنید.

ادامه‌ی کار

(بر روی لینک مورد نظر کلیک کنید)

نمونه کد در گیت‌هاب

بررسی امکانات در نمونه‌ای از قبل طراحی شده دارای تمام امکانات کتابخانه‌ی پوشه

سوالات و مشکلات احتمالی

در صورتی که در یکی از مراحل زیر به مشکلی برخوردید یا هر سوالی در مورد کتابخانه‌ دارید