Adding a Live Prayer Timetable to the Landing Page

Taplink has the functionality to add widgets using custom HTML code. This allows you to embed externally made widgets or pages into your landing page. Using this method, live prayer timetables can be added to the landing page. For the instructions on this page, we used the widgets provided by Islamic Finder, however you can use any other provider that has HTML embeddable code.

Instructions

1. On the Taplink Landing Page Editor, click Add block.
2. Click HTML code.
3. Paste the following code:

   <div style="text-align:center;display:flex;height:320px;">
   <iframe id="myFrame" title="prayerWidget" class="widget-m-top" style="height:100%; width:100%; border-radius:25px; font-size:20px;" scrolling="no" src="https://www.islamicfinder.org/prayer-widget/#######/1/1/0"> </iframe>
   </div>

4. In a new tab, open Islamic Finder Widgets.
5. In the search bar at the top, search your city and click on it.
6. Scroll down to the fourth widget called City prayer times.
7. Click Code.
8. You can make any additional adjustments here, such as calculation method.
9. Copy just the URL in the code after the src="" attribute in the quotation marks. It should have a form similar to https://www.islamicfinder.org/prayer-widget/#######/1/1/0
10. Replace the Islamic Finder URL in src="" in the HTML code with your new URL to set it to your city and chosen settings.
11. Click Save changes.

You can make further adjustments to the code to make the widget fit in more with your landing page's design. For example, you can change the size of the border-radius to match with the button rounding you set in the design section of your landing page.