Best Quran WordPress Plugins

Best Quran WordPress Plugins Collection | Radio & Text 2020

WordPress is the largest CMS for websites and covering around 34% worldwide. A large number of Muslims want to offer their users a great experience of listening to the Holy Quran, especially when it’s multilanguage and audio in the original Arabic language. Today, we’re here with the solution (plugins) that will fulfill your needs in a perfect way. Read the complete install and must-use and basic plugins install + setup here.

The following are free WordPress plugins, available on the WordPress plugin directory. I’m very excited to share the list with you!

All plugins, except first, may show you the error that the version of the plugin isn’t tested with your WordPress version. To avoid further version issues into your WordPress site, simply install the test WP site, test the plugin if works install on the main site, remember to save the backup first. Let your users feel the Quran of Allah.

Best Quran Translation, Recite and Radio WordPress Plugins 2019

1. Quran multilanguage Text & Audio
2. Holy Quran random verse Multilanguage
3. Quran Radio
4. Internet Quran Radio

Excellent

We've listed 4 best and popular officially approved plugins on WordPress that will work for your website like a charm. Listed plugins are all free and at the moment working perfectly. All the mentioned plugins are personally tested.

User Rating: 4.79 ( 37 votes)

Tip: If you get errors while installing the plugins, read this guide to solve common issues (remember to take a backup first).

1. Quran multilanguage Text & Audio

Download/View | Demo | Compare | Setup Guide
Quran multilanguage Text & Audio WordPress plugin

Quran multilanguage Text & Audio WP plugin

The plugin is fully free to be used on any WordPress based website. The plugin has around 29 languages for the translation of the Verses/Quran. You can select the language you want to read the translation in and it will reload and show your text translation. The Audio Version of the Quran comes in the best 32 Sheikhs.

Setting up the Quran using this plugin is very simple by using the shortcode [quran]. We personally installed the plugin and it worked really great. The best part was the audio files (mp3 source) is loaded from the author’s websites, so no need to worry about the storage and bandwidth on your hosting servers.

The Plugin has 5 frames that can be used in the post where it will load the Quran data. You’ll get an option to choose default Sheikh voice (Arabic), a text used in languages and other select boxes, some color selection, and custom CSS options. The plugin can be used in posts or widgets and contains an admin area.

2. Holy Quran random verse Multilanguage

Download/View | Demo | Compare | Setup Guide
Holy Quran random verse Multilanguage wordpress plugin

Holy Quran random verse Multilanguage WP plugin

This plugin is also from the same author above and is a widget actually but having an extra feature which is called random. It will play random Surah from the available. The plugin doesn’t have an admin area, it can only be found in the widget list at Appearance > widgets Quran random verse: Random Quran Verse.

You’ll get many customizations over there in the widget like choosing default audio of Sheikh to recite the verse in Arabic also choose the default translation language from available 5 reciters and 24 translation languages. The audio files are loaded from the author source and aren’t locally downloaded to your hosting server.

When the plugin is installed, it will show you Surah | Ayat | Translation. It will only load 1 Ayah at a reload. Like if there is a visitor on your website he can see 1 Ayah translated or audio to listen to more, he must reload the page. After a reload or visiting the 2nd page it will load random Ayah not keep showing the next Ayah of the old loaded page.

The plugin hasn’t an option to be used in the post. It can only be used into sidebars, headers or footers. To read step by step installation, common error’s solution and setup click here.

3. Quran Radio

Download/View | Demo | Compare | Setup Guide
Quran Radio WordPress plugin

Quran Radio WordPress plugin

This plugin is basically a widget but also can be used in posts/pages using their shortcode [1]. The plugin contains an admin area having a lot of customization options like choosing default translation language, the text shown as the title of the widget, default players (HTML 5 and Jplayer), icons (Android, Facebook, Source, Download, etc).

The main difference in this plugin is that it will translate the Surah into audio files, not into text like when a Verse is being played before the next system will auto add translation in the selected language then it will auto move to the next verse in Arabic. It has a stock of 40 verses in their server works 24/7.

The widget doesn’t allow user to choose the language of the translation. To read more and step by step guide on install and usage, visit here.

4. Internet Quran Radio

Download/View | Demo | Compare | Setup Guide
Internet Radio Quran WordPress Plugin

Internet Radio Quran WordPress Plugin

The plugin helps you to have Quranic recite on your website. The plugin is less featured than the above 3 plugins. It contains around 124 radios LIVE audio streaming in 13 translated

With this plugin, you’ll have some customization options like choose radio (many reciters in Arabic and 13 with Arabic + translation), Radio title, player height, and autoplay. The plugin only supports HTML 5 player.

The player used in the plugin has a pause button to pause the current being played Quranic Ayat. The best part with this plugin is if you’re staying on the page it will start downloading the old part of the Surah till the live so you will get working forward-back buttons till the LIVE.

The streams aren’t hosted locally on your server. The plugin used the shortcode R[*], so it can be used in pages and posts including widgets.

These are few freely available plugins that can be found in your WordPress plugin directory (hosted or not hosted).

Comparison

Quran multilanguage Text & AudioHoly Quran random verse MultilanguageQuran RadioInternet Quran Radio
Audio ☑
Translation ☑
Radio ✘
Random ✘
Reciters 325
Translation Languages 29244013
Autoplay ☑
Widget ☑
Pages/Posts shortcode ☑
Third-party source ☑
Admin Area ☑
Custom CSS ☑

These plugins can be installed via offline WordPress using the Xampp server. Installation is basic, If you’re installing from wp plugins directory just click on install and activate if downloading the plugin, go to Plugins > Add New > Upload Plugin > Select File > Install Now > Activate or read guide.

I hope these plugins will help you setting up your site perfectly. If you liked my work, share it with your friends. Thanks 😉

Quran multilanguage Text & Audio Setup and Install

Quran multilanguage Text & Audio WordPress Plugin A to Z Guide

WordPress based plugin Quran multilanguage Text & Audio developed by an individual person named Bahmed Karim is the first ranked plugin on a Quran query on the WordPress plugins directory. It clearly means that the plugin is most popular and the best part is that it has 5 stars reviewed on the official WordPress website. It’s quite better for the admin and noobs to go with this.

Quran multilanguage Text & Audio WordPress Plugin Key Features:

  • Arabic Quran translated into 29 languages
  • Full ajax and responsive
  • Available for free at all
  • Admin Area to customize the display
  • 32 Sheikhs Voices
  • Download Full Quran
  • Widget and page/post support via shortcode [quran]
  • Custom CSS option
  • 5-star reviews
  • Demo Page available

I will try my best to cover this plugin a to z, from install to set up properly.

I am using the install and setup on WordPress 5.2.3 and today when I’m playing with the plugin’s version is 2.3.5, 400+ active installs, works better on more than 3.0.1 version of WordPress.

Let’s start with Install plugin first.
Download/View | Demo

1. Installation of the plugin:

On your WordPress site, go to Plugins > Add New > Search for “Quran multilanguage Text & Audio” > Click on Install > Activate.

Quran multilanguage Text & Audio Installation steps

Installation of Quran multilanguage Text & Audio

2. Finding admin area options:

Now we need to go to the admin area of the plugin, located on the second number of WordPress left navigation menu.

Quran multilanguage Text & Audio WP plugin admin area options

Quran multilanguage Text & Audio WP plugin admin area

3. Enabling and Selecting the free available templates:

You’ll see the first option of 5 available free frames/templates which will be shown as a border on a page where the plugin code is injected. Must keep it enabled if you want to use it.

Quran multilanguage Text & Audio selection and activation of templates

Quran multilanguage Text & Audio Templates

4. Choosing the voice of Sheikhs:

The second option you’ll see there will be the select box of Sheikh names that recite the Quran in their beautiful voice. You can listen to them one by one and choose the one as default you like more.

Choosing the Sheikh in the plugin options

Choosing the Sheikh

5. Choosing the default Language:

You’ll get the option of choosing the default language of the plugin, its actually the text language which will be used as the translation language of the Arabic voiced Qurani voice. So, if you’ll choose the English, when a visitor will be live on your page he will listen to an Arabic Verse with the translation in the text on the page in the English language.

Choose the default language of Quran Plugin WordPress

Choose the default language

6. Choosing Sura text:

There is another option which allows you to change the text on Sura, shown on visitor page like this:

Choosing Sura Text on widget

Choosing Sura Text on the widget

7. Changing the language and reciter text.

There are more options here we get are we can change the text of language and reciter (récitator). The options are helpful especially when you’re getting non-English users so, you can change the text into any local language.

plugin's reciter and language text changing

Reciter and language text changing

8. Customizing styles:

Finally, we have options to customize the display of the data on a webpage. We have the option of changing the colors of title, number, translate, Arabic and also can add custom own developed CSS style. Here are a few changes to the colors I did.

I tried applying a few effects via CSS to Translation, Arabic (Quran) and Sura Name. Here is the guide on how we can make changes to it. Following CSS i applied at the option of — Custom CSS without the tag <style>…</style>

.bloc_name_sura {font-weight: bold;}
.trans { text-decoration: overline; font-weight: bold;
.quran { text-decoration: underline; font-weight: bold; text-shadow: 1px -1px 0 #767676, -1px 2px 1px #737272, -2px 4px 1px #767474, -3px 6px 1px #787777, -4px 8px 1px #7b7a7a, -5px 10px 1px #7f7d7d, -6px 12px 1px #828181, -7px 14px 1px #868585, -8px 16px 1px #8b8a89, -9px 18px 1px #8f8e8d, -10px 20px 1px #949392, -11px 22px 1px #999897, -12px 24px 1px #9e9c9c, -13px 26px 1px #a3a1a1, -14px 28px 1px #a8a6a6, -15px 30px 1px #adabab, -16px 32px 1px #b2b1b0, -17px 34px 1px #b7b6b5, -18px 36px 1px #bcbbba, -19px 38px 1px #c1bfbf, -20px 40px 1px #c6c4c4, -21px 42px 1px #cbc9c8, -22px 44px 1px #cfcdcd, -23px 46px 1px #d4d2d1, -24px 48px 1px #d8d6d5, -25px 50px 1px #dbdad9, -26px 52px 1px #dfdddc, -27px 54px 1px #e2e0df, -28px 56px 1px #e4e3e2; } &.deepshadow { color: #e0dfdc; background-color: #333; letter-spacing: .1em; text-shadow: 0 -1px 0 #fff, 0 1px 0 #2e2e2e, 0 2px 0 #2c2c2c, 0 3px 0 #2a2a2a, 0 4px 0 #282828, 0 5px 0 #262626, 0 6px 0 #242424, 0 7px 0 #222, 0 8px 0 #202020, 0 9px 0 #1e1e1e, 0 10px 0 #1c1c1c, 0 11px 0 #1a1a1a, 0 12px 0 #181818, 0 13px 0 #161616, 0 14px 0 #141414, 0 15px 0 #121212, 0 22px 30px rgba(0, 0, 0, 0.9); } &.insetshadow { color: #202020; background-color: #2d2d2d; letter-spacing: .1em; text-shadow: -1px -1px 1px #111, 2px 2px 1px #363636; } &.retroshadow { color: #2c2c2c; background-color: #d5d5d5; letter-spacing: .05em; text-shadow: 4px 4px 0px #d5d5d5, 7px 7px 0px rgba(0, 0, 0, 0.2); }

As there are classed used by plugin author, so I must have to use the exact class name to get it applied to that class.

.bloc_name_sura was used to Sura Name.

.trans was used to Translation

.quran was used in Arabic (Quranic words).

You can visit this page to find out more effects to these available texts.

How to find classes to use effects to this plugin.

There 2 easiest ways by doing this, for common browser gets into the page where the plugin is showing data right-click and go into developer mode. Now choose the arrow button and click on the area you wanna apply CSS and it will show you, classes, there.

Getting CSS classes from common browsers

Getting CSS classes ids

The second and easiest way is doing it on Firefox browser, go to the exact lines you wanna change CSS, select it > right-click > View Selection Source > There you go:

view selection source to find css classes on Firefox

Firefox view selection source

We can see that the author has used classes with spaces which are counted as 2 classes used like if in a <p> we use <p class=” my name”> we can use .my and .name as 2 classes and apply 2 CSS to it. But to be easy we’ll use the first one that will work for all.

If there are few issues you get like while installing you can comment below so I’ll personally try to help you out ASAP.

And following is the code that may help you that mostly causes while installing the plugin.

php_value memory_limit 30M
php_value post_max_size 100M
php_value upload_max_filesize 30M

These codes are used to .htaccess available at the WordPress installed root. I got an error on fresh installed WordPress as the size of the plugin is bigger than the default allowed by WordPress.

Holy Quran random verse Multilanguage WordPress Plugin

Holy Quran random verse Multilanguage WP Plugin Installation & Setup Guide

WordPress based Holy Quran random verse Multilanguage plugin and developed by Bahmed Karim is 2nd plugin in the WP plugin directory. The special thing in the plugin is having random options like web owners wanna share it with every single visitor on their website. The plugin is mostly dedicated to widgets, which means it can be used in widgets only and hasn’t any shortcode that can be used in posts/pages.

Currently, the plugin has around 100+ active installs, developed in 2018 and works with higher than 3.0.1 versions of WordPress. Although the author hasn’t updated the plugin since 2018, but still with my current WordPress version 5.2.3 its working fine.

Holy Quran random verse Multilanguage Key Features:

  • Arabic Quran translated into 24 languages
  • Title, language, reciters, text colors and audio on/off controls
  • 5 Sheikhs Voices
  • Widget supported only
  • 5-star reviews
  • Shortcode []
  • Demo Page available

Let’s get started with this plugin install and proper setup. You must install this plugin to your WordPress website, here is a guide on installing WordPress plugin.

Download/View | Demo

After a success install > activate it and now let’s set it up.

1. Adding Widget:

Go to appearance > Widgets > at the left navigation you can see a list of available widgets find random Quran verse and click on it and add to the correct area where you want it to be.

Quran Random Verse WordPress Plugin Widget Setup

Quran Random Verse WP Plugin

2. Customize Options and Save:

Now you’ll see a box with few options like language, reciter, text color and auto audio on and off. Set them as you want and click on save.

customizing widget options

customizing widget options

3. Verifying the correct setup:

Now visit any page of your website and find the data where you saved it, as I used it to footer. Now you can see Arabic text is showing (on ever reloading it will keep changing randomly) and auto audio was paused as I disabled it. See it will look like this.

Holy Quran random verse Multilanguage WP Plugin preview

Holy Quran random verse Multilanguage WP Plugin preview

There we go. I just finished the setup. If you want to rearrange the plugin, it is very simple to go to Widgets and drag the widget to any place you want it to be.

The plugin is really helpful especially when you want it to see every visitor and new thing on each visit. I hope you liked my effort if yes, please share the post with your friends and stay blessed. Thanks

Quran Radio WordPress plugin

Quran Radio WordPress Plugin Installation & Setup Guide

This is the first Quran Radio WordPress plugin available in more than 40 languages. The plugin is made by an organization named EDC Team (E-Da`wah Committee). The plugin was developed and last updated in 2018 and supports around 3.0 versions and I’m currently gonna test it on WordPress 5.2.3.

I liked the plugin as its an audio streaming of radio station which only keeps playing the Quran with translations. There will be a player available that will work on post/widget. The plugin contains the shortcode radio[*] which works perfectly anywhere within the site. The shortcode can be found, when you’ll save the settings of the plugin from the plugin admin area.

The plugin contains many options like 40 languages in total more than 120 stations, selection of players like Jplayer or HTML5 player + hide the player and play it in background. The plugin has also many more options.

Quran Radio WordPress Plugin Key features:

  • Arabic Quran translated in 40 languages
  • Autostart
  • Show icons: Source Icon,PDF Book Icon,Podcast Icon,Download Icon,MediaPlayer Icon,QuickTime Icon,Realplayer Icon,Winamp Icon,Tunein Icon,Soundcloud Icon,Twitter Icon,Facebook Icon
  • Title, language, reciters, text colors and audio on/off controls
  • 40 mixed voices
  • 5-star reviews
  • Shortcode radio[*]
  • Demo Page available

You can learn how to install a plugin on WordPress.

Let’s start the plugin installation and step by step setup on widgets and post/pages.

Download/View | Demo

1. Installation of the Quran Radio plugin:

You can read guide on plugin installation and then download the plugin here.

2. Selection of languages:

There are around 122 options in the language select box. There are 40 with translation and other all with only Quran. You can select the one you want to be.

Selecting Quran Radio WordPress plugin default languages

Quran Radio Languages Selectbox

3. Widget/Post Title (Auto Loaded)

The title there in the admin area of the plugin contains the textbox for the title of the widget to be shown where to shortcode is embed. Leaving it empty will load the data without a title, otherwise, it will show the language title but isn’t gonna leave it as empty.

selecting the title in Quran Radio WP plugin

Quran Radio Title Preview

4. Player Options:

The plugin contains 2 types of plugin one Jplayer and second which is commonly used in Youtube also, the HTML5 player. You can choose any of these you like.

Selecting a default player in Quran Radio WP Plugin

Quran Radio WP Plugin default player selection

5. Autostart of player setup:

Next, you can see an autostart checkbox which can show a player and options like pause, volume and but unchecking the option i mean making it disable will make this all invisible and keep it playing in the background.

Auto start playing Quran in Quran Radio WP plugin

Auto start playing Quran in Quran Radio WP plugin

6. Multiple Icon options:

There are around 13 icon options into the plugin option, separately described bellow:

Quran Radio WordPress plugin icon features and preview

Quran Radio WP plugin icon options

  • Source Icon – The chain icon, clicking upon will download it.
  • PDF Book Icon – It will start the download of the part in PDF format.
  • Podcast Icon – It will let you get to the Apple Podcasts.
  • Download Icon – Quick start the download.
  • MediaPlayer Icon – It will start playing it into a mediaplayer.
  • QuickTime Icon – It will redirect you to the Apple’s QuickTime.
  • Realplayer Icon – Its good for realplayer supported devices.
  • Winamp Icon – It will open it into a VLC media player in pls format.
  • Tunein Icon – Its gonna redirect you to tunein website to play it.
  • Soundcloud Icon – It will open their Soundcloud webpage.
  • Twitter Icon – It will open their official Twitter account.
  • Facebook Icon – It will open their official Facebook account.

7. Checking hidden player:

The option should hide the controls and every show data of the plugin from the post/page/widget and keep playing the selected radio station.

8. Using the plugin into posts/pages and widgets:

There are 2 options we have now, 1 using in posts/pages using the shortcode and 2 using into a widget. Let’s do it into posts/pages first via shortcode.

1. Inserting to post/page using the shortcode:

You can’t see shortcode on the first/fresh install of the plugin, you must need to setup all options above and click on save/Update Options button and after this, it will show you the plugin preview including the shortcode at the right side. Take that code, insert into the post and preview it. It will work.

using Quran Radion wp plugin shortcode into post

Quran Radio wp plugin shortcode in a post

2. Setting up the plugin with widgets:

Using the plugin via widgets into WordPress is as easy as all are. Go to Appearance > Widgets > Quran Radio > Add to the place you want it > save and its done:

Quran Radio wp plugin setup into widgets

Quran Radio Plugin settings into WP widgets

The plugin is ready and awesome for the websites to have the content like articles on how to offer prayers, Hajj Hmrah and related tips. But the owner knows their users better. Today when i am creating this post, the plugin was updated at the start of 2019 and having 200+ active installs with 5 star reviews. Currently, the plugin is working fine even WordPress is showing a notice that Untested with your version of WordPress which is 5.2.3 .

Hope my effort helped you and you found you tried finding out. If it did, make my day by sharing my post with hashtags on your social media account and it will really help me. Thanks 🙂

Internet Quran Radio WordPress Plugin

Internet Quran Radio WordPress Plugin Installation & Setup Guide

The second Radio WordPress plugin Internet Quran Radio has 100+ active installs and last updated in early 2018 at the moment when I’m creating this post. Like the other plugins this one also contains and admin area where you can customize the options and having around 120 Live radio stations working 24/7.

The specialty of the plugin is it can be used into menu by using their shortcode and also can be embed into posts and pages. In the plugin’s radio stations select list, it has 124 options including the translation ones and without translation in different voices.The plugin has a fixed player type with volume controls but the height of the plugin can be customized into the admin area.

The plugin has also the option to play the radio automatically and can edit the title of the widget as well. It has different shortcodes for menu’s and for post/pages. You can also find out another similar but better plugin called “Quran Radio“.

This is the first Quran Radio plugin available into more than 40 languages. The plugin is made by an organization named EDC Team (E-Da`wah Committee). The plugin was developed and last updated in 2018 and supports around 3.0 versions and I’m currently gonna test it on WordPress 5.2.3.

I liked the plugin as its an audio streaming of radio station which only keeps playing the Quran with translations. There will be a player available which will work on post/widget. The plugin contains the short code radio[*] which works perfect anywhere within the site. The shortcode can be found, when you’ll save the settings of the plugin from the plugin admin area.

The plugin contains many options like 40 language in total more than 120 stations, selection of players like Jplayer or HTML5 player + hide the player and play it in background. The plugin has also many more options.

Quran Radio WordPress Plugin Key features:

  • Arabic Quran translated in 40 languages in total 124 voices
  • Autostart
  • HTML5 Player
  • Shortcode support menu + posts/widgets
  • 24/7 online radio

You can learn how to install a plugin on WordPress.

Let’s start the plugin installation and step by step setup on widgets and post/pages.

Download/View | Demo

1. Internet Quran Radio Installation & Activation:

The plugin is installed and activated in the same way we always use with WordPress hosted and non hosted websites. Here is a complete guide, ready and activate it. You may get error while installing, this post will help you to struggle these problems.

Internet Quran Radio WordPress plugin install and activate

Internet Quran Radio WP Install + Activate

2. Selection Of Default Radio Station:

You need to go to the admin area of the plugin which is located at the end of the WordPress navigation menu and click on it. After this you will see the select box with 1 already selected radio station, click on it > find the correct one and save it. The plugin contains 124 radio stations at all with some translation options.

default radio selection Internet Quran Radio WordPress Plugin

default radio selection Internet Quran Radio WordPress Plugin

3. Player Options:

About the size, the plugin has an option to customize the height of the plugin, default is 20 which is pretty good but you can also change it which depends on your demand.

Player Options, size adjusting Internet Quran Radio WordPress Plugin

Player Options, size adjusting Internet Quran Radio WP Plugin

4. Title Settings:

The title option is same you see with every WordPress plugin and edit it as you want or leaving it as it is will show the Radio Title (the selected radio). Another option related to the title is that you can see a check box “hide title” which will hide the title of the widget and will show only the player.

Internet Quran Radio WordPress Plugin Title settings and preview

Internet Quran Radio WordPress Plugin Title settings

5. AutoPlay Configuration:

The autoplay option helps you when you want the Quran to be played automatically. The user also can findout the place of the plugin and and pause/play and control the volume.

Internet Quran Radio WordPress Plugin Autoplay settings

Internet Quran Radio WP Plugin Autoplay settings

6. Shortcode Find & Use:

The shortcode is a must thing that is used in many causes.This plugin also offers us the use of shortcode. When you’ll save the first setting it will show you the separate shortcodes for menu and widgets as shown in the screenshot bellow:

Internet Quran Radio WordPress Plugin shortcode finding

Internet Quran Radio WordPress Plugin Shortcode finding

Conclusion:

The plugin is easy to customize but having bit limited options and features than this one. I personally don’t recommend this one to use but in cause you like this one, above I’ve shown you all features that this plugin contains.

I really hope my effort to this plugin will help you. You can make my day by sharing this post to your social media accounts. THANKS 🙂