Home › Widgets › Shopify

Install guide

How to add a prayer times widget to Shopify

Add a Custom Liquid section to the page in the theme editor and paste the code there. Shopify's plain page editor can strip script tags, so Custom Liquid is the reliable path.

Steps

  1. From your Shopify admin, go to Online Store → Themes, then click Customize on your live theme.
  2. Use the page picker at the top to select the page, or a template such as the footer if you want the widget on every page.
  3. Click Add section (or Add block inside an existing section), search for Custom Liquid, and add it.
  4. Paste the embed code into the Liquid text box. Get your own version from the widget builder first.
  5. Click Save in the top right.

Good to know. We could not confirm that Shopify's plain page-content editor (the “Show HTML” mode on a Page or blog post) reliably keeps a <script> tag intact when you save — merchants have reported it stripping tags. The Custom Liquid section above is a native, documented Online Store 2.0 feature and does not have this problem, so use it instead of the page editor's HTML mode.

This is a generic starting point. Open the widget builder to set your own coordinates, timezone, and calculation method, and to build the Hijri date or Ramadan countdown widget instead.

FAQ

Frequently asked questions

Can I add it to the footer once instead of every page?

Yes. Add the Custom Liquid section or block to the theme's footer section instead of a single page, and it will appear on every page that uses that footer.

Do I need an app from the Shopify App Store?

No. Custom Liquid is a built-in Online Store 2.0 section available in the theme editor on any current theme.

Get adhan reminders on your phone

The Niyat app brings calculated prayer times, adhan notifications, a qibla finder, and the full cited dua library with you.

Keep exploring