Thank you for purchasing Masjid! We’re very pleased that you have chosen our theme to use on your website. We’re doing our best not to disappoint you! Before you get started, please check out these documentation pages. Masjid can only be used with WordPress and we assume that you already have it installed and ready to go. If you don’t, please see WordPress Codex to get started.
Before using Masjid, please meet the following requirements:
In our guide, we will show you step by step instructions on how to install our WordPress theme for beginners. Below you will find two ways to install a WordPress theme.
If Masjid files are downloaded from your Themeforest account, you can start an installation using WordPress administration panel.
Follow steps below to install the theme:
![]() |
![]() |
![]() |
![]() |
![]() |
Common Install Error: Are You Sure You Want To Do This?
If you get the following question message when installing Masjidtheme.zip file via WordPress, it means that you have an upload file size limit. Install the theme via FTP or call your hosting company and ask them to increase the limit.
To install Masjid WP via FTP, follow steps below:
![]() |
Learn more:
Some functionalities of the Masjid Theme are available because of the plugins we used to create it. Once Masjid is activated in your WordPress admin panel you should see notification about bundled plugins we recommend to install – they are included in Masjid package – so you don’t have to do anything more than click install and activate.
Unyson is a framework for WordPress that facilitates development of a theme. This framework was created from the ground up by the team behind ThemeFuse from the desire to empower developers to build outstanding WordPress themes fast and easy. This documentation is heavily modified by createIT to ensure all custom extensions are well documented.
This documentation assumes you have a working knowledge of WordPress. If you haven’t, please start by reading WordPress Documentation.
Minimum Requirements
Installation
Unyson is part of Masjid plugin that should be activated to be able to use the fully use this theme.
After plugin will be activated you will notice the Unyson entry in the sidebar:
![]() |
License
The licenses for most software are designed to take away your freedom to share and change it. By contrast, the GNU General Public License is intended to guarantee your freedom to share and change free software. Unyson inherits the General Public License (GPL) from WordPress.
On the Unysone page you’ll see a list of avaliable extensions separated in two sections:
Active Extensions - Extensions that should be activate to be able to fully use Masjid WP theme functionality:
Available Extensions - Extensions not yet downloaded or activate.
Note
We recommend to not activate any of the extensios that are not part of the list above. They may not be compatible with the theme and could create unexpected issues.
![]() |
Simply drag and drop elements to build your page content. We prepared components which will help you determine main structure of the webpage – easily set up backgrounds, colors and styles for whole sections as well as lots of various smaller components which you can freely put wherever you want.
Note
As the VC plugin used with Masjid WP Theme is part of a bundle, that mean that theme author has a license and only he/she can download latest versions of VC and include it in the theme. You as a theme user may use Visual Composer free of charge while you use the theme that came with VC (because you have a license for that theme).
Learn more:
For more information about Visual Composer, please check articles below:
![]() |
How to activate the plugin
Slider Revolution is included in Masjid WP package – so you don’t have to do anything more than click install and activate as you do with other plugins.
If you are new user of the revolution Slider plugin or you just want to check some of it functionality feel free to check Slider Revolution Documentation created by the authors of this plugin.
Contact forms in Masjid WP are created with the use of Contact Form 7 Plugin. Below you will find information how to recreate Contact forms used in our theme by adding the correct markup for the Form section of this plugin.
![]() |
If you never before used this plugin I suggest you to check Getting Started with ContactForm 7.
MailChimp for WordPress helps you add more subscribers to your MailChimp lists using various methods. You can create good looking opt-in forms or integrate with any other form on your site, like your comment, contact or checkout form.
![]() |
If you never before used this plugin I suggest you to check Knowledge Base for this plugin.
Events Manager is a free and feature-filled events plugin for the WordPress platform, providing the ability to publish events, locations and manage bookings among many other features.
![]() |
If you never before used this plugin I suggest you to check Getting Started Guide
The most robust, flexible, and intuitive way to accept donations on WordPress. Give is free and yet is full of many advanced features to suit your needs. Slick donation forms, full-featured reporting, and donor management features provide you with the tools you need to accept donations and manage your donors.
![]() |
If you never before used this plugin I suggest you to check Give Features and Give Demos
This plugin will add awesome hotspots with unlimited tooltips for a single image. Works with latest Visual Composer v5.2.x
![]() |
If you never before used this plugin I suggest you to check Live Demo
Display Instagram photos from any non-private Instagram accounts, either in the same single feed or in multiple different ones. Add beautifully clean, customizable, and responsive Instagram feeds to your website. Super simple to set up and tons of customization options to seamlessly match the look and feel of your site.
If you never before used this plugin I suggest you to check Overview
Note
To be able to use theme content installation and backup functionality make sure to activate Backup & Demo Content Unyson’s extension.
![]()
The fastest and easiest way to import our demo content is to use Theme Options Demo Content Installer. It will import all pages and posts, sample slider, widgets, theme options, assigned pages, and more.
To import our demo content, please follow the steps below:
Step 1 – Navigate to Tools where after activating the Unyson extension Demo Content Install option will be available
Step 2 – Choose import option you want to use from available options
Step 3 - To be able to continue you need to agree to this term.
Step 4 – Wait until the content will be installed
Importing can take a few minutes. Please be patient and wait for it to complete. Once it is loading, you will see message with indicating progress.
We recommend this approach on a newly installed WordPress. It will replace the content you currently have on your website. However, we create a backup of your current content in (Tools > Backup). You can restore the backup from there at any time in the future.
![]() |
Masjid has the capability to have a Right to Left language set for the site.
To set the RTL of this theme, go to Dashboard > General > Site Language.
![]() |
In Site Language, change the language to Arabic and click Save Changes button.
![]() |
All of our items comes with free support. Free support is limited to questions regarding the themes features or problems. We provide premium support for code customisation or third-party plugins.
Note
Our support hours: 10:00 AM – 6:00 PM UTC +1 on Monday to Friday.
For issues and concerns, you can reach us through these support methods:
E-mail – support@createit.pl
Help Desk – Click here to go to our support website. Just click on the Submit Ticket button and follow instructions to create a ticket.
Forum – Comment/Post on the product you have issues/queries in ThemeForest or CodeCanyon websites.
Before You Post in a Forum
We urge you to follow the steps below, before you post a new topic on the forum, to speed up your request. It’s in everyone’s interest and will benefit in making the entire forum more efficient:
- Step 1 – Always check the Documentation and the Knowledgebase Section. Most questions are already answered in those areas.
- Step 2 – If your question hasn’t been brought up on the forum, please post a new topic. Always be as specific as possible. Creating a topic requires entering the live URL to your home page or page that shows the issue in question. It also has bars for WP and FTP login info, which aren’t required, however, providing us with your login information can save a lot of time for both of us. Login credentials are securely stored and accessible only by our support staff.
- Step 3 – We usually answer questions in 24 hours on working days. However, if you don’t get any answer within 72 hours bump up your question or send us an e-mail.
For all support methods, you will receive confirmations and replies on your queries through e-mail or by tracking your ticket which you will also get through e-mail. To track your ticket, please click here.
Once we reply to your query, each ticket will be open for 7 days without a reply from you. On the 6th day without a reply, an e-mail will be sent to notify you of the ticket’s inactivity. To make the ticket active again, you simply need to reply or follow the steps in the e-mail. If you won’t make the ticket active within 7 days, on the 8th day the ticket will automatically be closed.
You can use Pages to organize and manage any content on your website. You can create multiple pages on your website for different types of content or setup onepager with scroll-to-section menu.
To create a new Page in Masjid follow the steps below:
Step 1 - In Dashboard, navigate to Pages > Add New. You will be directed to a page where you can add details on the page.
Step 2 - Add the Title of the page.
Step 3 - Add content – we recommend you to create page content using Visual Composer or by modifying demo content.
Step 4 - Choose page attributes. To have the same look as the demo, at the Template section of the page attribute, use Full Width Page. This is a template set for Masjid.
![]()
- Parent – If you want to create this page as a subpage.
- Template – You can choose one of defined page templates
- Order – The order of the page.
Step 5 - After adding all the contents of the page, click on the Publish button.
When using Visual Composer to add content, you have 2 Editor options, the Backend Editor and Frontend Editor.
![]() |
Backend Editor |
![]() |
Frontend Editor |
In adding contents to the page, there are many options to choose from. Some of the options are:
Elements - You will be able to choose elements that are needed and used on the page.
Text Block – This is where you add Text to the page.
Row – An area where you can add elements.
If you have added some pages via Pages > Add New you can choose one and set it up as a homepage.
Use Static front page tool in Settings > Reading and choose from the list your homepage. Remember to click Save changes at the end of editing.
![]() |
With Masjid comes many custom shortcodes for (Visual Composer) VC that are used to show content created in Masjid.
Below you will find short information about this Visual Composer elements:
![]() |
![]() |
This element will let you display Donations’ items in a grid view.
![]() |
![]() |
![]() |
This element will let you display the Events items in a slider.
![]() |
![]() |
![]() |
This element will let you add the Donations items in the page.
![]() |
![]() |
![]() |
This element will let you add a google map with a specific address.
![]() |
- Address - The complete address of the location to show in the map.
- Latitude - Latitude coordinates of the location.
- Longitude - Longitude coordinates of the location.
- Custom map height - Set the height of the map. You can leave it blank for a responsive map.
- Zoom - Set the zoom in of the map.
- Map marker - Choose an image to use as the map marker.
- Map style code - Code for a customized map marker.
![]() |
![]() |
This element will let you create an icon box that displays an icon with title and description or a counter.
![]() |
Select display type - Type of icon box that will be shown.
Type 1
Select icon type - Choose whether to show an image or an icon.
Icon
- Icon - Choose an icon to show in the icon box.
- Icon Color - Color scheme of the icon.
Image
- Icon image - Choose an image to show in the icon box.
Select icon background shape - Background shape of the icon.
Select icon background color - Background color of the icon.
Select icon alignment - Location where the icon will show.
Title - Title of the Icon Box.
Title color - Font color of the title.
Select title alignment - Location where the title will show.
Description - Text description of the icon.
Description color - Text color of the description.
Select description alignment - Location where the description will show.
![]()
Type 2
Select icon background color - Background color of the icon.
Select icon type - Choose whether to show an image or an icon.
Icon
- Icon - Choose an icon to show in the icon box.
- Icon Color - Color scheme of the icon.
Image
- Icon image - Choose an image to show in the icon box.
Select icon alignment - Location where the icon will show.
Title - Title of the Icon Box.
Title color - Font color of the title.
Select title alignment - Location where the title will show.
Description - Text description of the icon.
Description color - Text color of the description.
Select description alignment - Location where the description will show.
![]()
![]() |
This element lets you add images that can be set to be dynamic.
![]() |
- Columns count - Number of columns in a row.
- Dotted navigation - Option to add a dotted navigation in the slider.
- Autoplay - Option to make the slider move automatically.
- Autoplay speed [ms] - Speed of the slider when moving.
- Images - Images in the slider.
![]() |
![]() |
This element lets you add the latest blog posts.
![]() |
![]() |
![]() |
This element will let you add a clock that indicates what prayer is scheduled with icon.
![]() |
Note
The time that this element follows to indicate the scheduled prayer will be based on the time zone which the user’s computer is set.
![]() |
![]() |
This element lets you a grid for the prayer schedules.
![]() |
Note
The time that this element follows to indicate the scheduled prayer will be based on the time zone which the user’s computer is set.
![]() |
![]() |
This element lets you a text-link for a popup video. You can add an icon or image beside the text-link.
![]() |
- Video - Link for the video.
- Frame color - Color scheme of the frame.
- Frame Position - Location of the frame.
- Text color - Text color of the text in the frame.
![]() |
![]() |
This element will let you show the items in the Gallery post type.
![]() |
![]() |
![]() |
This element lets you show items in Sermons post type.
![]() |
![]() |
Note
To get the same layout as the demo site:
![]()
Set the Page template of the page where the sermons are displayed to Full Width Page.
![]() |
This element lets you show items in the Sacraments post type.
![]() |
![]() |
![]() |
This element lets you show items in the Testimonials post type.
![]() |
![]() |
![]() |
This element lets you show an image with tooltips with descriptions.
![]() |
Note
To add a tooltip click on the area where you like the tooltip to show, and the Hotspot Tooltip Content will show.
![]() |
Some plugins that are used in Masjid generates an element that helps customize the pages on your site. You will see the plugin elements as follows:
![]() |
This is the plugin that can add a Contact Forms on a page. To know how to create a contact form, go to the Create Contact Form tutorial.
![]() |
![]() |
This plugin lets you add a slider that you made under the Slider Revolution. The slider revolution lets you make your own customized slider. To know how to use the slider revolution, go to the Create Revolution Slider.
![]() |
![]() |
This element lets you customize your page using a simple drag and drop of elements to build your page content. You can easily setup the backgrounds, colors, and styles for a whole section as well as lots of various smaller components which you can freely put wherever you want.
Some of these elements are:
![]() |
This element will let you add a video or MP3 file inside your page by adding the link for the video/MP3.
![]() |
![]() |
This element lets you add a graph. These are the types of graph that you can add:
Pie
![]()
Round
![]()
Line
![]()
Masjid is loaded with options for the blog. It offers many different options for you to present your blog posts, along with several different blog post layouts. In addition, there are numerous theme options and shortcode options that allow you to customize how posts are displayed.
No matter which method you use to display your blog posts, first thing you need to do is create them.
Masjid offers several blog post formats:
![]() |
Standard - The default format for the blog post. It will show only the text in the blogs page.
Aside
Image - The Featured Image and a small preview of the text will be shown in the blogs page.
Video - A video and a small preview of the text will be shown in the blogs page.
To be able to use a Video for the blogs post page, the blog format should be Video and the Video format settings will show where you add the Embed code of the video.
![]()
To add a video in the single page of the blog, you can use the Video element in the VC.
Audio - An MP3 music and a small preview of the text will be shown in the blogs page.
To be able to use a Video for the blogs post page, the blog format should be Video and the Video format settings will show where you add the Embed code of the video.
![]()
To add a video in the single page of the blog, you can use the Video element in the VC.
Quote - The quoted word in the blog post will be shown in the blogs page.
Link - A link in the blog post for a webpage will shown in the blogs page.
Gallery - The image gallery in the blog post will be shown in the blogs page.
Note
If the settings for Video or Audio format is not displayed, go to Screen Options at the upper right side of the screen. Click the options for Video format settings or Audio format settings, this should display the settings.
![]()
Follow the steps below to create a blog post:
![]() |
![]() |
![]() |
![]() |
![]() |
To add more than one image, use Image Gallery (Visual Composer element) , each image will be a slide in the gallery slideshow. Gallery can be created by adding images from Media gallery or by adding External links of the images that will be used.
![]()
Step 6 – To post Video, use Video Player (Visual Composer element) and paste the direct video URL from Youtube, Vimeo or Dailymotion and more.
Step 7 – to post Audio, use Video Player (Visual Composer element) and paste the direct audio URL from Soundcloud, Mixcloud and more.
Step 8 – For Quotation, use WordPress Blockquote option (Shift + Alt + Q).
You will see all the Blogs created at Blog Posts > All Posts.
The most popular way of displaying blog posts is to setup blog index page. There all of your posts will be displayed and ordered by publish date.
To set the page as your post page, navigate to Posts page tool in Settings > Reading and choose Blog index page from the ones you created.
![]() |
Note
On Blog index page you will see only your posts, so don’t add any other content to it.
Categories are meant for broad grouping of your posts, think of these as general topics. Categories are hierarchical, so you can add sub-categories. Sub-categories are made when a Category is added to a Parent Category.
Adding categories to a blog would make it easier to locate and post on similar topics by category.
To create a Category for a blog, follow these steps:
Step 1 - Navigate your Dashboard to Blog Posts > Categories. You will see the Blog Categories page.
Step 2 - In the page, find the Add New Category area. Add All the necessary information.
![]()
- Name - The name of the category.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Parent Category - If the category is a sub-category, then look for the parent category in the drop-down box.
- Description - Description of the category.
Step 3 - Once done filling out the information of the category, click on Add New Category button to save.
To delete a Category, navigate your Dashboard to Blog Posts > Categories.
In the Blog Categories page, you will see all the created category.
To delete a category, you have two options:
Single Delete - Hover your mouse pointer on the category that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple categories, click on the box beside the categories you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Tags are meant to describe specific details of your posts. They are the micro-data that you can use to micro-categorize your content. Tags are not hierarchical.
Adding tags to a blog post would make it easier to relate a post with another post even if the categories are different.
To create a Tag for a blog, follow these steps:
Step 1 - Navigate your Dashboard to Blog Posts > Tags. You will see the Tags page.
Step 2 - In the page, find the Add New Tag area. Add All the necessary information.
![]()
- Name - The name of the tag.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Description - Description of the tag.
Step 3 - Once done filling out the information of the tag, click on Add New Tag button to save.
Note
Adding a tag may affect the tags from other component of the site.
To delete a tag, navigate your Dashboard to Blog Posts > Tags.
In the Tags page, you will see all the created tags.
To delete a tag, you have two options:
Single Delete - Hover your mouse pointer on the tag that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple tags, click on the box beside the tags you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Note
Deleting a tag may affect the tags from other component of the site.
To create a new Gallery item, navigate in WordPress Dashboard to Gallery > Add New.
![]() |
The Add New Gallery Item page will show. Add the details for the Gallery.
![]() |
- Title - Title of the gallery.
- Gallery options - Add the images for the gallery.
- Tags - Specifically categorize a gallery.
- Gallery Categories - Group a gallery with other gallery in the same category.
After adding all the details, click on Publish button to save.
To delete a gallery, navigate your Dashboard to Gallery > Our Gallery
In the Gallery page, you will see all the created gallery.
To delete a gallery, you have two options:
Single Gallery Delete - Hover your mouse pointer on the gallery that you would like to delete. You will see a Trash option pop-up. Click on Trash to delete.
Multiple Gallery Delete - To delete multiple galleries, click on the box beside the gallery you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Move to Trash option. Click on Apply button to delete.
To add a gallery to a page, an element in the Visual Composer is used.
![]() |
This is the element that will add a gallery on the page. For more information about this element, go to Masjid Custom Shortcodes > Gallery Display.
Categories are meant for broad grouping of your posts, think of these as general topics. Categories are hierarchical, so you can add sub-categories. Sub-categories are made when a Category is added to a Parent Category.
Adding categories to a gallery would make it easier to locate and post on similar topics by category.
To create a Category for a gallery, follow these steps:
Step 1 - Navigate your Dashboard to Gallery > Gallery Categories. You will see the Gallery Categories page.
Step 2 - In the page, find the Add New Category area. Add All the necessary information.
![]()
- Name - The name of the category.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Parent Category - If the category is a sub-category, then look for the parent category in the drop-down box.
- Description - Description of the category.
Step 3 - Once done filling out the information of the category, click on Add New Category button to save.
To delete a Category, navigate your Dashboard to Gallery > Gallery Categories.
In the Gallery Categories page, you will see all the created category.
To delete a category, you have two options:
Single Delete - Hover your mouse pointer on the category that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple categories, click on the box beside the categories you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Tags are meant to describe specific details of your posts. They are the micro-data that you can use to micro-categorize your content. Tags are not hierarchical.
Adding tags to a gallery post would make it easier to relate a post with another post even if the categories are different.
To create a Tag for a Gallery, follow these steps:
Step 1 - Navigate your Dashboard to Gallery > Tags. You will see the Tags page.
Step 2 - In the page, find the Add New Tag area. Add All the necessary information.
![]()
- Name - The name of the tag.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Description - Description of the tag.
Step 3 - Once done filling out the information of the tag, click on Add New Tag button to save.
Note
Adding a tag may affect the tags from other component of the site.
To delete a tag, navigate your Dashboard to Gallery > Tags.
In the Tags page, you will see all the created tags.
To delete a tag, you have two options:
Single Delete - Hover your mouse pointer on the tag that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple tags, click on the box beside the tags you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Note
Deleting a tag may affect the tags from other component of the site.
To create a new Sermon item, navigate in WordPress Dashboard to Sermons > Add New.
![]() |
The Add New Sermon page will show. Add the details for the Sermons item.
![]() |
Title - Title of the Sermon.
Editor container - You can add text descriptions about the Sermon on this area.
Sermons Settings
- Speaker - Name of the person who gave the spiritual message.
- Date - Dates that the sermon is delivered.
- Direct video URL -
- Embedded Code - Time that the sermon is delivered.
- Transcript file link - Media format of the sermon.
Sermon Categories - Group a Sermon with other Sermons in the same category.
After adding all the details, click on Publish button to save.
To delete a Sermon, navigate your Dashboard to Sermons > All Sermons
In the Sermon page, you will see all the created Sermon.
To delete a Sermon, you have two options:
Single Sermon Delete - Hover your mouse pointer on the Sermon that you would like to delete. You will see a Trash option pop-up. Click on Trash to delete.
Multiple Sermon Delete - To delete multiple galleries, click on the box beside the Sermon you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Move to Trash option. Click on Apply button to delete.
To add a Sermon to a page, an element in the Visual Composer is used: Sermons Display
![]() |
This is the element that will add a Sermon on the page. For more information about this element, go to Masjid Custom Shortcodes > Sermons Display.
Categories are meant for broad grouping of your posts, think of these as general topics. Categories are hierarchical, so you can add sub-categories. Sub-categories are made when a Category is added to a Parent Category.
Adding categories to a Sermon would make it easier to locate and post on similar topics by category.
To create a Category for a Sermon, follow these steps:
Step 1 - Navigate your Dashboard to Sermon > Sermon Categories. You will see the Sermon Categories page.
Step 2 - In the page, find the Add New Category area. Add All the necessary information.
![]()
- Name - The name of the category.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Parent Category - If the category is a sub-category, then look for the parent category in the drop-down box.
- Description - Description of the category.
Step 3 - Once done filling out the information of the category, click on Add New Category button to save.
To delete a Category, navigate your Dashboard to Sermon > Sermon Categories.
In the Sermon Categories page, you will see all the created category.
To delete a category, you have two options:
Single Delete - Hover your mouse pointer on the category that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple categories, click on the box beside the categories you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
To create a new Team item, navigate in WordPress Dashboard to Team members > Add New.
![]() |
The Add New Team member page will show. Add the details for the Team member item.
![]() |
Title - Name of the Team member.
Editor container - You can add short descriptions about the team member on this area.
Team options
- Position - Position of team member.
Tags - Specifically categorize a team member.
Team Categories - Group a team member with team members in the same category.
Featured Image - The image for the team member.
After adding all the details, click on Publish button to save.
To delete a Team, navigate your Dashboard to Team members > All Team members
In the Team members page, you will see all the created Team members.
To delete a Team member, you have two options:
Single Team Delete - Hover your mouse pointer on the Team member that you would like to delete. You will see a Trash option pop-up. Click on Trash to delete.
Multiple Team Delete - To delete multiple galleries, click on the box beside the Team members you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Move to Trash option. Click on Apply button to delete.
To add a Team to a page, an element in the Visual Composer is used: Team Display
![]() |
This is the element that will add a Team on the page. For more information about this element, go to Masjid Custom Shortcodes > Team Display.
Tags are meant to describe specific details of your posts. They are the micro-data that you can use to micro-categorize your content. Tags are not hierarchical.
Adding tags to a Team Members post would make it easier to relate a post with another post even if the categories are different.
To create a Tag for a Team Members, follow these steps:
Step 1 - Navigate your Dashboard to Team Members > Tags. You will see the Tags page.
Step 2 - In the page, find the Add New Tag area. Add All the necessary information.
![]()
- Name - The name of the tag.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Description - Description of the tag.
Step 3 - Once done filling out the information of the tag, click on Add New Tag button to save.
Note
Adding a tag may affect the tags from other component of the site.
To delete a tag, navigate your Dashboard to Team Members > Tags.
In the Tags page, you will see all the created tags.
To delete a tag, you have two options:
Single Delete - Hover your mouse pointer on the tag that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple tags, click on the box beside the tags you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Note
Deleting a tag may affect the tags from other component of the site.
Categories are meant for broad grouping of your posts, think of these as general topics. Categories are hierarchical, so you can add sub-categories. Sub-categories are made when a Category is added to a Parent Category.
Adding categories to a Team Members would make it easier to locate and post on similar topics by category.
To create a Category for a Team Members, follow these steps:
Step 1 - Navigate your Dashboard to Team Members > Team Members Categories. You will see the Team Members Categories page.
Step 2 - In the page, find the Add New Category area. Add All the necessary information.
![]()
- Name - The name of the category.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Parent Category - If the category is a sub-category, then look for the parent category in the drop-down box.
- Description - Description of the category.
Step 3 - Once done filling out the information of the category, click on Add New Category button to save.
To delete a Category, navigate your Dashboard to Team Members > Team Members Categories.
In the Team Members Categories page, you will see all the created category.
To delete a category, you have two options:
Single Delete - Hover your mouse pointer on the category that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple categories, click on the box beside the categories you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
A Testimonial is a statement that testify to someone’s character and qualifications. You can use this statements on your page to establish confidence.
To create a new testimonial, on your Dashboard navigate to Testimonials > Add New.
![]() |
The Add New Testimonial page will show. Add the details for the testimonial.
![]() |
- Title - The title of the single testimonial page.
- Editor container - You can add here the testimonial.
- Tags - Specifically categorize a testimonials.
- Testimonials Categories - Group a testimonial with testimonials in the same category.
After adding all the details, click on Publish button to save.
To delete a Testimonial, navigate your Dashboard to Testimonials > All Testimonials
In the Testimonials page, you will see all the created testimonials.
To delete a testimonial, you have two options:
Single Testimonial Delete - Hover your mouse pointer on the testimonial that you would like to delete. You will see a Trash option pop-up. Click on Trash to delete.
Multiple Testimonials Delete - To delete multiple testimonials, click on the box beside the testimonials you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Move to Trash option. Click on Apply button to delete.
To add testimonials to a page, an element in the Visual Composer is used: Testimonial Slider
This is the element that will add a testimonial on the page. For more information about this element, go to Masjid Custom Shortcodes > Testimonial Slider.
![]() |
Tags are meant to describe specific details of your posts. They are the micro-data that you can use to micro-categorize your content. Tags are not hierarchical.
Adding tags to a Testimonial post would make it easier to relate a post with another post even if the categories are different.
To create a Tag for a Testimonial, follow these steps:
Step 1 - Navigate your Dashboard to Testimonial > Tags. You will see the Tags page.
Step 2 - In the page, find the Add New Tag area. Add All the necessary information.
![]()
- Name - The name of the tag.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Description - Description of the tag.
Step 3 - Once done filling out the information of the tag, click on Add New Tag button to save.
Note
Adding a tag may affect the tags from other component of the site.
To delete a tag, navigate your Dashboard to Testimonial > Tags.
In the Tags page, you will see all the created tags.
To delete a tag, you have two options:
Single Delete - Hover your mouse pointer on the tag that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple tags, click on the box beside the tags you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Note
Deleting a tag may affect the tags from other component of the site.
Categories are meant for broad grouping of your posts, think of these as general topics. Categories are hierarchical, so you can add sub-categories. Sub-categories are made when a Category is added to a Parent Category.
Adding categories to a Testimonial would make it easier to locate and post on similar topics by category.
To create a Category for a Testimonial, follow these steps:
Step 1 - Navigate your Dashboard to Testimonial > Testimonial Categories. You will see the Testimonial Categories page.
Step 2 - In the page, find the Add New Category area. Add All the necessary information.
![]()
- Name - The name of the category.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Parent Category - If the category is a sub-category, then look for the parent category in the drop-down box.
- Description - Description of the category.
Step 3 - Once done filling out the information of the category, click on Add New Category button to save.
To delete a Category, navigate your Dashboard to Testimonial > Testimonial Categories.
In the Testimonial Categories page, you will see all the created category.
To delete a category, you have two options:
Single Delete - Hover your mouse pointer on the category that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple categories, click on the box beside the categories you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
To create a new Event, follow these steps:
Step 1 - To start creating an Event, on your Dashboard navigate to Events > Add Event. The Add New Event page will show.
Step 2 - Once your in the Add New Event page, you can add details about the Event like title, pictures, videos, booking, etc., to help with the promotion of the Event.
Step 3 - These are the needed information for the Event, you can add the details.
![]()
Title - The name of the Event item.
Editor container - You can add text detail/information, images, or videos about the event.
When - Date and time details of the event.
Where - Location details of the event.
![]()
- This event does not have a physical location. - Option for events that don’t have a physical location.
- Location Name - Full address of the location of the event.
- Address - Street/Building/Floor Number of the event location.
- City/Town - City/Town of the event location.
- State/County - State/County of the event location.
- Post Code - Post Code of the event location.
- Region - Region of the event location.
- Country - Country of the event location.
Booking/Registration - Booking information of the event.
![]()
Enable registration for this event - Option to enable booking for an event.
Tickets - Ticket information is set.
- Name - Name of tickets, example: Standard, Intermediate, VIP
- Description - Details about the ticket.
- Price - Ticket price.
- Spaces - Available tickets to sell.
- At least - minimum number of this ticket to buy per booking.
- At most - maximum number of this ticket to buy per booking.
- Available from - Starting date of this ticket when available.
- Available until - End date of this ticket when available.
- Required? - Option for when YES, user must buy 1 or the minimum number of this ticket.
- Available for - Option for to whom this ticket is available.
Add new tickets - Create a new ticket.
Event Options
- Total Spaces - Total space available in the event.
- Maximum Spaces Per Booking - Maximum space that can be booked per booking.
- Booking Cut-Off Date - End date of the booking for this event.
Event Tags - Specific details that can be use to group this event with other events.
Event Category - A broad detail that can categorize this event with other events.
Featured Image - The Image shown in the listings/pages.
Step 4 - Add all the needed details and descriptions for the Event, once satisfied click on Publish button.
To add Events to a page, an element in the Visual Composer is used: Events Display
![]() |
This is the element that will add a Donations on the page. For more information about these elements, go to Masjid Custom Shortcodes > Events Display .
Tags are meant to describe specific details of your posts. They are the micro-data that you can use to micro-categorize your content. Tags are not hierarchical.
Adding tags to a Events post would make it easier to relate a post with another post even if the categories are different.
To create a Tag for a Events, follow these steps:
Step 1 - Navigate your Dashboard to Events > Event Tags. You will see the Event Tags page.
Step 2 - In the page, find the Add New Tag area. Add All the necessary information.
![]()
- Name - The name of the tag.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Description - Description of the tag.
- Color - Add a color scheme for this event category.
- Image - Add an image to represent the category. This image will be used by the Event Tags element to display Event items by category.
Step 3 - Once done filling out the information of the tag, click on Add New Tag button to save.
Note
Adding a tag may affect the tags from other component of the site.
To delete a tag, navigate your Dashboard to Events > Event Tags.
In the Event Tags page, you will see all the created tags.
To delete a tag, you have two options:
Single Delete - Hover your mouse pointer on the tag that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple tags, click on the box beside the tags you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Note
Deleting a tag may affect the tags from other component of the site.
Categories are meant for broad grouping of your posts, think of these as general topics. Categories are hierarchical, so you can add sub-categories. Sub-categories are made when a Category is added to a Parent Category.
Adding categories to a Event would make it easier to locate and post on similar topics by category.
To create a Category for Events, follow these steps:
Step 1 - Navigate your Dashboard to Events > Categories. You will see the Categories page.
Step 2 - In the page, find the Add New item area. Add All the necessary information.
![]()
- Name - The name of the category.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Parent Category - If the category is a sub-category, then look for the parent category in the drop-down box.
- Description - Description of the category.
- Color - Add a color scheme for this event category.
- Image - Add an image to represent the category. This image will be used by the Event Categories element to display Event items by category.
Step 3 - Once done filling out the information of the category, click on Add New item button to save.
To delete a Category, navigate your Dashboard to Events > Categories.
In the Categories page, you will see all the created category.
To delete a category, you have two options:
Single Delete - Hover your mouse pointer on the category that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple categories, click on the box beside the categories you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
To monitor and check for the bookings of an event, read the following information:
To check Events Bookings, go to Events > Bookings.
![]()
You will be at Event Bookings Dashboard where all events that are created are shown.
![]()
In Recent Bookings, Bookings for events are shown with the option for that booking. You can Approve, Reject, Delete, or Edit/View the booking.
In Events With Bookings Enabled, you can click on the name of the event you want to see the booking details. You will see the details and bookings of the event.
![]()
To create a new Donation, follow these steps:
Step 1 - To start creating an Donation, on your Dashboard navigate to Donations > Add Form. The Add New Donation Form page will show.
Step 2 - Once your in the Add New Donation Form page, you can add details about the Donation like title, pictures, videos, donation amount, etc., to help with the promotion of the Donation.
Step 3 - These are the needed information for the Donation, you can add the details.
![]()
Title - The name of the Donation item.
Editor container - You can add text detail/information, images, or videos about the Donation.
Donation Form Options - Set the details and format of the Donation.
Donation Options
Donation Option - Set the price and level of the possible amount donations. Choose from: Multi-level or Set Donation
Multi-level Donation - Create a multi optioned donation for the form.
![]()
Display Style - How the level of the donation is displayed.
Custom Amount - Option to allow users to input their own donation amount.
- Minimum Amount - Set the minimum amount that the user can donate.
- Custom Amount Text - Text to describe the minimum amount.
Donation Level
- Amount - Donation amount for this level.
- Text - Name of the donation level.
- Default - Option to set the donation level as the default level.
![]()
Set Donation - Set a single donation for the form.
![]()
Set Donation - Donation amount set for the form.
Custom Amount - Option to allow users to input their own donation amount.
- Minimum Amount - Set the minimum amount that the user can donate.
- Custom Amount Text - Text to describe the minimum amount.
![]()
Form Display
- Donation Option - How the donation information of the form is displayed.
- Submit Button - The text/label inside the button.
- Default Gateway - What payment gateway is used for the form.
- Guest Donations - Option to allow guest users to donate.
- Registration - Option to display the Registration and/or Login link if user is a non-logged-in user.
- Floating Labels - Option to allow floating labels.
Donation Goal
- Donation Goal - Option to enable donation goal.
- Goal Format - The display format of donation goal.
- Goal Amount - The amount you want to reach for this form.
- Progress Bar Color - The color for the goal progress bar.
- Close Form - Option to automatically close the donation form once donation goal is reached.
Form Content
- Display Content - Option to add details about the donation form.
- Content Placement - Location where the donation details are shown.
- Content - Content for the donation details.
Terms & Conditions
- Terms and Conditions - Option to require the user to accept terms before donating. Choose options: Global Option, Customize, or Disable
- Agreement Label - This will show when Customize option is enabled. Label for the terms.
- Agreement Text - This will show when Customize option is enabled. Content for the terms.
Offline Donations
- Offline Donations - Option to enable offline donation for the form.
- Billing Fields - This will show when Customize option is enabled. Enable the billing details section for this form’s offline donation payment gateway.
- Donation Instructions - This will show when Customize option is enabled. Content for the instructions.
Email Notification
- New Donation - Options for Email details for new donations. You can edit the email by clicking Custommize.
- Donation Receipt - Options for Email details for donation receipt. You can edit the email by clicking Custommize.
- New Offline Donation - Options for Email details for new offline donations. You can edit the email by clicking Custommize.
- Offline Donation Instruction - Options for Email details for offline donation instruction. You can edit the email by clicking Custommize.
Excerpt - Short summary of the information about the Donation.
Form Category - A broad detail that can categorize this Donation with other Donations.
Form Tags - Specific details that can be use to group this Donation with other Donations.
Featured Image - The Image shown in the listings/pages.
Step 4 - Add all the needed details and descriptions for the Donation, Once satisfied click on Publish button.
To add Donations to a page, elements in the Visual Composer is used: Donations Display and Donation Forms
![]() |
![]() |
This is the element that will add a Donations on the page. For more information about these elements, go to Masjid Custom Shortcodes > Donations Display or Masjid Custom Shortcodes > Donation Forms.
Categories are meant for broad grouping of your posts, think of these as general topics. Categories are hierarchical, so you can add sub-categories. Sub-categories are made when a Category is added to a Parent Category.
Adding categories to a Donation would make it easier to locate and post on similar topics by category.
To create a Category for Donations, follow these steps:
Step 1 - Navigate your Dashboard to Donations > Categories. You will see the Form Categories page.
Step 2 - In the page, find the Add New item area. Add All the necessary information.
![]()
- Name - The name of the category.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Parent Category - If the category is a sub-category, then look for the parent category in the drop-down box.
- Description - Description of the category.
Step 3 - Once done filling out the information of the category, click on Add New item button to save.
To delete a Category, navigate your Dashboard to Donations > Categories.
In the Form Categories page, you will see all the created category.
To delete a category, you have two options:
Single Delete - Hover your mouse pointer on the category that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple categories, click on the box beside the categories you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Tags are meant to describe specific details of your posts. They are the micro-data that you can use to micro-categorize your content. Tags are not hierarchical.
Adding tags to a Donations post would make it easier to relate a post with another post even if the categories are different.
To create a Tag for a Donations, follow these steps:
Step 1 - Navigate your Dashboard to Donations > Tags. You will see the Form Tags page.
Step 2 - In the page, find the Add New Tag area. Add All the necessary information.
![]()
- Name - The name of the tag.
- Slug - The URL-friendly version of the name. Usually all lowercase.
- Description - Description of the tag.
Step 3 - Once done filling out the information of the tag, click on Add New Tag button to save.
Note
Adding a tag may affect the tags from other component of the site.
To delete a tag, navigate your Dashboard to Donations > Tags.
In the Form Tags page, you will see all the created tags.
To delete a tag, you have two options:
Single Delete - Hover your mouse pointer on the tag that you would like to delete. You will see a Delete option pop-up. Click on Delete to delete.
Multiple Delete - To delete multiple tags, click on the box beside the tags you would want to delete. Then click on the drop-down box for Bulk Actions and choose the Delete option. Click on Apply button to delete.
Note
Deleting a tag may affect the tags from other component of the site.
To create a new Contact Form item, navigate in WordPress Dashboard to Contact > Add New.
![]() |
The Add New Contact Form page will show. Add the details for the Contact Form.
![]() |
Title - The title for the Contact Form
Form Details - Details and information of the form.
- Form - The codes for the user interface of the form.
- Mail - Set the email template of the form.
- Messages - Message prompt when an action is done with the form.
- Additional Settings - You can add customization code.
After adding all the details, click on Save button to save.
Contact Form Page of Sella is generated by the theme from Contact Form item.
To create an Contact Form Page, follow these steps:
Step 1 - Create a new page where to add the Contact Form.
Step 2 - Add a row element to the page, click the Edit this row option of the row. The Row Settings will pop-up.
Step 3 - Change the settings to your preference.
Step 4 - In the row, to add a title for the page. You have the option to add a Text Block or Section/Header Title element.
Step 5 - Add a new row to add the Contact Form item. The Contact Form can be generated by Contact Form 7 of Theme Element.
Step 6 - The Contact Form 7 Settings will pop-up. Change details as needed.
![]()
- Select contact form - The form you want to add to the page.
- Search title - Optional title to search if no form is added.
Step 7 - You can customize the page by adding other elements to the page.
Step 8 - Once you have finished customizing the page, click on the Publish button.
Sample Contact form
MailChimp for WordPress helps you add more subscribers to your MailChimp lists using various methods. You can create good looking opt-in forms or integrate with any other form on your site, like your comment, contact or checkout form.
To start with making a MailChimp Form, you must set up a MailChimp list in your MailChimp Dashboard. You can read how to make a MailChimp list in this article.
Once you have made the MailChimp list, you can make the MailChimp Form.
In your wordpress dashboard go to MailChimp for WP > Form
![]()
Note
Free users: You should be taken to the ‘Edit form’ page straight away.
Premium users: you will need to make a new form by clicking the ‘Create New Form’ button atop the Sign-up Forms list.
You will be redirected to Edit Form, you will see the content of the form here.
You can add a field in your form by clicking the buttons in Choose a field to add to the form. The items in the List fields are the items in your MailChimp list.
To change the look of your form, you can go to the Appearance tab of the MailChimp form. You can choose the style in Form Style. You can customize the style of the form, just read these article.
Once you are done, click on the Save Changes button.
Directly to the Page
You can add the MailChimp shortcode directly to the page where you would like to add it.
You can get the MailChimp shortcode at the bottom of the Mailchimp Form or by clicking <> Get shortcode button below the title of the form.
![]()
Create a new page where to add the the shortcode.
![]()
Write the MailChimp shortcode at the Editor container.
![]()
You can add other elements in the page if you like. Once done, click on publish.
Integration with Contact Form 7
You can see other plugins that can be integrated with MailChimp in MailChimp for WP > Integrations.
Here you can see that contact form 7 is capable on integrating with MailChimp.
![]()
Click on Contact Form 7 under Enabled Integration to configure the settings.
![]()
Once you are done with the configuration, click on Save Changes button.
On your dashboard, go to Contact > Add New to create a integrated form in contact form 7.
Add the title of the form then create the form by clicking the coding or clicking the buttons on what you would like the form to show.
![]()
Note
To successfully integrate the value from the Contact Form to MailChimp, the tags in contact form should be the same as of the tags in MailChimp.
![]()
![]()
On the page where you want to add the contact form, add a Contact Fom 7 element to the area you want the form to show.
![]()
Then select the form title of the form. You can add other elements in the page if you like. Once done, click on publish.
To edit an existing revolution slider, in your dashboard go to Slider Revolution > Slider Revolution.
![]() |
You can see the existing revolution slider at the Revolution Sliders area. Choose the revolution slider that you would like to edit.
![]() |
In the Slide Editor, you will see the slides that are created for a revolution slider. Click on the slide you want to edit.
![]() |
You can edit the text and image content of the revolution slider as you see fit in the editor. For more info on how to use the Revolution Slider, click here.
![]() |
Once you are satisfied, click the Save Slide button at the upper right of the page.
![]() |
Masjid comes with an advanced customizer, which allows to edit most of the theme’s elements in one place. If you want to use it, navigate to Appearance > Customize.
![]() |
Here you will have the option to customize your site’s identity or how it can be viewed by people.
![]() |
Add all the information you like to add, then click on the Save & Publish button.
You can pick the color scheme of the site here.
![]() |
Note
In order to use this feature, please have SASS Compiler enabled in Unyson extensions.
Add all the information you like to add, then click on the Save button.
The Header is where to set the behavior of the header.
![]() |
- Logo - Logo shown in the header of the site.
- Enable event counter - Option to show the latest event’s counter.
- Event counter text - Text beside the event counter.
- Enable socials - Option to show the socials of the site.
- Enable search - Option to show the search icon in the header.
![]() |
Add all the information you like to add, then click on the Save button.
The Page Header is where to set the look of the default header.
![]() |
Note
This options will show when header option of the page is set to: Use Global Customizer Settings
Display page header - Option to display the default page.
Display breadcrumbs - Option to display the breadcrumbs in the header of the site.
Page header type - Select page header type from list.
Background image - Set the image to use as the background.
Mobile background image - Set the image to use as the background for the mobile view.
Page header height - Height of the header.
Add all the information you like to add, then click on the Save button.
The blog settings is divided into 2:
![]() |
Blog posts list
Display blog sidebar - Option to display sidebar in blog list page.
Place to display sidebar - Where the sidebar is placed.
Select width of sidebar - Width size of the sidebar.
![]()
Single blog post
Display blog sidebar - Option to show sidebar on the individual blog’s page.
Place to display sidebar - Location on the page where the sidebar is placed.
Tags after post - Option to display tags after post.
Social share - Option to show the Social Media Share Buttons.
Social Share - Activate the social media share you would like to show.
Display comments after post - Option to have a comments area after the post.
![]()
This section is divided into 2:
![]() |
![]() |
Note
This options will show in the Gallery Archive only.
Gallery page heading - Text for the heading that will show in the Gallery archive page. (Leave blank to use default text)
Gallery page subheading - Text for the subheading that will show in the Gallery archive page. (Leave blank to use default text)
Number of columns - Number of columns the gallery is displayed in the archive.
![]() |
Note
This options will show in the Events Archive only.
The Google Api Options is where to set the google API key for your google map.
![]() |
- Enter your Google Maps Api key - Enter the Google API key for the google map.
Note
If you don’t have a Google API key, click here to create a new key.
Add all the information you like to add, then click on the Save button.
Option for the front page is shown here.
Front page displays - Options on how the front page/home page looks like.
Your latest posts - Show the latest posts on your blog.
![]()
A static page - Set a page that would stay the same until the page is replaced manually.
![]()
Note
You can also do this using the Homepage Setup instructions in Page > Homepage Setup.
You can customize what is inside the widgets on the page. If a widget is placed on the page you see on the preview, it will be listed on the left side under widgets.
![]() |
Note
You can also do the same thing by following How to Edit Widgets instructions in Widgets & Menu > Widgets.
Socials¶
The Socials is where to set the social media accounts of the site.
Add all the information you like to add, then click on the Save button.