Sandeep Sharma, Author at Sandeep Sharma

11 Best WordPress Testimonial Plugins 2018

Testimonials are essential in building trust with potential customers. If you are buying some product or service then you need some positive things about the service provider. Then we are looking for previous testimonials or reviews about that provider. So here we are created a list of best testimonials plugin for you.

1. Testimonials Widget

[wpplugin title=”Testimonials Widget” image_large=”https://ps.w.org/testimonials-widget/assets/banner-772×250.jpg” image_thumbnail=”https://ps.w.org/testimonials-widget/assets/icon-128×128.jpeg” plugin_author=”Axelerant” plugin_author_url=”https://axelerant.com/” plugin_ratings=”86″ plugin_ratings_url=”https://wordpress.org/support/plugin/testimonials-widget/reviews/” plugin_download=”50,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/testimonials-widget.3.4.2.zip” plugin_tested=”4.8.4″ plugin_url=”https://wordpress.org/plugins/testimonials-widget/”] Testimonials Widget lets you randomly slide or list selected portfolios, quotes, reviews, or text with images or videos on your WordPress site. You can insert Testimonials content via shortcode, theme functions, or widgets with category and tag selections and having multiple display options such as random or specific ordering.

2. Testimonial Rotator

[wpplugin title=”Testimonial Rotator” image_large=”https://ps.w.org/testimonial-rotator/assets/banner-772×250.jpg” image_thumbnail=”https://ps.w.org/testimonial-rotator/assets/icon-128×128.png” plugin_author=”Hal Gatewood” plugin_author_url=”Hal Gatewood” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/testimonial-rotator/reviews/” plugin_download=”40,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/testimonial-rotator.zip” plugin_tested=”4.9.1″ plugin_url=”https://wordpress.org/plugins/testimonial-rotator/”]Finally a really simple way to manage testimonials on your site. This plugin creates a testimonial and a testimonial rotator custom post type, complete with WordPress admin fields for adding testimonials and assigning them to rotators for display. It includes a Widget and Shortcode to display the testimonials.

3. Easy Testimonials

[wpplugin title=”Easy Testimonials” image_large=”https://ps.w.org/easy-testimonials/assets/banner-772×250.jpg?rev=1101417″ image_thumbnail=”https://ps.w.org/easy-testimonials/assets/icon-128×128.png?rev=1101417″ plugin_author=”Gold Plugins” plugin_author_url=”https://goldplugins.com/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/easy-testimonials/reviews/” plugin_download=”40,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/easy-testimonials.zip” plugin_tested=”4.5.0″ plugin_url=”https://wordpress.org/plugins/easy-testimonials/”]

4. Strong Testimonials

[wpplugin title=”Strong Testimonials” image_large=”https://ps.w.org/strong-testimonials/assets/banner-772×250.png” image_thumbnail=”https://ps.w.org/strong-testimonials/assets/icon-128×128.png” plugin_author=”Chris Dillon” plugin_author_url=”https://strongplugins.com/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/strong-testimonials/reviews/” plugin_download=”30,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/strong-testimonials.2.28.4.zip” plugin_tested=”3.7″ plugin_url=”https://wordpress.org/plugins/strong-testimonials/”]A flexible testimonials plugin that works right out of the box for beginners with advanced features for pros, backed by strong support.

5. Testimonial Basics

[wpplugin title=”Testimonial Basics” image_large=”https://ps.w.org/testimonial-basics/assets/banner-772×250.jpg” image_thumbnail=”https://ps.w.org/testimonial-basics/assets/icon-128×128.jpg” plugin_author=”Kevin Archibald” plugin_author_url=”http://kevinsspace.ca/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/testimonial-basics/reviews/” plugin_download=”9,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/testimonial-basics.4.3.5.zip” plugin_tested=”4.6″ plugin_url=”https://wordpress.org/plugins/testimonial-basics/”]Testimonial Basics is a full featured testimonial management plugin.

6. WP Testimonials with rotator widget

[wpplugin title=”WP Testimonials with rotator widget” image_large=”https://ps.w.org/wp-testimonial-with-widget/assets/banner-772×250.png” image_thumbnail=”https://ps.w.org/wp-testimonial-with-widget/assets/icon-128×128.png” plugin_author=”WP Online Support” plugin_author_url=”http://www.wponlinesupport.com/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/wp-testimonial-with-widget/reviews/” plugin_download=”8,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/wp-testimonial-with-widget.zip” plugin_tested=”3.1″ plugin_url=”https://wordpress.org/plugins/wp-testimonial-with-widget/”]Many CMS site needs to display client’s testimonial on their website. WP Testimonial Plugin with Widget allow you to add testimonial
from wp-admin side same like you add post, which allows you to display testimonials on your website the easy way.

7. Handsome Testimonials

[wpplugin title=”Handsome Testimonials” image_large=”https://ps.w.org/handsome-testimonials/assets/banner-772×250.png?rev=1544537″ image_thumbnail=”https://ps.w.org/handsome-testimonials/assets/icon-128×128.png?rev=1544536″ plugin_author=”Ristretto Apps” plugin_author_url=”https://wordpress.org/plugins/handsome-testimonials/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/handsome-testimonials/reviews/” plugin_download=”3,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/handsome-testimonials.zip” plugin_tested=”4.0″ plugin_url=”https://wordpress.org/plugins/handsome-testimonials/”]Handsome Testimonials by Ristretto Apps lets you easily display attractive and eye catching testimonials on your site that evoke your customer’s trust, made easy with Handsome Testimonials by Ristretto Apps. Handsome Testimonials by Ristretto Apps gives you, the WordPress user, super-powers with the ability to magically create great looking testimonials right from the get-go. The plugin comes with modern testimonial designs that can be highly customized.

8. Testimonial

[wpplugin title=”Testimonial” image_large=”https://ps.w.org/testimonial-free/assets/banner-772×250.png?rev=1758433″ image_thumbnail=”https://ps.w.org/testimonial-free/assets/icon-128×128.png?rev=1758433″ plugin_author=”ShapedPlugin” plugin_author_url=”http://shapedplugin.com/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/testimonial-free/reviews/” plugin_download=”4,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/testimonial-free.zip” plugin_tested=”4.0″ plugin_url=”https://wordpress.org/plugins/testimonial-free/”]Testimonial is a Clean, Easy-to-use and Powerful Testimonials Management System for WordPress. This plugin will help you to display easily attractive and eye catching Unlimited testimonials, reviews or quotes in multiple ways anywhere (like post, page, custom template, sidebar, widget) of your site using shortcode.

9. Testimonials

[wpplugin title=”Testimonials” image_large=”https://ps.w.org/super-testimonial/assets/banner-772×250.png” image_thumbnail=”https://ps.w.org/super-testimonial/assets/icon-128×128.png” plugin_author=”Themepoints” plugin_author_url=”http://themepoints.com/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/super-testimonial/reviews/” plugin_download=”3,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/super-testimonial.zip” plugin_tested=”3.8″ plugin_url=”https://wordpress.org/plugins/super-testimonial/”]Testimonials is an easy to use plugin that allows users to add Testimonials to the sidebar, as a widget, or to embed testimonials into a Page or Post using the shortcode. Testimonials also allows you to insert a list of all Testimonials or output a Random Testimonial. Testimonial is 100% responsive for all devices.

10. WP Testimonial Widget

[wpplugin title=”WP Testimonial Widget” image_large=”https://ps.w.org/wp-testimonial-widget/assets/banner-772×250.jpg?rev=1748070″ image_thumbnail=”https://ps.w.org/wp-testimonial-widget/assets/icon-128×128.jpg?rev=1748070″ plugin_author=”Stark Digital” plugin_author_url=”http://www.starkdigital.net/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/wp-testimonial-widget/reviews/” plugin_download=”2,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/wp-testimonial-widget.zip” plugin_tested=”4.0″ plugin_url=”https://wordpress.org/plugins/wp-testimonial-widget/”] Using WP Testimonial Widget, you are able to manage the testimonials for your website. You can specify the number of testimonials to be displayed on your site on page or post or in widget. You can also use quicktag to insert shortcode. You can also re-order the testimonial by drag and drop UI. Now you can categorized your testimonial by adding category in to it. CSS can be uploaded in back end by setting menu.

11. BNE Testimonials

[wpplugin title=”BNE Testimonials” image_large=”https://ps.w.org/bne-testimonials/assets/banner-772×250.jpg?rev=1408518″ image_thumbnail=”https://ps.w.org/bne-testimonials/assets/icon-128×128.png?rev=1408517″ plugin_author=”Kerry Kline” plugin_author_url=”https://www.bnecreative.com/” plugin_ratings=”” plugin_ratings_url=”https://wordpress.org/support/plugin/bne-testimonials/reviews/” plugin_download=”5,000″ plugin_download_url=”https://downloads.wordpress.org/plugin/bne-testimonials.zip” plugin_tested=”4.5″ plugin_url=”https://wordpress.org/plugins/bne-testimonials/”]BNE Testimonials makes it easy to add Testimonials and Reviews to any Page using a shortcode or in a sidebar (widget area) using the provided widgets. Each testimonial includes a title, image, tagline, website URL, and message. You can also separate your testimonials into different groups (categories). BNE Testimonials will inherit the styling from your theme – just install and get to work adding your testimonials and reviews!

How To Add Favicon icon to the WordPress Admin & Login Pages

Add following in your theme’s functions.php file, or into a custom plugin:

function add_favicon() {
  	$favicon_url = get_stylesheet_directory_uri() . '/images/favicon.ico';
	echo '<link rel="shortcut icon" href="' . $favicon_url . '" />';
}
 
add_action('login_head', 'add_favicon');
add_action('admin_head', 'add_favicon');

11 Useful Page Builder & Shortcodes Plugins For WordPress

1. Visual Composer for WordPress

2. Siteorigin Page Builder

3. Drag and Drop Builder Plugin

4. Minimax – Page Layout Builder

5. SYMPLE SHORTCODES

6. Shortcodes Pro

7. Shortcodes Ultimate

8. Styles with Shortcodes for WordPress

9. WordPress Shortcodes

10. Ether Content Builder WordPress Plugin

11. Content Builder

Simple jQuery Tabs CSS & jQuery

I am here with the tutorial to learn how to make simple jQuery Tabs using CSS & jQuery. There are many tutorials already available online & you might be following them too but I have tried to write it in my own way so that it’s easy for mere a beginner to easily & quickly understand the concept behind this.

Here is the sample how our CSS tabs gonna look & work after all designing & coding.

Various steps are:

1) HTML Code:

We make unordered list for the tabs. Concept of internal linking in HTML has been used. Each element in the unordered list consists of element ‘a’ having ‘href’ attribute which describes the place or element where a link has to be redirected on mouseclick. These are preceeded by special character ‘#’ because of internal linking.

This unordered list is followed by the class ‘tabContainer’ which contains the content for corresponding tab described in divs with class ‘tabContent’. Make note that the attribute of ‘href’ in each list item(tabs) matches the ID of the “.tabContent” div. Its important for the jQuery to pull off the actions.

Here the generic names like ‘tab1’, ‘tab2’, etc have been used to make it easily understandable. In reality, Keywords must be used to make it Search Engine Optimization(SEO) friendly.
The HTML code is as shown below:
[html]
<ul class=”tabs”>
<li><a href=”#tab1″>One</a></li>
<li><a href=”#tab1″>Two</a></li>
<li><a href=”#tab1″>Three</a></li>
<li><a href=”#tab1″>Four</a></li>
<li><a href=”#tab1″>Five</a></li>
</ul>
<div class=”tabContainer”>
<div id=”tab1″ class=”tabContent”>
<h2>One</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries.</p>
</div>
<!– / END #tab1 –>

<div id=”tab2″ class=”tabContent”>
<h2>Two</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries.</p>
</div>
<!– / END #tab2 –>
<div id=”tab3″ class=”tabContent”>
<h2>Three</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries.</p>
</div>
<!– / END #tab3 –>
<div id=”tab4″ class=”tabContent”>
<h2>Four</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries.</p>
</div>
<!– / END #tab4 –>
<div id=”tab5″ class=”tabContent”>
<h2>Five</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries.</p>
</div>
<!– / END #tab5 –>
</div>
<!– / END .tabContainer –>
[/html]
The output will be like :

2) CSS:

The style sheet to define the style for Unordered List, Tab Container, etc. is defined as per the redirement of the coder in CSS file. Here as per my need I have written the CSS as under:
[css]
<pre>ul.tabs {
float:left;
list-style:none;
height:32px;
width:100%;
border-radius:8px 0 -50px 0;
margin:0;
padding:0;
}

ul.tabs li {
float:left;
height:31px;
line-height:31px;
border:1px solid #999;
overflow:hidden;
position:relative;
background:#e0e0e0;
-webkit-border-top-left-radius:8px;
-webkit-border-top-right-radius:8px;
-moz-border-radius-topleft:8px;
-moz-border-radius-topright:8px;
border-top-left-radius:8px;
border-top-right-radius:8px;
margin:0 5px -1px 0;
padding:0;
}

ul.tabs li a {
text-decoration:none;
color:#000;
display:block;
font-size:1.2em;
border:1px solid #fff;
outline:none;
-webkit-border-top-left-radius:8px;
-webkit-border-top-right-radius:8px;
-moz-border-radius-topleft:8px;
-moz-border-radius-topright:8px;
border-top-left-radius:8px;
border-top-right-radius:8px;
padding:0 20px;
}

ul.tabs li a:hover {
background:#ccc;
}

html ul.tabs li.active,html ul.tabs li.active a:hover {
background:#fff;
border-bottom:1px solid #fff;
}

.tabContainer {
border:1px solid #999;
overflow:hidden;
clear:both;
float:left;
width:100%;
background:#fff;
-webkit-border-radius:8px;
-webkit-border-top-left-radius:0;
-moz-border-radius:8px;
-moz-border-radius-topleft:0;
border-radius:8px;
border-top-left-radius:0;
}

.tabContent {
font-size: 12px;
padding:20px;
}</pre>
[/css]
The output will be as shown below:

3) Tab Activation – jQuery:

For those who are not familiar with jQuery, check out their site for a general overview.
The following script contains comments explaining which jQuery actions are being performed.
[javascript]
$(document).ready(function() {
//hiding tab content except first one
$(“.tabContent”).not(“:first”).hide();
// adding Active class to first selected tab and show
$(“ul.tabs li:first”).addClass(“active”).show();

// Click event on tab
$(“ul.tabs li”).click(function() {
// Removing class of Active tab
$(“ul.tabs li.active”).removeClass(“active”);
// Adding Active class to Clicked tab
$(this).addClass(“active”);
// hiding all the tab contents
$(“.tabContent”).hide();
// showing the clicked tab’s content using fading effect
$($(‘a’,this).attr(“href”)).fadeIn(‘slow’);

return false;
});

});
[/javascript]
Final output will be as shown below:

Conclusion

So there we have it, a nice and simple tab function with CSS and jQuery. If you have any questions, comments, or suggestions, please feel free to ask!

You can download the zip files from this link.Download

The Best 15 Mozilla Firefox add-ons for Web-developers

Mozilla Firefox is becoming more & more popular among web-developers now-a-days because of it’s huge collection of add-ons. These add-ons, if used in appropriate manner can help a web-developer in making certain things easier. Some add-ons are just inevitable for a web-developer. Error checking, optimizing the page, validation, etc are certain processes which are necessary to be done and are painful & time consuming. So I am discussing 15 most important add-ons which I recommend all web-developers should install along with their Mozilla Firefox web browser.

1) Firebug

Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.

2) Web Developer

The Web Developer extension adds various web developer tools to the browser in the form of toolbar. Each menu item in toolbar consists of relevant options helpful for web-developers like analyzing, validating and optimizing web-pages, etc. The great thing about this plugin is that it’s on a few different browsers, so if you switch between them you will be able to use the same plugin on all.

3) HTML Validator

HTML Validator is a Mozilla extension that adds HTML validation inside Firefox and Mozilla. The number of errors of a HTML page is seen on the form of an icon. It gives option to choose the algorithm to be followed while validating the html. The algorithm may be HTML Tidy, SGML Parser or Serial Algorithm. HTML Tidy is an algorithm designed for checking the HTML, XHTML Syntax. SGML Parser Algorithm is based on DTD. Serial Algorithm executes first SGML Parser & then if no error, HTML Tidy. Both have their own advantages and disadvantages. The algorithm is choosed on the basis of requirements of the developer.

Whenever there is an error in a webpage, it is shown on the bottom right of the screen as:

When we double click the error the Mozilla page opens showing the errors & warnings along with the line number, column number, etc.

Error rectification is done.

It is displayed in this manner.

4) FireShot

FireShot captures webpage screenshots entirely. It captures entirely, edits and saves the webpages.

5) Measure It

This add-on draws a ruler across any webpage to check the width, height, or alignment of page elements in pixels.

6) ColorZilla

When we click on the icon, it displays the information regarding color in this format. Also saves the value in clipboard for future reference.

These are various options available in ColorZilla.

ColorZilla works as Advanced Eyedropper, Color Picker, Gradient Generator and other colorful goodies.
With ColorZilla one can get a color reading from any point in the browser, quickly adjust this color and paste it into another program. One can Zoom the page he/she is viewing and measure distances between any two points on the page. The built-in palette browser allows choosing colors from pre-defined color sets and saving the most used colors in custom palettes. DOM spying features allow getting various information about DOM elements quickly and easily. The powerful CSS gradient generator allows quick and easy creation of beautiful gradients.

7) FireFtp

FireFTP is a free, secure, cross-platform FTP/SFTP client for Mozilla Firefox which provides easy and intuitive access to FTP/SFTP servers. FireFTP also includes more advanced features such as: directory comparison, syncing directories while navigating, SFTP, SSL encryption, search/filtering, integrity checks, remote editing, drag & drop, file hashing, and much more!

8) IE Tab

With this tool we can easily see how a web page displayed in IE with just one click and then switch back to Firefox. When we right click on a webpage, “View Page in IE Tab” option comes which when clicked the page opens in IE.

9) YSlow

YSlow analyzes web pages and suggests ways to improve their performance based on Yahoo!’s rules for high performance web sites. YSlow is a Firefox add-on integrated with the popular Firebug web development tool. It completes FireBug functionality to make Firefox an unbeatable web development tool.

10) Greasemonkey

This add-on allows us to customize the way a web page displays or behaves, by using small bits of JavaScript.

11) Builtwith

This add-on help developers, researchers and designers to find out what technologies web pages are using which may help them to decide what technologies to they have to implement.

12) GridFox

This add-on draws a grid on top of a website which is useful for checking designs that are supposed to follow a grid-based layout.

Right click anywhere on a website, and go to GridFox > Toggle Grid.

GridFox

In the bottom right, we see some buttons to help create, edit and save a grid. We also see some arrows which let us browse any existing grids for the site we’re looking at.

GridFox
Here we can set the options as per our requirement.
GridFox

13) Font Finder

FontFinder is created for designers, developers and typographers. It allows a user to analyze the font information of any element on a page, copy any piece(s) of that information to the clipboard, and perform inline replacements to test new layouts.
Select a particular element and right click the mouse. Select Font Finder > Analyze Selection or other option desired and outpt will be displayed.

14) Tab Mix Plus

Tab Mix Plus enhances Firefox’s tab browsing capabilities. It includes such features as duplicating tabs, controlling tab focus, tab clicking options, undo closed tabs and windows, plus much more. It also includes a full-featured session manager with crash recovery that can save and restore combination of opened tabs and windows.

15) Window Resizer

The Browser Window Resizer is useful for testing a webpage in different screen sizes. It accurately resizes the browser so that we can see how a web page looks in different standard resolution sizes like 640×480, 800×600, 1024×768, 1280×800, 1280×1024, 1600×1200 resolutions.
This add-on resizes the browser to various standard resolution sizes.