WP Post Modules
Created: June 04, 2017. Last updated: Aug 28, 2019. Version: 2.6.1. Author: SaurabhSharma. email: xconsau@gmail.com
Introduction
Dear buyer, thank you for purchasing "WP Post Modules" plugin. I have handcrafted this document to lessen your efforts in configuring and using this plugin seamlessly. If you find any bug or issue which is beyond the scope of this documentation file, feel free to contact me through my CodeCanyon profile page here. Thanks so much!
Table of Contents
Install WordPress
If you have not set up your WordPress installation yet, you can download a copy of latest WordPress archive from WordPress.org. Next, go through the installation instructions inside readme.html file and set up your WordPress installation. A detailed installation guide can be found on official WordPress Site.
Install WPBakery Visual Composer Plugin
The "WP Post Modules" plugin is an addon for WPBakery Visual Composer plugin. It will be required to install "Visual Composer" plugin for proper functioning of WPPM. The Visual Composer plugin can be purchased and downloaded from CodeCanyon. After purchasing the plugin, please go through the installation instructions and activate the plugin.
Install WP Post Modules Plugin
In order to install the plugin, follow these steps:
1. Download plugin archive from your codecanyon.net account's downloads section. You can download main archive (All files and documentation) or installable plugin zip archive.
2. If you have downloaded main archive, unzip/extract this archive and look for the folder named wp-post-modules.zip. This zip archive shall be used for installation in WordPress admin.
3. Log in to WordPress and navigate to Plugins > Add New. Click on the "Upload Plugin" button.
Upload Plugin
4. Click on the "Choose file" button and browse the plugin ZIP file:
Browse Plugin Archive
5. Next, click on the "Install now" button. The plugin will be installed.
6. After installation, navigate to Plugins > Installed Plugins, and activate the "WP Post Modules" plugin.
Activate Plugin
Manual installation using FTP or File Manager
You can also install the plugin manually using FTP or File Manager. For that, log in to your site's Control Panel > File Manager, or log in to FTP and upload the extracted plugin folder to /wp-content/plugins/ directory. So your installed plugin address will be /wp-content/plugins/wp-post-modules/. After uploading the folder, log in to WordPress and activate the plugin inside Plugins > Installed Plugins.
Creating a Post Module
In order to create a Post Module, follow these steps:
1. Navigate to Pages > Add new.
2. Enter a title for page. Say, "Home".
3. Click on "Backend Editor" link for enabling page builder in backend mode.
Enable backend editor for Visual Composer
4. Click on the "Add Element" button.
Add Element
5. A library panel will open which contains all available Visual Composer elements. Inside search box, type "WP Post Modules", or look for the same inside "All" category.
Add WP Post Modules
6. Click on the "WP Post Modules" icon. It will load inside the page editor. The settings panel for WP Post Module element shall open automtically. If not, hover your mouse on the element and click on "edit" icon. A settings panel will open, as shown below.
WP Post Module Settings
7. The settings panel contains four tab sections. Each section has different settings for generating the post module. Below is a quick referenc on each section:
| Section/Tab name | Description and role |
| Query | This section contains settings for creating the post query. You can choose to show posts from categories, tags, custom post types, selected page/post IDs, etc. You can set number of posts, offest, etc. which are all part of WP Query parameters. |
| Display | This is a display specific section. You can choose post module display template, image sizes, sub styles, hover effects, etc. |
| Content | This section contains settings for text content of post modules. You can set heading tag, font sizes, excerpt length, etc. You can also show/hide various elements like category links, excerpt, post meta, etc. |
| Colors | This section contains settings for choosing colors for various elements inside the post module. |
| Schema | This section is for schema settings. If you wish to use Schema in post modules, you can enable it from this section. |
| Social | This section is used for enabling and selecting social sharing buttons per module. |
| Design Options | This section contains basic design options like margin, padding, background color, border, etc. for the post module container. |
8. After making required settings and changes, click on "Save changes" button. The post module will be added to the page.
9. Finally, publish or update the page and check your site. It shall display post modules with your specified settings and styles.
Using pre built templates
The plugin comes with 15+ pre made page templates with combination of post modules in different styles. These templates are a good starting point for creating your Website's home page instantly. Further, you can play with the elements of these pre made templates and create more such layouts. In order to load a pre made template, follow these steps:
1. Navigate to Pages > Add new. Next, enter a title for your page.
2. Switch to the Visual Composer page builder mode by clicking on the "Backend editor" link.
3. Click on the "Add Template" link, as shown below.
Add pre built template
4. A templates panel will open. Click on the "Default Templates" tab. You shall see all available pre made templates, as shown below:
Pre made templates
5. In order to load a template, hover the mouse pointer on tempate name and click on plus icon. (You can preview the template by clicking on the down arrow next to the plus icon).
6. Upon clicking the plus icon, the template will be added to the page.
Template loaded
7. In order to edit any post module, click on the "edit" icon of the module. You can then change post query, display style and other parameters as required.
8. Finally, publish the page and check the site.
Important: The pre made templates are intended to be used on full width pages (or at least 1120px content area width). So if your theme supports a full width page template, make sure to enable full width. If your theme's content area in pages is narrow, use narrow page templates, as described below.
Using pre made templates for narrow content width
The plugin comes with pre made templates which are designed for narrow content width. If your theme pages contains sidebar, and the content width is no more than 800px, these narrow templates are best suited. In order to load narrow width templates, use page templates whose name contains the word "Narrow". See screen shot below:
Narrow Templates
Creating post modules in AJAX tabs
The plugin comes with a tab interface in which post modules can be loaded through AJAX (without page refresh). This feature is useful when you want to show more posts in a page without compromising page load time and server load. The posts are requested and loaded only when a user clicks on a tab. Further, once the posts are loaded, they are saved for further navigation within the tabs (until the page is refreshed). In order to create post modules in AJAX tabs, follow these steps:
1. Navigate to Pages > Add new. (Or edit an existing page).
2. Switch to the Visual Composer mode by clicking on the "Backend editor" button.
3. Click on the "Add element" button, or the [+] icon for adding the tab interface.
4. Inside the elements library, type "WPPM Tabs" inside the search box, or locate in manually inside the "All" tab.
WPPM Tabs Element
5. Click on the "WPPM Tabs" element. It will be inserted into the page.
6. In order to add a new tab, click on the [+] icon inside the WPPM Tab element, as shown below:
Add new tab
7. An elements library will open. This will show only one element "WPPM Tab" because only this element is supported inside the Tabs interface. Click on the "WPPM Tab" element for insertion into the tabs.
WPPM Tab element
8. A settings panel for the WPPM Tab will automatically open, as shown below. If it doesn't open, click on the edit icon of the element for opening the settings panel.
WPPM Tab Settings
9 Inside the "Tab Title" field, provide a title for the tab. Example, "Fashion". You can enable the ajax loading on tabs using checkbox as shown above. Then click on "Save changes" button and exit the settings panel.
Important: The first tab shall be loaded by default. So do not use ajax loading on first tab. Instead enable it for the next tabs which are hidden on first load.
10. The tab content is still empty, and we need to add posts module inside it. For that, click on the [+] icon of the WPPM Tab, as shown below:
Add tab content
11. From the elements library, add the "WP Post Modules" element.
WP Post Modules added in tab
12. Configure the "WP Post Modules" element to your desired settings and save changes.
13. In order to add another tab, click on the [+] icon of the "WPPM Tabs" element. (There are many [+] icons, so do not get confused. Choose the right one as shown below).
Add new tab
14. Follow steps #7 to #12 for adding content to the tabs. You can follow same procedure for adding more tabs.
15. Finally update / publish the page and check your site. It shall display your newly created tabs.
Note: The plugin also comes with pre made examples of ajax Tab interface. You can load the pre built template from the "Templates" library.
Translating the Plugin
The WP Post Modules plugin is translation ready with language files included in plugin. You can translate the plugin with any translation plugin like WPML, qTranslateX or Loco Translate. But if you wish to translate it manually using PO files, kindly follow these steps.
1. Download poEdit Software from https://poedit.net/ and install on your computer.
2. Open poEdit software and click on File > New from POT/PO file.
3. Browse the wp-post-modules.pot file. A language popup will appear. Choose your language and click on "OK".
Choose translation language
4. For example, choose "Arabic" language. Next, click on any message string and write it's translation inside the "Translation" field.
Edit Translation
5. After making necessary translations, go to File > Save as. Here, provide the file name as wppm-language_country. Please note that the "wppm-" textdomain name is required here. So if it is Arabic, the filename would become wppm-ar_SA.po
6. Once the file is saved, a wppm-language_country.mo file will be compiled and generated.
7. Now you need to define the language inside WordPress settings. For that, log in to WordPress admin and navigate to Settings > General. From the "Site Language", choose the language in which you have created the PO file. Then save changes.
The plugin shall now display translated strings successfully.
Frequently Asked Questions
Below are some Frequently Asked Questions that may help you in finding a solution to your specific issue.
1. I have just uploaded the download zip file to WordPress, but it is showing an error. Why?
Your download zip file is not the plugin itself. It is a collection of plugin and documentation. It will be required to unzip this folder first. Next look for the folder named "wp-post-modules.zip". Use this zip folder for uploading the plugin via WordPress.
2. How to update the plugin
Plugin can be updated in two ways:
2.1) From the WordPress admin: Navigate to Plugins > Installed Plugins. Deactivate the "WP Post Modules" plugin and delete it. Next, install the latest copy of plugin by browsing the wp-post-modules.zip file from your computer.
2.2) From the FTP or Control Panel: Log in to your FTP or Control Panel of hosting account and locate the /wp-content/plugins/wp-post-modules/ folder. Delete this folder and update the latest extracted folder from your computer. This method is safer than the previous one.
Important: After updating the plugin, clear all browser caches of front-end and back-end. If using caching plugins, make sure to purge all caches and minified files.
3. The pre built templates do not show any posts. How to fix this?
When pre built template is loaded, it is required to select query parameters like category or tags from the "Query" tab of WP Post Modules element settings. The categories are different on your computer than the ones exported with pre built template. So you need to choose category names once again and then save settings.
4. The Facebook share button does not show image or description when sharing a post.
Facebook requires a set of Open Graph Meta tags added to the single post or site pages. The WP Post Modules plugin adds these tags properly to your site's single post pages. However, it may still not show images if Facebook has old cached content of your site. In that case you need to scrape your site information 2-3 times using Facebook Debugger. You can also bulk scrape your site URLs using re-scrape.com.
5. My site already has proper OG tags. How to disable social meta tags added by the WP Post Modules plugin?
In order to disable Social tags added by the plugin, add this like of code inside your current theme's functions.php file:
add_filter( 'wppm_enable_social_tags', function() { return false; } );
6. How to change the category items limit in Query options?
By default, category items are limited to 999 to prevent low memory issues. This limit can be changed by adding the following code inside theme's functions.php file:
add_filter( 'wppm_cat_limit', function() { return 2000; } );
Sources and Credits
The plugin uses following files and resources, as listed:
jQuery Easing
http://gsgd.co.uk/sandbox/jquery/easing/
jQuery Marquee
@author Aamir Afridi - aamirafridi(at)gmail(dot)com / http://aamirafridi.com/jquery/jquery-marquee-plugin
jQuery Owl Carousel
https://github.com/OwlCarousel2/
BFI Thumb
(c) 2013 Benjamin F. Intal / Gambit
Icomoon icons
icomoon.io/app/
Live demo images
www.pexels.com
www. unsplash.com
Visual Composer Template Manager
https://github.com/khromov/wp-vc-template-manager
WordPress for providing a platform on which we can create plugins.
Once again, thanks so much for purchasing this plugin. I'd be glad to help you if you have any questions relating to this plugin. If you have a more general question relating to the plugins on CodeCanyon, you might consider visiting the forums and asking your question in the "Item Discussion" section.
Saurabh Sharma