Top 5 CRO WordPress Plugins to Boost Your Sales and Leads

Viewing lower conversion rates is definitely not a pleasant thing to watch. After all, who doesn’t wish to turn their abandoning visitors into customers? Well, everyone does! Simply go for the reliable solution – WordPress CRO Plugins.

Even though WordPress is one of the best content management platforms so far, hosting your website there will do you no good if your website will not offer you one thing—conversion. What benefit will a flowery website offer you when people don’t do what you expect and request them to do? If there is no conversion, then your site will remain one among the millions of deficient flowery decorations populating the Internet. So, how can you make your site achieve your desired conversion rates? To answer this question is WordPress CRO (Conversion Rate Optimization) plugins.Here at TemplateToaster website builder software is the list of leading WordPress CRO plugins that can benefit your conversion rates.

List of the best WordPress CRO Plugins

  1. Optinmonster
  2. Social Locker
  3. Simple page tester
  4. MailChimp Integration
  5. Kissmetrics

Top WordPress CRO Plugins of 2018(Review)

1. Optinmonster

CRO WordPress plugins

Leads are the heart of all conversion efforts. Your endeavors to improve your CRO remain lifeless if you don’t have a plugin to help you generate leads. This optinmonster  tool allows you to optimize the power of your email list on your WordPress website. With this WordPress CRO plugin on your site, you can enjoy the following benefits

  • It allows you to make and utilize various forms on your blogs to get necessary information from them.
  • You enjoy numerous templates for gathering critical information about your online visitors.
  • It blends perfectly with most of the email marketing suppliers such as Campaign Monitor and Constant Contact.
  • You can create numerous chances for converting online users into customers using forms and sidebars.

2. Social Locker

CRO WordPress plugins

In a day when social sharing and connection is now indispensable, you can be sure that if you don’t go social, you will go home—defeated. With this plugin on your list of the best  WordPress CRO Plugins, you will be sure of a program that will help your website to remain socially relevant on the net. Gone are the days when social media used to be another place for sharing small social talk. Social Locker is now a big marketing tool you can use to make boost leads and sales. But how does the plugin work? This is how to optimize its capabilities

  • The user makes an offer such as a checklist, videos, or other downloadable documents.
  • To allow the reader unlock the content, the site owner “pays” them using “likes” or “tweets”.
  • Eventually, the plugin sends the user social signals in exchange for mystery content.

3. Simple Page Tester

CRO WordPress plugins

You cannot talk about having successful CRO efforts without testing them. To do this, you can use simple page tester to split-test the campaign. You do the testing by going to the edit screen of the page that needs testing and clicking on the Setup Split Test. From there, you will need to create your variation and begin the test. To enjoy the full potential of this app, you will need to cough some good cash with the premium version starting from $59 since it offers you better details in your analysis such as the conversion statistics you intend to monitor. However, the developer offers users a trial version before they can elect to buy the plugin or not.

4. MailChimp Integration

CRO WordPress plugins

Email marketing and integration is an integral component of any CRO campaign. To help you do this, you can optimize MailChimp Integration, one of the leading email marketing tools on the market today. With this MailChimp Integration plugin, you can build and manage your email marketing campaigns effectively. Here are some of the things the tool allows you to achieve

  • Add new subscribers to your website’s user list.
  • Subscribe new users to your mailing list automatically.
  • Use templates to create forms.
  • Design your own forms.
  • Put subscription forms in any part of your WordPress site.

5. Kissmetrics

CRO WordPress plugins

With this Kissmetrics plugin, you have one of the best CRO tools. This plugin enables you to answer some of the most critical questions regarding your website’s online activities. First, it enables you to know who your most valuable clients are, the outreach programs that produce the highest income to your business, the type of features your customers love the most about your products or services, lastly, the unfortunate reasons leading to customer cancellations. In short, you get the following benefits by using this tool

  • The precious insight that will enable you to comprehend your customers’ behavior along the sales funnel as a way of enhancing growth and income.
  • The ease of responding to your visitors in real-time.
  • Stem the buying cart abandonment.
  • Track your customers and prospects across all platforms, including mobile ones.
  • Maximize returns on investment.
  • Optimize your website interactions.

Which CRO WordPress Plugins you are using ?

With all these facts at your fingertips, failing in your future CRO efforts would one of the worst decisions you have ever made in your lead and sales generation endeavors. You now know which tool can do what to help you get the best returns on your investments. Alongside these tools, you can also get the best, our TemplateToaster WordPress Theme Builder software for designing themes and templates for CMSs such as WordPress, Joomla, Drupal, and Magento themes. With the software, you can enjoy an advanced group of built-in Slide Show Options to design and add breathtaking slideshow effects to your websites and hundreds of logos, textures, and graphics in our TemplateToaster Library.

Moreover, our software is so easy to use that even rookies handle it like pros. The ball is now in your court to take your CRO efforts to the next level of efficiency and productivity.

Read More
January 24, 2019 0 Comments

How to Add JavaScript and jQuery to WordPress

Sometimes, the power of jQuery and JavaScript goes underutilized. Simply, inserting the WordPress JavaScript or jQuery into the header or footer is not enough !! It is equally important to know that how to properly add these scripts using wp_enqueue_script function.

WordPress is a great Content Management System that separates design from the content. It gives you lots of privileges to alter the look and style of your website. But sometimes, you feel restricted to modify the design due to the preset styling options at the theme level. Here, you add JavaScript and jQuery to WordPress step in. This aid you to work out of the page or post boundaries, you are authoring. You can add different styling, layout or content changes to your site with the use of Javascript or jQuery in WordPress. Even, you can embed audio/video players, interactive pages or subscription forms by using these scripts and libraries. But I think most of the users know where to use WordPress Javascript or jQuery. What they really need to be more concerned about is – how to add jQuery and JavaScript in WordPress.

Many of our readers have queries about this. As sometimes, users got conflicts due to improperly managed scripts, using swapped versions of jQuery or changing the order of script (jQuery) loading etc. So to avoid all these kind of problems here at TemplateToaster website builder, learn the correct way to add JavaScript and jQuery to WordPress.

How to Add JavaScript/jQuery to WordPress Pages or Posts?

Basically, jQuery is the JavaScript library and no other language. So, both will be loaded the same way. There are three methods to add jQuery or JavaScript to WordPress as follows

  • Disable WordPress filtering of script tags.
  • Enqueuing the scripts in WordPress.
  • Using Plugins.

Let’s check out in detail

 

1.  Add JavaScript and jQuery to WordPress by Disable WordPress Filtering of Script Tags

The first method is to disable the filtering of script tags. For this, you need to enable custom tags from wp-config.php within your root web directory.

define( 'CUSTOM_TAGS', true );

Then, you will update functions.php page by adding following code

function add_scriptfilter( $string )
{
global $allowedtags;
$allowedtags['script'] = array( 'src' => array () );
return $string;
}
add_filter( 'pre_kses', 'add_scriptfilter' );

It is functionality-wise fine and easier to implement. But, it is an improper way that leads to more conflicts in future. As multiple plugins may use jQuery and other scripts so WordPress jQuery/scripts will get loaded again and again. It will have a negative effect on your WordPress speed and performance. Similarly, two different of jQuery versions can result in chaos and no results at all.

 

2.  Add JavaScript and jQuery by Enqueuing the Scripts in WordPress

Enqueueing is the most convenient and CMS-friendly way to add scripts/jQuery to WordPress. It is a systematic method to load WordPress jQuery/Javascript by knowing their dependencies. WordPress provides an enqueue script function to ensure that everything works properly. The wp_enqueue_script function tells the WordPress when to load a file, where to load it, and what are its dependencies. It facilitates you to utilize the inbuilt jQuery library that comes with WordPress. It performs well without reducing the speed of your website. You can load your WordPress jQuery/JavaScript using following code

function custom_scripts_method()
{
wp_register_script('customscripts', get_template_directory_uri() . '/js/jquery.min.js', array('jquery'), '1.0.0', true);
wp_enqueue_script('customscripts');
}

add_action('wp_enqueue_scripts', 'custom_scripts_method');

First, you register your script through the wp_register_script() function. It takes 5 parameters

  1. $handle – The first parameter that is a unique name of your script. The function is using a handle name as “customscripts”. It is a required field and should be in all lowercase.
  2. $src – It is the location of your script. If you are loading it locally, better to use content_url, bloginfo(“template_url”), or get_template_directory_uri(). It is optional.
  3. $deps – Specifies an array of dependencies. It will load the jQuery if it is not being loaded already. This is also an optional field.
  4. $ver – This is the version of your script. This parameter is not mandatory.
  5. $in_footer – If you want to place your script in the footer, you will set it to true. If in the header, then you would make it false.

Registration will make WordPress know your assets. After that, you can call the script in wp_enqueue_script() to actually add these assets to the page. Lastly, you will use wp_enqueue_scriptsaction hook to load the script.
This method will avoid the conflicts that arise with multiple occurrences of the scripts. Because it is a two-step method that first registers and then enqueues the script. The registering is a crucial step as it signals the other WordPress sites opened in the same browser to deregister the preloaded jQuery files. Once the other sites cleared the cache by deregistering pre-existing files, no conflicts will be there. Then, you can safely add the JavaScript/jQuery to WordPress. So, enqueuing using wp_enqueue_script() is the most secure way to enhance the functionality of your site by adding WordPress jQuery or JavaScript.

 

3.  Add JavaScript and jQuery to WordPress using Plugins

The third method is the obvious one – through plugins. WordPress repository has a plethora of plugins. You will definitely get something out of it to serve your purpose. It provides you many plugins to insert jQuery or JavaScript to WordPress posts, pages or sitewide (themes, plugins etc).

One of the majorly installed, well-developed, and result-driven plugin to add jQuery to WordPress is – Advanced Custom Fields. It has more than One Million active installs and a 5-star rating. Let’s see how to include jQuery in WordPress using the plugin

1. Install and activate this plugin. After activating, you can find the Custom Fields option under Settingsin the Left pane of the WordPress Dashboard.

2. When you click the Custom Fields option, you will see a screen as shown below

add javascript jquery wordpress wp enqueue script

Click Add New and It will open a new screen to Add New Field Group. So, name your field group. For example, here the name of field group is jQuery Settings.

Custom Fields → Add New → Add New Field Group

add javascript jquery wordpress wp enqueue script

3. Now, click Add Field Button. It will open the new Field particulars option as shown below

add javascript jquery wordpress wp enqueue script

You will specify the Field Name, Field Label, Field Type, Placeholder Text, Rules etc. While defining rules, you can select a post, page or other elements where you want to add script. You can add multiple pages/posts by using and button.

4. Just Publish the changes by clicking Update button from the top-right area of the screen.

5. Navigate to Appearance → Editor → Theme Files. If you want to add your script before page loads then put the field into header.php. In case, you want your script after the page loads include it in footer.php. Here, it is being included in header.php.

Select the header.php file by scrolling the theme files from the right side of the screen. Add the code just above the head closing to add the field as shown below. And, Update it.

<? php wp_head(); ?> <? php the_field(‘jquery_script’); ?>

add javascript jquery wordpress wp enqueue script

6. Navigate to the Post where you want to reflect the changes from the left pane of the Dashboard. Here, Hello World is the post and an alert is added to the jQuery script as shown. Then, Update the post.

add javascript jquery wordpress wp enqueue script

7. Now, when you see the preview of this post, you can see an alert message.

add javascript jquery wordpress wp enqueue script

In the same way, you can add scripts to different pages, posts of your site. So, ACF is a simple plugin to perform powerful functions. That’s why it is adopted by millions of users.

Simple Custom CSS and JS is another top plugin to add scripts to WordPress. There is no need to change your theme files. It will retain the changes you made even if you switch the theme. You can insert the scripts into the frontend or to the admin side. You can include inline or an external script. It gives you more flexibility.

add javascript jquery wordpress wp enqueue script

You can add any custom code CSS, JS or HTML. Simply, click the code you want to add and specify the linking type(Internal/External), location to add etc. as shown

add javascript jquery wordpress wp enqueue script

  1. Active Installs: 100,000+
  2. Rating: 4.7

Similarly, you can use Scripts n Styles plugin. This plugin allows you to add JavaScript/jQuery to WordPress page, post or sitewide. You can add both an external script source or to copy-paste your own JavaScript/jQuery within the <head> tags or above the </body> tag.

add javascript jquery wordpress wp enqueue script

  1. Active Installs: 20,000+
  2. Rating: 4.4

Which method you use to Add JavaScript/jQuery to WordPress Pages or Posts?

Hopefully, you get a good exposure to all the different methods to add jQuery or JavaScript to WordPress. You can opt the enqueuing method or go with the plugins. Both are equally good. But if you choose plugins, you have a clear advantage to define your own rules. You can limit the access to adding scripts to the specific pages, posts, and users. If you are customizing your website design, you can use our WordPress Theme Builder. It offers you the option to add Custom CSS, JavaScript/jQuery to your website theme. Undoubtedly, adding the jQuery/JavaScript will extend the capability of your site.

If you have any queries, you can share in the comment section below.

Read More
January 24, 2019 0 Comments

How to Change WordPress Language : Tutorial for Begginers

You have installed WordPress in your system and by default; it is installed in the English language and now you want to change WordPress language. But you are not sure of the procedure to do it. Sounds familiar? If yes is the answer then reading this tutorial might be a great help regarding how to WordPress change language.

When you install WordPress, by default it is installed in the English language. However, it can be changed later. To change the default language of the WordPress Installation is quite simple as it has the built-in capability to be used in any language.

WordPress is available in more than 70 languages. And translation for more than 160 is in progress. Bear in mind, changing the WordPress site language will only change the language for the WordPress dashboard, it won’t change your page content. It will remain as it was written.

It is really important that you should understand the difference between the front end and the back end language. Front-end is what your visitors will see, while, the backend is what you will see at the back i.e. at the WordPress dashboard or WordPress Admin.

The interface language and the blog language are the two different things to be taken care of. And if you’re creating a website for any of your clients who don’t understand the English, then you’re required to change the interface to the user’s native tongue so he can handle the website well.

The blog language is the dialect in which your blogs on the website are written in. Each blog has its own settings for language. And this makes it really easy to manage your blogs on the website. You can have vernacular blogs on your website. You can build your site with WordPress website builder.

Change WordPress Language in the Dashboard

The simplest way to change WordPress language is through the admin panel.  Go to the Settings → General → Site Language → Save Changes Drop down menu.

Change WordPress Language

There are abundant vernacular to choose from. And the list is far too long that can’t be completely listed here either. So, scroll and choose your mother tongue and get started.

Easy right?

Change WordPress Language Manually

Handling things in your mother tongue is quite simple and it gives you the confidence to carry out the things correctly. But what if the vernacular you’re looking for is not listed in the Site Language drop down menu? Yes! This can be a possibility that the dialect you want to work in is not present here.

Well, in this case, you can install files manually with the help of following steps.

Don’t you worry! The solution is pretty simple.

WordPress uses the gettext system for translation (localization and internationalization). WordPress has 3 types of files used in a framework which contain text ready for translation.

  1. PO (Portable Object)
  2. POT (Portable Object Template)
  3. MO (Machine Object)

All three files contain translated text, text ready for translation, and machine-readable files respectively.

In order to set WordPress in your native tongue, first check the availability of WordPress in your Language.

Found the desired dialect in the repository? Now download the .mo file. Upload the file to either wp-content/languages or wp-include/languages/ directory.

Now open the wp-config.php in the WordPress and paste the following code.

define ( ‘WPLANG’, ‘es_PE’);

This line of code will target the country and the language. This indicates that I’m installing the Spanish pack from Peru. Here, ‘es’ stands for Espanol and ‘PE’ tells you which version of Spanish.

Hit update and your WordPress dashboard will be seen in your chosen vernacular. And this how you can easily change the English to your specified native tongue in no time.

Congratulations! Your website backend is in your familiar dialect now.

Conclusion

So next time you want to change WordPress to your native tongue, you won’t have to go to any tough procedure. Just follow the above-mentioned process and you’re good to go. And changing the WordPress admin language is not tough and especially when you have this guide with you. I hope the above explanation about how to change WordPress language was helpful for you. And any questions regarding the WordPress change language is welcome. Therefore, feel free to share your thoughts in the comments below.

13 Must-Have Tools a WordPress Admin can’t Live Without!
How to get back to your WordPress Admin after Being Hacked

Read More
January 24, 2019 0 Comments

WordPress Theme Development using Bootstrap

Do you want to create your own responsive WordPress themes? Are you getting some cross-browser issues with your site not being responsive? Then, design your own Bootstrap based WordPress theme for better readability, user-experience, and load times.

Responsive websites automatically adjust to look good and function well on any size screen. If you are also thinking to make a responsive WordPress website from scratch, nothing can be better than Bootstrap. Bootstrap is a responsive lightweight, fast, and easy framework to develop mobile-first sites. You can use it uniformly across multiple platforms. So, Bootstrap and WordPress make the best combination to create a responsive website with super speed.

But the question is – How to add Bootstrap to WordPress themes?

Here is a step by step tutorial to guide you through. It will cover all the basics to make a WordPress Bootstrap Enabled theme for your website.

Methods to Add Bootstrap to WordPress

We have many methods to get the best out of the combination of Bootstrap and WordPress. Here, we are listing the three basic methods for WordPress theme development with Bootstrap as follows

  1. Manual Coding
  2. Bootstrap WordPress Theme Builder
  3. Bootstrap Starter Themes for WordPress

Let’s see the step by step procedure to include Bootstrap in WordPress using these methods

1. Manual Coding: Create a Responsive WordPress Theme with Bootstrap

You can manually add Bootstrap files to WordPress by following below mentioned steps

A. Bootstrap Linking to HTML file

1. Making a site responsive corresponds to the process of linking Bootstrap files to the HTML and other related files. Assuming you already have your website design done from PSD to HTML. The HTML file must be having Header, Footer and other sections.

2. Now, Download and unzip Bootstrap files from the official Bootstrap website. For making Bootstrap 3 enabled theme, you will download Bootstrap 3. Similarly, you will select v4.0 to download Bootstrap 4. Bootstrap just released their latest update which was in active development for over two years. The procedure of linking the Bootstrap files will remain same for both Bootstrap 3 and 4. But if you wish to check which could be a better choice, head over to this comprehensive comparison between Bootstrap 3 and 4.

3. Create your HTML directory and give it a desired name. For example, here, its name is ‘bootstrap’.

4. You will get JS & CSS files after downloading Bootstrap. Now, copy these files to your HTML directory, and create a new index.html or if you already have this file (as mentioned in step 1), you can put it into HTML directory. For instance, we have chosen this example design from Bootstrap website itself.

HTML directory WordPress Bootstrap

5. To Link Bootstrap CSS file, copy below code and paste to your index.html file under the <head> tag.

<!-- Bootstrap core CSS →
<link href="css/bootstrap.css" rel="stylesheet">

Linking Bootstrap CSS file to index.html WordPress Bootstrap

6. Similarly, now add core Bootstrap JavaScript after Footer of index.html for faster loading of pages.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>

adding core Bootstrap JavaScript after Footer of index.html WordPress Bootstrap

That was all about linking bootstrap files to HTML.

B. Bootstrap Linking to WordPress

Now, you will see how to add Bootstrap to WordPress.

1. First of all, install WordPress locally or a web host.

2. Create a new folder named “wpbootstraptheme” in wp-content/themes. You can name it as per your choice.

Creating new folder in wp content WordPress Bootstrap

3. Now, you will copy CSS and JS folders from HTML directory to the newly created WordPress theme folder.

copy CSS JS folders to new wordpress theme folder WordPress Bootstrap

4. Create the following basic blank files in the theme folder

  • index.php
  • header.php
  • page.php
  • footer.php
  • functions.php
  • style.css

5. Now, Now, put below code in your Index.php file to have blog posts page for your WordPress site. This acts as your Homepage.

<?php get_header(); ?>
<div id="bs_main" class="row">
<div id="bs_content" class="col-lg-8 col-sm-8 col-md-8 col-xs-12">

<div class="row">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="col-lg-6 col-sm-6 col-md-6 col-xs-12">
<h1><?php the_title(); ?></h1>
<h4>Posted on <?php the_time('F jS, Y') ?></h4>
<div class="container">
<p><?php the_content(__('(more...)')); ?></p>
</div>
</div>
<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>
</div>
</div>
</div>

<?php get_footer(); ?>

6. Now, Create the header.php file. We have taken the HTML code from index.html (created in step A) file from the top till nav and pasted into the header.php file as shown below.

<html>
<head>
<title>Custom Bootstrap Theme</title>

</head>

<body>
<nav class="site-header sticky-top py-1">
<div class="container d-flex flex-column flex-md-row justify-content-between">
<a class="py-2" href="#">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="d-block mx-auto"><circle cx="12" cy="12" r="10"></circle><line x1="14.31" y1="8" x2="20.05" y2="17.94"></line><line x1="9.69" y1="8" x2="21.17" y2="8"></line><line x1="7.38" y1="12" x2="13.12" y2="2.06"></line><line x1="9.69" y1="16" x2="3.95" y2="6.06"></line><line x1="14.31" y1="16" x2="2.83" y2="16"></line><line x1="16.62" y1="12" x2="10.88" y2="21.94"></line></svg>
</a>
<ul class="bs_menu_items nav navbar-nav nav-center">
<?php echo wp_nav_menu();?>
</ul>
</div>
</nav>

7. Later, as you need to add multiple pages to your website from WordPress Dashboard,  add this code to your page.php file.

<?php get_header(); ?>

<div class="wrap">
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">

<?php
while ( have_posts() ) : the_post(); ?>
<?php the_content(); ?>
<?php endwhile; // End of the loop.
?>

</main><!-- #main -->
</div><!-- #primary -->
</div><!-- .wrap -->

<?php get_footer(); ?>

8. Similarly, create the footer.php file, taking code from the index.html file.

<footer class="container py-5">
<div class="row">
<div class="col-12 col-md">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="d-block mb-2"><circle cx="12" cy="12" r="10"></circle><line x1="14.31" y1="8" x2="20.05" y2="17.94"></line><line x1="9.69" y1="8" x2="21.17" y2="8"></line><line x1="7.38" y1="12" x2="13.12" y2="2.06"></line><line x1="9.69" y1="16" x2="3.95" y2="6.06"></line><line x1="14.31" y1="16" x2="2.83" y2="16"></line><line x1="16.62" y1="12" x2="10.88" y2="21.94"></line></svg>
<small class="d-block mb-3 text-muted">© 2017-2018</small>
</div>
<div class="col-6 col-md">
<h5>Features</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Cool stuff</a></li>
<li><a class="text-muted" href="#">Random feature</a></li>
<li><a class="text-muted" href="#">Team feature</a></li>
<li><a class="text-muted" href="#">Stuff for developers</a></li>
<li><a class="text-muted" href="#">Another one</a></li>
<li><a class="text-muted" href="#">Last time</a></li>
</ul>
</div>
<div class="col-6 col-md">
<h5>Resources</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Resource</a></li>
<li><a class="text-muted" href="#">Resource name</a></li>
<li><a class="text-muted" href="#">Another resource</a></li>
<li><a class="text-muted" href="#">Final resource</a></li>
</ul>
</div>
<div class="col-6 col-md">
<h5>Resources</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Business</a></li>
<li><a class="text-muted" href="#">Education</a></li>
<li><a class="text-muted" href="#">Government</a></li>
<li><a class="text-muted" href="#">Gaming</a></li>
</ul>
</div>
<div class="col-6 col-md">
<h5>About</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Team</a></li>
<li><a class="text-muted" href="#">Locations</a></li>
<li><a class="text-muted" href="#">Privacy</a></li>
<li><a class="text-muted" href="#">Terms</a></li>
</ul>
</div>
</div>
</footer>

<?php wp_footer(); ?>

9. Now, create the function.php file. Mainly, you will enqueue your Bootstrap javascript and style files with functions here as shown below

<?php
wp_register_style('bootstrap', get_stylesheet_directory_uri(). '/css/bootstrap.css');
wp_enqueue_style('bootstrap');

wp_register_style('style', get_stylesheet_directory_uri().'/style.css');
wp_enqueue_style('style');

function my_scripts_method() {
wp_register_script('bootstrap', get_template_directory_uri() . '/js/bootstrap.js', array('jquery'), '1.0.0', false);
wp_enqueue_script('bootstrap');;
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
?>

<?php
function theme_setup()
{
register_nav_menus(array(
'primary' => __('Menu', "wpbootstraptheme"),
));
}

add_action('after_setup_theme', 'theme_setup');
?>

10. You will now, write the style.css file for your theme. The example code is here

/*
Theme Name: wpbootstraptheme
Theme URI: https://wordpress.org/
Description: Custom WordPress Theme built with bootstrap
Version:1.1
Author: admin
Author URI: https://wordpress.org/
*/
.container {
max-width: 960px;
}

/*
* Custom translucent site header
*/

.site-header {
background-color: rgba(0, 0, 0, .85);
-webkit-backdrop-filter: saturate(180%) blur(20px);
backdrop-filter: saturate(180%) blur(20px);
}
.site-header a {
color: #999;
transition: ease-in-out color .15s;
}
.site-header a:hover {
color: #fff;
text-decoration: none;
}

/*
* Dummy devices (replace them with your own or something else entirely!)
*/

.product-device {
position: absolute;
right: 10%;
bottom: -30%;
width: 300px;
height: 540px;
background-color: #333;
border-radius: 21px;
-webkit-transform: rotate(30deg);
transform: rotate(30deg);
}

.product-device::before {
position: absolute;
top: 10%;
right: 10px;
bottom: 10%;
left: 10px;
content: "";
background-color: rgba(255, 255, 255, .1);
border-radius: 5px;
}

.product-device-2 {
top: -25%;
right: auto;
bottom: 0;
left: 5%;
background-color: #e5e5e5;
}
/*
* Extra utilities
*/

.border-top { border-top: 1px solid #e5e5e5; }
.border-bottom { border-bottom: 1px solid #e5e5e5; }

.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }

.flex-equal > * {
-ms-flex: 1;
-webkit-box-flex: 1;
flex: 1;
}
@media (min-width: 768px) {
.flex-md-equal > * {
-ms-flex: 1;
-webkit-box-flex: 1;
flex: 1;
}
}

.overflow-hidden { overflow: hidden; }
nav.site-header ul li {
display: inline-block;
padding: 10px;
margin-left: 15px;
}

11. The theme folder shall also have the screenshot of your theme. Say it’s screenshot.png here.

theme folder WordPress Bootstrap

12. You are almost done. Just Activate your wpbootstraptheme theme from WordPress Dashboard.

Appearance → Themes → Activate

activating WordPress theme WordPress Bootstrap

13. Now, create content pages as per your requirements in the Page Editor.

Pages → Add New Page

create content pages WordPress Bootstrap

14. Create a menu by using Add New Menu option.

Appearance → Menu → Add New Menu

creating menu WordPress Bootstrap

15. Your WordPress Bootstrap theme is ready. You can check its Preview. It will look somewhat like this

WordPress Bootstrap theme preview

2. Using WordPress Bootstrap Theme Builder

If you want a cool alternative to coding, you can use our WordPress Bootstrap Builder. A fine software that will give a plain-sailing drag and drop environment. You don’t have to write a single line of code. It will be just a matter of few minutes to design your own theme. The most interesting fact is that all the themes you design in TemplateToaster will be Bootstrap based by default. So, no extra botherations to include Bootstrap in WordPress. You can read our blog to get acquainted with the process of creating a WordPress theme from scratch in TemplateToaster web design software. Just expand the horizons of your imagination, and paint down the theme of your dreams on the canvas of TemplateToaster !!

3. Using Bootstrap based Starter Themes for WordPress

The third method is to start customizing your website on a Bootstrap theme only. A Bootstrap theme is built on top of Bootstrap. It will save your coding efforts. There are many WordPress Bootstrap themes available online. These are Bootstrap packages integrated with WordPress and provide styling, UI components, and page layouts. You can customize the design of your theme manually as per your needs.

  • WordPress Themes Based on Bootstrap 4

There are many WordPress themes available, based on Bootstrap 4. Here, a list of popular WordPress Bootstrap Themes is compiled for you as follows

UnderStrap

This theme is a great combination of WordPress, Underscore, Bootstrap, and Sass. It is maintained by Automattic. You can use it as a parent theme and a starter theme as well. It has WooCommerce support and Contact form 7 support. It is also translation ready and integrated with Font Awesome.

  1. Rating: 5
  2. Active Installs: 5000+

WP Bootstrap Starter

This another WordPress Bootstrap Starter theme. It has fantastic features and you can customize it freely as you want.

  1. Rating: 5
  2. Active Installs: 4000+
  • WordPress Themes Based on Bootstrap 3

There are some top-rated WordPress themes based on Bootstrap 3 as follows

Bootstrap Basic

It is good to build a new site based on Bootstrap 3, fast. It is developed by Vee Winch and licensed under MIT.

  1. Rating: 5
  2. Active Installs: 3000+

Newp

It is a Modern WordPress Bootstrap theme with a dark background with high contrast colors. It provides high-end functionality with a fully featured slider, multiple blog layouts, configurable sidebar etc. It is fully responsive and SEO friendly.

  1. Rating: 5
  2. Active Installs: 1000+

Times Square

It is another fully responsive WordPress theme. It will be a good choice to create a professional site based on Bootstrap 3.

  1. Rating: 4
  2. Active Installs: 500+

Which method you use for WordPress Theme Development using Bootstrap?

Bootstrap is winning the web. It can be estimated by the fact that it is used by 17% of all the websites. Over the short span of time, it’s popularity has grown surprisingly. This is all because of its capability to develop responsive, mobile-first websites. But some people still prefer Foundation. But to know more about these two frameworks, you can read our comparison of Bootstrap vs Foundation. With all the approaches discussed above, you can get best out of the amalgam of Bootstrap and WordPress. So what are you waiting for? Start creating your own WordPress Bootstrap themes today by following these methods!!

We would love to hear your experiences. Please share your thoughts in the comment section below.

Read More
January 24, 2019 0 Comments

A Complete Guide to WordPress .htaccess file: Security, SSL, Redirect, Rules, Tricks & More

It is quite worrisome to control your website’s behavior as it directly affects your customer interaction. What if you know how to handle .htaccess file to boost your site security, speed, and performance!!!

The .htaccess or simply htaccess file is a great tool that allows you to have some worthy cool things on your website. It manipulates how Apache serve files from its root directory and all the subdirectories in WordPress. The WordPress Htaccess file is an important but also a temperamental system file. A small code error in htaccess file can result in server malfunctioning. So, a backup should always be maintained and extra caution should be taken while dealing with it. Here, we will cover all the basics of htaccess file, setting up security, SSL, redirects to permalinks etc. in WordPress htaccess file. So let’s dive in to learn how to optimize the htaccess file for your WordPress website.

Table of Contents
  1. What is a .htaccess File in WordPress?
  2. How to Create a .htaccess File?
    1. By Setting Permalinks
    2. Manual Method
  3. How to Edit .htaccess File?
  4. Performance Optimisation using HTACCESS
  5. Secure WordPress site using HTACCESS file
  6. Redirect URLs using HTACCESS file
  7. HTACCESS file Rules for WordPress Permalinks 
    1. Configuring Permalinks
    2. Add and Customize Blog Permalinks
    3. Changing WordPress Permalinks with .htaccess
  8. How to Force SSL with .htaccess?
  9. More Tips and Tricks for WordPress .htaccess file
  10. To Sum Up

What is a .htaccess File in WordPress website?

The WordPress htaccess file is a server configuration hypertext access file. It helps you to define the rules that how Apache server will handle your website. The file name has a dot (.) at the beginning, to specify that it’s a hidden file. This file is modified to customize SEO friendly permalinks, improving security & performance of a site, redirect links, and much more.

But sometimes, a user may find it difficult to locate the htaccess file after installing the WordPress. For the very first time, it is automatically generated in the WordPress directory when you will customize your permalinks. If not, you need to create it manually. Let’s check out the details to create a WordPress htaccess file.

There are two methods to create an htaccess file as follows:

1. By Setting Permalinks

You don’t have to do much. Just navigate to Settings → Permalinks from your WordPress Dashboard. Then, click Save Changes button on Permalink screen. It will generate a “.htaccess” file in your site root directory.

2. Manual Method

In some rare cases, the file will not be generated automatically due to some read/write/create permissions at the server end. In that case, you will create .htac
cess file manually. For that, you can follow these simple steps:

a. Create a text file in Notepad on your computer.

b. Copy and Paste below code in that file:

# BEGIN WordPress

<IfModule mod_rewrite.c>

RewriteEngine On

RewriteBase /

RewriteRule ^index\.php$ - [L]

RewriteCond %{REQUEST_FILENAME} !-f

RewriteCond %{REQUEST_FILENAME} !-dRewriteRule . /index.php [L]

</IfModule>

# END WordPress

c. Rename the file extension of your text file from .txt to .htaccess.

d. Now, upload your .htaccess file in the websites root directory via File Manager in the cPanel at below location: …/home/yourweb/public_html/.htaccess

How to Edit .htaccess File in WordPress?

You may need to modify the WordPress default HTACCESS file to optimise site for speed, security and other things. There are three different methods to edit WordPress htaccess file as follows:

1. Editing WordPress .htaccess file using cPanel

  • First of all, log in to your cPanel.
  • Go to File Management and select File Manager option.

create htaccess file using cpanel 2 - open file manager

  • Select the public_html/www or Document root. Turn On hidden file checkbox, if already not activated.

create htaccess file using cpanel 1 - browse location

  • Finally, right-click on the .htaccess file and select Edit. Follow your cPanel instructions to edit the file.

create htaccess file using cpanel 3 - edit file

2. Editing .htaccess file using FTP client

The second method to edit WordPress .htaccess file is through FTP client. There are many free FTP client solutions available. FileZilla is one of the popular FTP clients. Here, we are exemplifying the steps using FileZilla:

           Menu Options → Select Server → Force showing hidden files

  • Navigate to the root folder of your domain and download your .htaccess file.
  • That’s it. Now, you can edit .htaccess file.

3. Editing .htaccess from the WordPress Dashboard Using Plugin

The third alternative to editing the WordPress .htaccess file is to use plugins. There are many free plugins that allow you to edit your .htaccess file from the WP dashboard. One of the most popular plugins that you can use is – Yoast SEO Plugin.

  • Once you installed and activated this plugin, you will see the SEO option in the left pane of your WordPress dashboard.
  • When you click on it, a new window will open. From the top bar, select Features and Enable the Advanced settings pages. Then, click Save Changes button.

create htaccess file using yoast 1 - enable advanced settings -

  • Then from left pane of the dashboard, navigate to Tools section under SEO to open File Editor as shown below.

SEO → Tools → File Editor

create htaccess file using yoast 2 - create file

  • Make changes to your .htaccess file here and click Save changes to .htaccess after editing.

create htaccess file using yoast 3 - save code

You can also use WP Htaccess Editor plugin to edit WordPress .htaccess file.

(*Note- Don’t forget to take a backup of your WordPress .htaccess file. A small mistake can make big changes to your site. changes you made so that you can undo if needed.)

There are lots of things, you can do in htaccess file to enhance your WordPress speed, performance and security. Let’s have a closer look.

Common Performance issues due to .htaccess file in WordPress

Each time someone visits your website, the web server loads all .htaccess file configurations. It searches all directories within the domain. This will affect the performance of high-traffic sites. Some other common problems that can be sorted via WordPress htaccess file are:

  • warnings about post content-length
  • exceeds the maximum upload size
  • 413 request entity error
  • 500 internal server error

So, a .htaccess file should be used when the main server configuration is not accessible. What else can be done to boost the performance of your website? Let’s find out various tricks to improve performance through WordPress .htaccess files:

Improve Performance of WordPress site using .htaccess File

You can customize your website in following ways to enhance its performance with WordPress .htaccess file. You just have to copy and paste the below-mentioned codes in .htaccess file for each of the suitable option you want for your Site.

1. Disable AllowOverride

You can restrict the .htaccess files from decreasing the performance by enabling AllowOverride only in required directories. As if AllowOverride is enabled throughout all directories, the server will check all. So, disable the AllowOverride in the site’s root .htaccess file. It should be enabled only in required directories via the server config file.

# increase performance by disabling AllowOverride
AllowOverride None

2. Pass the character set

A character set gives a list of the characters recognized by the hardware/software. So to instruct the browser to use a specific character set for rendering the page, you need to specify the character set of the webpage. To give character encoding information, directly affects the web page communication between server & client, form submissions, database connections etc. Your browser will have to guess in case you don’t pass a character set, and it may display “garbage” text. So, you can pass the default character set to prevent the display of errors as follows:

# pass the default character set
AddDefaultCharset utf-8

3. Preserve Bandwidth

Your bandwidth should be able to cater the layout changes, traffic growth, traffic spikes, and should have room to grow. To be future prepare, you can add some directives to increase performance on PHP enabled servers as follows:

# preserve bandwidth for PHP enabled servers
<ifmodule mod_php4.c>
php_value zlib.output_compression 16386
</ifmodule>

4. Set the Server Timezone

Synchronize your server chronologically according to the time zone of the specified state. You can set any time zone from the supported ones.

# set the server timezone
SetEnv TZ America/Washington

5. Set Admin Email Address

Specify the default email address for the server administrator.

# set the server administrator email
SetEnv SERVER_ADMIN default@example.com

6. Enable Browser Caching

Browser caching will allow visitors to save items from your web page. Then, they do not need to download them again. It is used to design different elements like CSS stylesheets and media items. It is a practical solution to allow visitors to load the image saved on their computer rather than your server. This will greatly reduce bandwidth and increase page loading times.

Add this code to enable browser caching:

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 year"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>

7. Enable File Caching

A server-side file caching helps to serve multiple visitors from the same cache without requiring them all to make requests from the origin server. It reduces the load on the origin server and speeds up the first view of a web page. So, .htaccess gives you great privileges that you can specify the type of content to be cached and time value for this. Let’s see some examples to generalize the WordPress .htaccess rules for cached content as follows:

# cache images and flash content for one month
<FilesMatch ".(flv|gif|jpg|jpeg|png|ico|swf)$">
Header set Cache-Control "max-age=2592000"
</FilesMatch>
# cache text, css, and javascript files for one week
<FilesMatch ".(js|css|pdf|txt)$">
Header set Cache-Control "max-age=604800"
</FilesMatch>
# cache html and htm files for one day
<FilesMatch ".(html|htm)$">
Header set Cache-Control "max-age=43200"
</FilesMatch>
# implement minimal caching during site development
<FilesMatch "\.(flv|gif|jpg|jpeg|png|ico|js|css|pdf|swf|html|htm|txt)$">
Header set Cache-Control "max-age=5"
</FilesMatch>
# explicitly disable caching for scripts and other dynamic files
<FilesMatch "\.(pl|php|cgi|spl|scgi|fcgi)$">
Header unset Cache-Control
</FilesMatch>
# alternate method for file caching
ExpiresActive On
ExpiresDefault A604800
ExpiresByType image/x-icon A2419200
ExpiresByType application/x-javascript A2419200
ExpiresByType text/css A2419200
ExpiresByType text/html A300
# disable caching for scripts and other dynamic files
<FilesMatch "\.(pl|php|cgi|spl|scgi|fcgi)$">
ExpiresActive Off
</FilesMatch>

8. Set Default Language & Character Set

You can set the default language and character set for pages served by your server to suit your needs.

# set the default language
DefaultLanguage en-US
# set the default character set
AddDefaultCharset UTF-8

9. Declare Specific/Additional MIME Types

A MIME type tells that what extension type holds what type of file. For example- .html extensions refers to an html document. In WordPress .htaccess file you can specify the additional MIME types as follows:

# add various mime types
AddType application/x-shockwave-flash .swf
AddType video/x-flv .flv
AddType image/x-icon .ico

10. Send Headers Without Meta Tags

This is used to change the current character set and language for a specific directory use:

# send the language tag and default character set
# AddType 'text/html; charset=UTF-8' html
AddDefaultCharset UTF-8
DefaultLanguage en-US

11. Limit Request Methods to GET/PUT

Sites hosted on Apache servers can accept different request methods. For example, GET, POST, DELETE, and PUT methods etc. Some of them are beneficial, some are just unnecessary as increasing the overall security liability of your site. So, you can lock things down by blocking or allowing only specific types of HTTP requests.

# limit server request methods to GET and PUT
Options -ExecCGI -Indexes -All
RewriteEngine on
RewriteCond %{REQUEST_METHOD} ^(TRACE|TRACK|OPTIONS|HEAD) RewriteRule .* - [F]

12. Process Files Based on Request Method

This rule is to process files according to the specified request methods as follows:

# process files according to server request method
Script PUT /cgi-bin/upload.cgi
Script GET /cgi-bin/download.cgi

13. Execute Various File Types via CGI Script

It is used where certain file types need to be processed with some specific cgi script:

# execute all png files via png-script.cgi
Action image/png /cgi-bin/png-script.cgi

14. Speed Up Your Site by Disabling Revisions Autosave

WordPress saves revisions of your pages and posts every time you update. It is an incredibly useful feature as enable you to see the recent changes. But, it can slow down your site’s speed. If you want to sacrifice this revision convenience in order to have a faster website, use this code in the wp-config.php file:

define(WP_POST_REVISIONS, false);

When you again want to enable this feature, just delete this line.

This was all about boosting the performance. Similarly, WordPress htaccess file helps to improve security. Let’s find out how.

The .htaccess file and WordPress Security

It is quite obvious that a few potential vulnerabilities are left unattended in an unsupervised WordPress installation. Even a mid-level WordPress user, don’t dare to mess with the .htaccess file. But the WordPress .htaccess file has great scope to enhance security by preventing many types of website attacks. You can override many of its configuration settings to secure your website. You can try these .htaccess file tricks for better WordPress security:

1. Protect your WordPress Admin area from Unauthorized Access

The wp-admin folder has required files to run the WordPress dashboard. So, all your visitors don’t need to access it. It will be good to enable only a few selected IP addresses to access the wp-admin folder. You can limit the access to certain users like editors, contributors, and other admins. You can use this code snippet in the .htaccess file:

AuthUserFile /dev/null
AuthGroupFile /dev/null
AuthName "WordPress Admin Access Control"
AuthType Basic
<LIMIT GET>
order deny,allow
deny from all
# whitelist My IP address
allow from xx.xx.xx.xxx
# whitelist John's IP address
allow from xx.xx.xx.xxx
</LIMIT>

2. Password Protect WordPress Admin Folder

You can access your WordPress website from various locations like open internet spots. At that point constraining access to particular IP addresses may not work for you. So, an additional password protection can be added to your WordPress admin area.

For that, you need to generate a .htpasswds file. You can use an online generator for this. Upload it outside your openly available web catalog or/public_html/folder. A good path would be:
/home/user/.htpasswds/public_html/wp-admin/passwd/

Then, create a .htaccess file and upload it in /wp-admin/ directory. Now, add the following code:

AuthName "Admins Only"
AuthUserFile /home/yourdirectory/.htpasswds/public_html/wp-admin/passwd
AuthGroupFile /dev/null
AuthType basic
require user putyourusernamehere
<Files admin-ajax.php>
Order allow,deny
Allow from all
Satisfy any
</Files>

3. Disable Directory Browsing

Many WordPress security experts suggest incapacitating catalog perusing. Hackers can look into your site’s directory to find a vulnerable file with directory browsing. So, to impair catalog browsing on your site, you will add this line to WordPress .htaccess file:

Options -Indexes

4. Disable PHP Execution in Some WordPress Directories

Sometimes hackers break into a WordPress site and introduce a secondary passage. The secondary files are masked into /wp-includes/ or /wp-content/uploads/ folders. To prevent this, you have to increase your site security by disabling PHP files. You can accompany this code to disable PHP execution:

<Files *.php>
deny from all
</Files>

5. Protect Your WordPress Configuration wp-config.php File

Another most important file is wp-config.php. It contains the login information for your WordPress database as well as other important maintenance settings. It is necessary to protect it. For that, simply use this code:

<files wp-config.php>
order allow,deny
deny from all
</files>

6. Ban Suspicious IP Addresses

If there are unusual high requests from a particular IP address, you can block them. Add the following code for this:

<Limit GET POST>
order allow,deny
deny from xxx.xxx.xx.x
allow from all
</Limit>

7. Disable Image Hotlinking in WordPress Using .htaccess

Hotlinking is the process of sharing an image by directly linking to your website. It can have a negative effect on your website and can slow it down. You can prevent the hotlinking by adding this code snippet to your WordPress .htaccess file:

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourwebsite.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourotherwebsite.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ http://i.imgur.com/g7ptdBB.png [NC,R,L]

8. Secure Your WordPress Plugin Files

Plugins add incredible functionality to your website. But, they can also leave your website vulnerable to attackers. These can give direct access to unauthorized users and can challenge your website security. But these add awesome features to your site, so it is not wise to stop using them. Rather you can add this code to prevent anyone from having direct access to your plugin files:

&lt;files ~ ".(js|css)$"="&amp;quot;.(js|css)$&amp;quot;"&gt;
order allow,deny
allow from all
&lt;/files&gt;

9. Block Include-Only Files

There are certain files that should never gain access by the user. You can block access to these files by putting the following code to your .htaccess file:

# Block the include-only files.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^wp-admin/includes/ - [F,L]
RewriteRule !^wp-includes/ - [S=3]
RewriteRule ^wp-includes/[^/]+\.php$ - [F,L]
RewriteRule ^wp-includes/js/tinymce/langs/.+\.php - [F,L]
RewriteRule ^wp-includes/theme-compat/ - [F,L]
</IfModule>

 

10. Disable Access to XML-RPC File Using .htaccess

The WordPress install comes with a xmlrpc.php file. It enables third-party apps to connect to your WordPress site. It is recommended to disable this file if you are not using third-party apps with your site. The following code snippet will help you out:

# Block WordPress xmlrpc.php requests
<Files xmlrpc.php>
order deny,allow
deny from all
</Files>

11. Blocking Author Scans in WordPress

It is a common brute force attack technique to run author scans on a WordPress site. It is used to crack passwords for the known usernames. You can prevent these attacks by blocking author scans. The code snippet for this is:

# BEGIN block author scans
RewriteEngine On
RewriteBase /
RewriteCond %{QUERY_STRING} (author=\d+) [NC]
RewriteRule .* - [F]
# END block author scans

12. Block Evil Robots, Site Rippers, and Offline Browsers

There can be unwanted scum in your userspace. To eliminate it, you can make a list of denied agents. You can use this block of code to maintain a blacklist of evil entities:

# deny access to evil robots site rippers offline browsers and other nasty scum
RewriteBase /
RewriteCond %{HTTP_USER_AGENT} ^Anarchie [OR]
RewriteCond %{HTTP_USER_AGENT} ^ASPSeek [OR]
RewriteCond %{HTTP_USER_AGENT} ^attach [OR]
RewriteCond %{HTTP_USER_AGENT} ^autoemailspider [OR]
RewriteCond %{HTTP_USER_AGENT} ^Xaldon\ WebSpider [OR]
RewriteCond %{HTTP_USER_AGENT} ^Xenu [OR]
RewriteCond %{HTTP_USER_AGENT} ^Zeus.*Webster [OR]
RewriteCond %{HTTP_USER_AGENT} ^Zeus
RewriteRule ^.* - [F,L]

You can also redirect the evil agents to a hellish site rather than displaying an error message in the last line of above code with Rewrite line. To redirect them, you will replace the last line with following code:

#redirecting the evil agents
RewriteRule ^.*$ http://www.new-website.com [R,L]

Or redirect to a black hole of fake emails:

RewriteRule ^.*$ http://english-61925045732.spampoison.com [R,L]

13. Disable the Server Signature

You can disable the digital signature that would otherwise identify the server. It can be a security risk as you are essentially telling attackers known vulnerabilities in your system. So to hide the server signature, you will write:

# disable the server signature
ServerSignature Off

WordPress .htaccess: Redirect URLs and more

WordPress redirect is a way to inform your readers that the page they want to read, is moved somewhere else. The browser automatically redirects them to new page. There are various different types of redirects like 301 redirect, 302 redirect, 307 redirect, etc. here, you will see the .htaccess redirect WordPress tricks as follows:

1. Important Note About Redirecting via mod_rewrite

It is necessary to enable the RewriteEngine for all redirects via mod_rewrite directive. the mod_rewrite directive is commonly included in server configuration file or root .htaccess file. If it is not included there, it should be in the first line in any code block that utilizes a rewrite function. To enable it, you will write:

# enable rewrite engine
RewriteEngine on

2.Redirect from “WWW” Domain to “Non-WWW” Domain

It is a good .htaccess technique for SEO, known as www canonicalization. A 301 redirect is used for this. It is better to test after preparing 301 redirects and remove it if any error occurs. Make sure that you included a trailing slash / when linking directories. Finally, use this consistently with all the links of www subdomain or never use it. You can use this code snippet to redirect from www to non-www domain as follows:

# permanently redirect from www domain to non-www domain
RewriteEngine on
Options +FollowSymLinks
RewriteCond %{HTTP_HOST} ^www\.domain\.tld$ [NC]
RewriteRule (.*) http://domain.tld/$1 [R=301,L]

3. Redirect http to https using .htaccess file in WordPress

This technique first checks whether HTTPS is enabled on your server or not. If so, then it will redirect the request to the your homepage.

IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} ^on$ [NC]
RewriteCond %{QUERY_STRING} !https-is-on [NC]
RewriteRule (.*) /?https-is-on [R=301,L]
</IfModule>

To redirect all requests to the HTTPS protocol, if https is enabled; you can use this:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

If you are worried on SEO Issues after redirection, you can check our in-depth Guide on Website Migration: Redirect http to https.

4. Redirect from an Old Domain to a New Domain

It is really common to redirect users to a new location. The following rule is used for this:

# redirect from old domain to new domain
RewriteEngine On
RewriteRule (.*) http://www.new-domain.com/$1 [R=301,L]

5. Redirect String Variations to a Specific Address

If you want to redirect any request containing a string variation to a specific address, you will use this rule:

# redirect all variations of a specific string
RewriteRule ^some-string http://www.domain.com/index.php/blog/target [R]

Alternatively, you can use there two mapping rules:

# map variations to same directory on same server
AliasMatch ^/director(y|ies) /www/docs/target
# map variations to same directory on different server
RedirectMatch ^/[dD]irector(y|ies) http://domain.com

6. Send Visitors to a Subdomain

It will redirect all the visitors to a subdomain of your choice. You will replace the subdomain, domain, and tld to match your subdomain, domain, and top-level domain respectively in the following code:

# send visitors to a subdomain
RewriteCond %{HTTP_HOST} !^$
RewriteCond %{HTTP_HOST} !^subdomain\.domain\.com$ [NC]
RewriteRule ^/(.*)$ http://subdomain.domain.tld/$1 [L,R=301]

7. Redirecting Visitors to a Temporary Site During Site Development

During web maintenance or development, send your visitors to an alternate site. This is a very useful technique to save the visitors from any type of confusions during web-development moments while giving you full access to the site. Here is the generalized WordPress .htaccess rules to do it:

# redirect all visitors to alternate site but retain full access for you
ErrorDocument 403 http://www.alternate-site.com
Order deny,allow
Deny from all
Allow from 99.88.77.66

8. Other Fantastic Redirect Tricks

    • You can also redirect an entire site using WordPress 301 redirect .htaccess.
# redirect an entire site via 301
Redirect 301 / http://www.domain.com/
    • To redirect a specific file, use this rule:
# redirect a specific file via 301
Redirect 301 /current/currentfile.html http://www.newdomain.com/new/newfile.html
    • Use this rule to redirect an entire site via permanent redirect:
# redirect an entire site via permanent redirect
Redirect permanent / http://www.domain.com/
    • Similarly, use following rule to redirect a page or directory via permanent redirect:
# redirect a page or directory
Redirect permanent old_file.html http://www.new-domain.com/new_file.html
Redirect permanent /old_directory/ http://www.new-domain.com/new_directory/
    • Redirect using redirectmatch as follows:
# redirect all requests via RedirectMatch
RedirectMatch 301 (.*) http://www.domain.com/index.html
    • Redirect Users to a Customized 404 Error Page

A 404 error page is encountered when the requested page is not found. The usual reasons are either the deletion of the page or the page has been moved to a new location. It is good to use a custom 404 error page to keep your site streamlined and professional looking. You can use the following code to redirect users to your custom error page:

# custom error pages
ErrorDocument 401 /err/401.php
ErrorDocument 403 /err/403.php
ErrorDocument 404 /err/404.php
ErrorDocument 500 /err/500.php
    • Send Visitors to a Maintenance Page

You can display a maintenance message to your visitors when you are developing or updating your site. You can make use of maintenance plugins for that. But, it is always recommended to create a basic maintenance HTML page. It will convey the visitors that currently the site is experiencing some problems and you will be back soon. So, you can use this code snippet to direct your visitors to this custom page:

RewriteEngineon
RewriteCond %{REQUEST_URI} !/maintenance.html$
RewriteCond %{REMOTE_ADDR} !^123\.123\.123\.123
RewriteRule $ /maintenance.html [R=302,L]

9. More Fun with RewriteCond & RewriteRule

There are some more examples of WordPress .htaccess redirect via Apache’s rewrite module:

# rewrite only if file is not found
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.+)special\.html?$ cgi-bin/special/special-html/$1
# rewrite only if image is not found
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule images/special/(.*).gif cgi-bin/special/mkgif?$1
# rewrite rules for various directories
RewriteRule ^(.*)/aud/(.*)$ $1/audio-files/$2 [L,R=301]
RewriteRule ^(.*)/img/(.*)$ $1/image-files/$2 [L,R=301]
RewriteRule ^(.*)/fla/(.*)$ $1/flash-files/$2 [L,R=301]
RewriteRule ^(.*)/vid/(.*)$ $1/video-files/$2 [L,R=301]
# broswer sniffing via environmental variables
RewriteCond %{HTTP_USER_AGENT} ^Mozilla.*
RewriteRule ^/$ /index-for-mozilla.html [L]
RewriteCond %{HTTP_USER_AGENT} ^Lynx.*
RewriteRule ^/$ /index-for-lynx.html [L]
RewriteRule ^/$ /index-for-all-others.html [L]
# redirect query to google search
RewriteCond %{REQUEST_URI} /search/(.*) [NC]
RewriteRule (.*) http://www.google.com/search?q=$1 [R,NC,L]

HTACCESS file Rules for WordPress Permalinks

1. Configuring Permalinks

Permalinks are the URL to the content that you publish on your WordPress website. There are some specific .htaccess directives for various permalink configurations. There are two specific cases to use .htaccess directives depending upon the location of WordPress installation location as follows:

    • For WordPress installed in the site root:

The WordPress .htaccess directives will look like:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

No changes required, simply plug n play this.

    • For WordPress installed in its own directory

If WordPress is installed in some subdirectory, WordPress creates & uses the following .htaccess directives:

# BEGIN WordPress
<IfModule mod_rewrite.c>
       RewriteEngine On
RewriteBase /wordpress/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /wordpress/index.php [L]
</IfModule>
# END WordPress

2. Add and Customize Blog Permalinks to Create Better URLs

It is a popular .htaccess trick to add some code to create and customize blog permalink settings. Webmasters use this for cleaner URLs that include keywords instead of strings of symbols and numbers. You can make use of the following code in your WordPress .htaccess file to do the same:

# BEGIN WordPress
&lt;ifmodule mod_rewrite.c="mod_rewrite.c"&gt;
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
&lt;/ifmodule&gt;
# END WordPress

3. Changing WordPress Permalinks with .htaccess

Sometimes, you may need to combine your blog with your main website or you are merging another blog into yours. In these cases, it is necessary to make your WordPress find the posts associated with links. As the links can be in another pattern. So, here are some .htaccess rules to serve different purposes when moving your WordPress installation:

    • Moving WordPress from Subfolder to Root

If moving a WordPress installation from a sub-folder to the web root, you need to redirect all hits for your sub-folder, maybe /blog/ to the web root /.

RewriteRule ^blog/(.*)$ /$1 [R=301,L]
    • For Renamed Page or Post, Redirect Previous URL

Here, you will use 301 HTTP status code to refer “moved permanently”.

Redirect 301 "/old-page-name" "/new-page-name"

(Note – These rules are valid for a standard WordPress install and may not operate effectively for non-standard or highly specialized configurations.)

How to Force SSL with .htaccess?

Website’s visitors should access your site using an SSL-encrypted connection for security reasons. Soto force an HTTPS connection on your website adds these rules to your website’s .htaccess file:

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

For more information on SSL like what it is, why it is necessary, you can read our articles on How to Install SSL certificate on your WordPress Website and How to setup SSL.

More Tips and Tricks for WordPress .htaccess file

There are some additional useful tricks to perform specific things in WordPress as follows:

1. Activate SSI for HTML/SHTML File Types

SSI stands for Server Side Includes. The greatest benefit of SSI is to include the contents of one or more files into a single web page on an internet server. It is used to have a common piece of code throughout a site like a page header, footer or a navigation menu. You can use this code snippet to activate SSI for HTML/SHTML file types in .htaccess file:

# activate SSI for HTML and or SHTML file types
AddType text/html .html
AddType text/html .shtml
AddHandler server-parsed .html
AddHandler server-parsed .shtml
AddHandler server-parsed .htm

2. Grant CGI access to a Specific Directory

Common Gateway Interface scripts are the content- generating programs to describe that how the information is passed through web server and browser. To grant CGI access to a particular directory, you can use this code snippet:

# grant CGI access in a specific directory
Options +ExecCGI
AddHandler cgi-script cgi pl
# to enable all scripts in a directory use the following
SetHandler cgi-script

3. Command the Browser for Downloading Multimedia Files Instead of Displaying

Typically, browsers attempt to play multimedia files when direct links are clicked. Here is a method to deliver multimedia file downloads to your users. It provides a link to a multimedia file and a dialogue box will throw a choice of saving the file or opening it. The following WordPress .htaccess rule will work out to edit file types as per your needs:

# command browser to download multimedia files
AddType application/octet-stream .avi
AddType application/octet-stream .mpg
AddType application/octet-stream .wmv
AddType application/octet-stream .mp3

4. Minimize CSS Image Flicker in IE6

You can add the following code to minimize or even eliminate CSS background-image “flickering” in MSIE6:

# minimize image flicker in IE6
ExpiresActive On
ExpiresByType image/gif A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/png A2592000

5. Expression Engine Tricks

# redirect Atom and RSS requests
RewriteRule .*atom.xml$ http://www.yoursite.com/index.php/weblog/rss_atom/ [R]
RewriteRule .*rss.xml$ http://www.yoursite.com/index.php/weblog/rss_2.0/ [R]
# redirect all index.html files
RewriteRule /.*index.html$ http://www.domain.com/index.php [R]

6. Allow Spelling Errors in the URL to be Automatically Corrected

You can allow a misspelled URL to access the file by automatically correcting it. This can be done by adding a Check Spelling directive to your .htaccess file. But it entertains only small typo mistakes, not the gross ones. Add this feature to your site by using the following code:

&lt;ifmodule mod_speling.c&gt;
CheckSpelling On
&lt;/ifmodule&gt;

7. Add a Trailing Slash to the End of Your URL

URLs that don’t have a trailing slash are usually files whereas URLs ending in a trailing slash refers a directory. So, It is possible to have two pages with same URLs but the difference will lie in ending slash. To do this, use the following code:

#trailing slash enforcement
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !#
RewriteCond %{REQUEST_URI} !(.*)/$
RewriteRule ^(.*)$ http://domain.com/$1/ [L,R=301]

8. Increase File Upload Size in WordPress

Usually, the small size files are allowed to upload. But in some cases, the larger size file uploads are required. For that, you need to increase the upload file size limit in WordPress. Sometimes, the traditional methods don’t work out. At that time, you can put this code to WordPress .htaccess file:

php_value upload_max_filesize 64M
php_value post_max_size 64M
php_value max_execution_time 300
php_value max_input_time 300

It will increase file size limit in addition to maximizing the execution time in WordPress.

To Sum Up

WordPress .htaccess is an Apache web server configuration file. It’s commonly used to override other configuration settings, especially at the directory level. Including customizing error pages, access control, changing the behavior of folders, redirection and much more as discussed above. We have tried to cover everything you need to about .htaccess. Hoping you will gain good knowledge about WordPress .htaccess file, its importance, creation, editing, various .htaccess rules, tricks etc. from this blog!!

If you have any queries, you can post in the comment section below.

Read More
January 23, 2019 0 Comments

How to Move WordPress from Localhost to Live Server : Beginners Guide

Do you think it’s the right time to introduce your site to the world? If you checked your local site thoroughly, you can make it live unreluctantly. As here you will get all you need, and how to move WordPress from localhost to live server. Let’s start!

How to move WordPress from localhost to live server?

It’s really good to build a website locally for the speedy development. Even, it saves you from unnecessary headaches of breaking your site while troubleshooting. You can safely test your site for changes and make your workflow more efficient. Once you are satisfied with the design of the website, you can transfer it to the live server. It is quite simple though sounds tough. Here at TemplateToaster website builder, you will get all the details about “How to move WordPress from localhost to live server”.

Methods to Move WordPress from Localhost to live Server and Publish Website

First of all, you will design and test your WordPress website on localhost. For that, you need to install WordPress & XAMPP. For details about setting up a local environment, you can refer our article on how to install WordPress and XAMPP locally. Once you are sure about the performance of your website, you can move it to the server. You have two main methods to migrate your site from localhost to server –

  1. Manual Method
  2. Using Plugins

Assuming, you have a domain name and web hosting, let’s see the step by step procedure to make your site live on the server:

1. Manual Method: How to move WordPress site from localhost to live Server

To move your WordPress site manually, you will first export it via phpMyAdmin.

Step 1: Export Local WordPress Database

For exporting your database, simply navigate to http://localhost/phpmyadmin/ and select your WordPress database. Next, click Export button from the top menu bar.

move wordpress from localhost to server export database

You will find two options here – Quick and Custom. Custom will give you more options to export your database.

move wordpress from localhost to server export database

If you are choosing Custom, make sure that all the tables get selected. Choose the gzipped form of compression for the output file. The gzipped compression is mainly used for large database files.

move wordpress from localhost to server export database

Under Format-specific options, select structure, and data. Also, check the following boxes:

  • Add DROP TABLE / VIEW / PROCEDURE / FUNCTION statement
  • IF NOT EXISTS
  • AUTO_INCREMENT
  • Enclose table and column names with backquotes

move wordpress from localhost to server export database

Once done, click Go button to download the database file.

Step 2: Upload WordPress Files to Live Site

To move your WordPress files, open your FTP client. For demonstration purpose, we are using FileZilla FTP client here. First, connect to your web hosting account and browse the root directory of your live server. Then, Upload all the files in the right destination directory. For example, if you want to host the site on mysite.com, then upload all files in public_html directory.

move wordpress from localhost to server ftp transfer

Step 3: Create New Database on Live Site

Your WordPress files will take a while to upload, meanwhile import the database saved to your hard drive in the first step. Hosting providers offer different ways to do so. Some do it through phpMyAdmin & some via cPanel. The cPanel is more popular so we are creating a database via cPanel here.

First of all, log in to your cPanel dashboard. Click the MySQL Databases icon in the databases section.

move wordpress from localhost to server create database

From the next screen, you will create a database by specifying its name.

move wordpress from localhost to server create database

After creating a database, navigate to the MySQL Users section. Here, create or add an existing user to the database.

move wordpress from localhost to server create database

cPanel will take you to set MySQL privileges for that user. Now, grant all privileges to the user by checking every box. Then, click Make Changes button.

move wordpress from localhost to server create database

Step 4: Import Local Database on Live Site

Go to your cPanel dashboard to import your WordPress database. Navigate to database section and select phpMyAdmin. Now, you can see your newly created database in phpMyAdmin. Go to Import page by clicking the Import Tab on the top bar menu. Next, click on Browse button to choose the database file created in step 1.

move wordpress from localhost to server import database Then, press Go to import your WordPress database.

Step 5: Redirect the Site URLs

Now, you have to replace all the links in the database contained inside are still pointing to the old site location. In phpMyAdmin, look for the wp_options table in your database. Click Browse button or the link in the sidebar to open the page with a list of fields within the wp_options table. Under the options_name file, you need to look for siteURL. Click Edit option that will open an edit field window.

move wordpress from localhost to server import database

In the input box for option_value, you can see the URL of your local install like http://localhost/test. Replace it with your new site URL in this field, for example, http://www.templatetoaster.com.

move wordpress from localhost to server import database

Save the changes by clicking the Go button.

Next, you will repeat the same steps for the option name: home. So, simply find the home tab in the wp_options page. Update the home URL to be your site URL.

You can also Find and replace all instances via a plugin like Velvet Blues. Refer to this detailed tutorial on how to change Mass URLs for a website.

Step 6: Set Up Your Live Site

Once you import the database, it’s time to configure wp-config.php. Connect to your website using an FTP client, find wp-config.php file and right click to View/Edit. Look for the information:

define(‘DB_NAME’, ‘your_database_name’);

define(‘DB_USER’, ‘your_database_user’);

define(‘DB_PASSWORD’, ‘your_database_password’);

define(‘DB_HOST’, ‘localhost’);

Provide the database name, user, and password you created in the earlier step. After that, save the wp-config.php file and upload it back to your server. Your website should be live now so you can log in. Move to Settings » General and without changing anything, Click  Save Changes button. It will ensure that the site URL is corrected wherever needed.

Go to Settings → Permalinks, choose your preferred URL structure and save it to ensure all post links are working well.

Step 7: Fix Images and Broken Links

Whenever you move from local server to a live site, it is obvious to get some broken links and missing images. You can either use the SQL queries or use the Velvet Blues WordPress plugin to fix these.

If you choose SQL, go to phpMyAdmin. Click on your database and press SQL from the top menu. Write this query:

UPDATE wp_posts SET post_content = REPLACE(post_content, 'localhost/test/', 'www.mylivesite.com/');

Replace the local site and live site URLs with your own.

That is it !! You have successfully migrated your site to the live server manually.

2. Make Website Live Using Plugins

The second most convenient and comparatively easier way to migrate your site is by using WordPress plugins. There are many plugins available in WordPress repository for the same. But two most reliable and popular plugins are All-In-One WP Migration and Duplicator. Let’s see the step by step procedure to transfer a site using both one by one:

All-In-One WP Migration plugin

It is a popular plugin with more than 900,000 active installs and a rating of 4.8. It exports your WordPress website including the database, media files, plugins, and themes. You need no technical knowledge for this. The steps you will follow to migrate your site to a live server are as:

Step 1: Install and Activate the plugin.

move wordpress site from localhost to live server with all in one wp migration wordpress pluginmove wordpress site from localhost to live server with all in one wp migration wordpress plugin

 

Step 2: After activating it, you can see an option named All-in-One WP Migration in the left pane of your WordPress Dashboard. Click on Export and it will open an Export Site window as shown below.

move wordpress site from localhost to live server with all in one wp migration wordpress plugin

Here, it will ask you about the format in which you want to Export your localhost site. Suppose you select File. then, it will prompt you to Download Localhost with information of file size as shown below.

Click Download Localhost.

move wordpress site from localhost to live server with all in one wp migration wordpress plugin

Step 3: Now, log into cPanel. Install WordPress on the destination server and then, All-In-One WP Migration plugin from the dashboard. Activate it. Once activated, navigate to left pane of the dashboard and Click Import option under All-In-One WP Migration section.

move wordpress site from localhost to live server with all in one wp migration wordpress plugin

Here, select the same format to Import the local site as selected in Step 2.

Step 4: Select the database file you created in step 2 from the browse button as shown below.

move wordpress site from localhost to live server with all in one wp migration wordpress plugin

Step 5: It will prompt you before Importing the localhost file as shown below. If you have taken the backup of your site and sure to move it, click Proceed.

move wordpress site from localhost to live server with all in one wp migration wordpress plugin

That’s it!! Your site is live now. It is really simple to move your site from localhost to server with All-In-One WP Migration.

Duplicator WordPress plugin

It is another one if the best migration plugins with 1+ million active installs and a 4.9-star rating. Let’s see how to use it to move your WordPress site from localhost to a web server:

Step 1: Download and Install Duplicator on your localhost site from the WordPress plugin repository.

move wordpress site from localhost to live server with duplicator wordpress plugin

Once installed, activate it.

move wordpress site from localhost to live server with duplicator wordpress plugin

Step 2: Now, you can see a Duplicator section in the left pane of your WordPress dashboard. When you click on Packages, it will display No Packages Found. As you have just installed the plugin and no packages are available here.
A package will include an archive and an installer file that automates the process of setting up your site on another server.

So, click “Create New” to create a package.

move wordpress site from localhost to live server with duplicator wordpress plugin

Step 3: The next screen will prompt to specify the name of your package and making a few notes. It’s not necessary to name your package, though you can give it a memorable title. Also, add a few notes if you want to.

There are also some optional Archive and Installer settings. The Archive settings allow you to filter your database. Whereas the Installer options are used to pre-fill the Installer screen to prepare setup at install time for future. It will speed up your overall install process.

Then, click “Next”.

move wordpress site from localhost to live server with duplicator wordpress plugin

Step 4: Duplicator will now run a system scan to ensure the smooth processing of package building. It will also determine the potential issues. More “Warn” checks indicates that you will run into issues during the build and install phases.

Now, press Build to create your package. It will start backing up your site.

move wordpress site from localhost to live server with duplicator wordpress plugin

Step 5: The plugin will produce two files after throwing a package completion message. These files are – an archive of your site as a .ZIP file and an installer file as a .PHP file. Download both files.

move wordpress site from localhost to live server with duplicator wordpress plugin

Step 6: Now, you need to install and unpack your packaged site. For that, you will copy the downloaded files in the earlier step to my live site’s directory. You can use an FTP application like FileZilla for this.

Step 7: Login to your site via FTP and navigate to your public_html folder. Copy the archive and installer files here from your desktop. It can take a little longer.

Step 8: Next, you will install the archived site on the live server. For that, access the installer by adding /installer.php to the domain. It will validate first, all the files copied.

move wordpress site from localhost to live server with duplicator wordpress plugin

Step 9: Then, the installer interface will prompt you to add your MySQL details. In case, you are only replacing an existing site, you will enter the existing database details. If you’re creating a new site, click “Create New”. Then, enter fresh database details. Make sure that you get a “Success” message for both the “Server Connected” and “Database Found” tests before moving on.

move wordpress site from localhost to live server with duplicator wordpress plugin

Step 10:. Next, it will Update Data for your live site.

move wordpress site from localhost to live server with duplicator wordpress plugin

Step 11: Your site is ready and you can test it by opening the front-end of your live site to check that everything is working fine.

move wordpress site from localhost to live server with duplicator wordpress plugin

That’s it !!

Which way you use to Move WordPress from Localhost to Live Server?

As you have seen, it is not that tough to move a WordPress site from localhost to a live server. It takes only a few steps to do all manually. Though using plugins, it is quite simpler. But, you should have enough knowledge to how to move WordPress from localhost to live server manually. When you are bearing the same pain to design a WordPress website, test it, and then to make it live, it should look beautiful and competitive enough. But, you need not struggle more for making an awesome site as you can rely on our WordPress Theme Builder. It will create amazing WordPress website themes for your site with all the latest web design functionalities. You don’t have to write a single line of code, just drag and drop to get your site ready within no time. So, step forward to a smooth journey of website development !!

Read More
January 23, 2019 0 Comments

12 Simple and Practical Strategies to Boost your WordPress SEO

WordPress is SEO-friendly and no wonder over 25% websites run on this platform (most popular sites include Wired, Time, Lifehack among others).

If you are a WordPress website owner, we know it is important to you that your site ranks among the best in the search engines. Not just Google, but even in other search engines.

Reasons for this are obvious.

You want visibility to keep people informed about your organization, sell products and services or promote your business. Your site ranking at the top of the search engines means you can pull traffic your way and in turn build a loyal tribe (customers) that follows you.

To reach there, you must have a strategy. There are a lot of ways you can pull traffic towards your WordPress site, but SEO is one of the well known and most effective of all. The knowledge you will get from this article can be helpful without necessarily having an in-depth knowledge of SEO.

So, do not fret even if you are a beginner. Take a peek below at how you can do WordPress SEO:

Select WordPress-Specific Hosting Provider

This is a mistake you cannot afford to make. It is vital that you choose a hosting provider that can directly affect the downtime experience of your site and the distance between the servers and your target audience. The best way is to choose a customized WordPress hosting plan to boost your SEO.

Pick the Right Optimized Themes for Search Engines

Your site’s layout and general appearance are determined by the theme you pick. You will, therefore, need to pick an SEO friendly theme to speed up your site. Tags come in many forms but what you want are themes with features that improve your SEO rankings.

SEO Plugin Choice

Tools used to improve your WordPress site’s ranking are also useful. You can install these add-on plugins on your site to improve your SEO rankings. They offer sitemaps which are small targeted features aimed at attracting relevant traffic to your site.

Change the Structure of Your ‘Permalink’

These are links that people and bots use to get to your site. They should indeed be clear, descriptive, and accurate about what your site’s purpose is in the first place. Instead of using numbers or other plain text, you can make use of the ‘Post Name.’ This will make sense to the search engines and those interested in what you have to offer. WordPress SEO provides a lot of automatic suggestions you can pick.

Your Sitemap Creation

Your sitemap creation helps the search engine bots to trace your information much easier. Basically what sitemaps do is show the organized content and pages of your site in a simple way to quickly show search engine crawlers what your site is all about. Directly, the sitemaps do not affect SEO rankings but help in indexing your site. There are plugins for this purpose as well.

Heading Tags Should be Used throughout Your Content

When you write your content, you should structure it. Include headings and subheadings in your content. It helps the search engine bots to understand what the content is all about. This is one step ahead of what the sitemaps do. WordPress editing tools include headings with different sizes.

This is not only important to crawlers but also to the readers of your content. It also has a fine visual benefit. Your content can be understood by a visitor without reading every word as it helps to break the content.

Use Keywords in Your Content

To achieve this, you should know your audience and predict the kind of word or phrase they might use when searching similar content as yours. For instance, if you want to write about piano lessons, you can choose a keyword, ‘piano for beginners.’ You can hope that many piano starters will type this phrase.

Hence, picking a keyword for every post or webpage and applying it in different areas — like the title, headings, and within the content itself — is a simple way to describe your topic to search engine bots and enhance the likelihood of exposing your content in related searches.

Be careful not to “stuff” these phrases in your content until it appears unreadable or unnatural.

Include Quality Internal and External Content Links

Associating your content with both internal and external content will help the search engines determine what your content is related to. Just like with keywords, you should not stuff links in your content. If your content is about pianos, do not link it to cooking products or content. This will look spammy. The right choice and use of links can boost your SEO rankings.

Design Your Site to Respond to Different Devices

You should create your site to respond to both computers and smartphones. Google considers these factors to rank sites which should tell you that it is an important aspect. WordPress and have made this easy to do by clicking on the right themes.

Your Images Should be Optimized

Your images should make it easy for pages to load. Make sure that you describe images appropriately because the search engine bots crawl on images to understand your content.

Let Your Content be Long

Google algorithms consider long content more informative and useful to readers. If you write long content that is comprehensible, then you will do better in the SEO rankings.

Post Quality Content Frequently

Make sure to challenge yourself with a posting schedule. This will make crawlers revisit your WordPress site which gives you prominence over others.

Ensure your content contains useful information, be clear of grammatical errors and indeed structure it well. Search engines are always looking for relevant information to rank up the best quality content in search results.

In conclusion, SEO comprises a broad range of strategies and procedures so it can be confusing at times. Luckily, you don’t have to be an SEO specialist to achieve better rank in the SERPs. You can engage a powerful and user-intuitive web design software like TemplateToaster to create high-quality and responsive WordPress themes.

Indeed, embracing WordPress as your website platform is the ideal first step to building a well-optimized website. Then you’ll want to choose the best host, choose a fitting theme, and consider choosing the right plugins and best website design tools. By executing these strategies, you will be well on your way to growing your website’s visibility and business.

Also at the end don’t forget to do an SEO Audit for your WordPress site to ensure everything is in order.

Read More
January 23, 2019 0 Comments

Best WordPress Page Builders Compared (2019)

It is really a difficult task to design a page from scratch. So we need WordPress page builders or best WordPress page builder Plugins. Many things are to be taken into consideration while making WordPress theme from scratch or designing a WordPress page such as functionality, mobile-friendliness, framework, concept, design etc. It becomes more difficult if you have no knowledge of coding.

After having their page done, WordPress users are always in search of some best WordPress page builder to design individual pages. In early days people used advance content editors to structure their pages. Drag and drop WordPress page builders are the new breed of web design software that help to design amazing pages without any coding fuss. You can create WordPress page template from scratch. Here in this article, you will come across the features, price, and editions of various best drag and drop WordPress page builders Plugins and this will help you to choose the one among various best WordPress page builders plugins. you can read about create WordPress page template from scratch and how to fix WordPress page update not working or  how to create WordPress custom login page. So now let’s take a look at the WordPress page builder plugins.

What is WordPress page builder?

WordPress page builder is an optional WordPress tool that allows you to build your pages and infact complete WordPress page from scratch. Designing a page is not easy work that you can knock out in a few hours.The drag and drop WordPress page builders or website builders can surely speed up your site making process and maybe even one that doesn’t cost a dime and without the fuss of learning code.

Why use WordPress page builders?

Some of the paid drag and drop WordPress page builders add complex features to your pages easily and add functionality. In most of the cases they allows you to edit pages with its drag and drop editors. It enables you to see your page look when it goes live. you can learn how to design best SEO WordPress theme. You can secure your site with WordPress security plugins or with Brute force protection plugins of WordPress.

List of Best WordPress Page Builders

  1. TemplateToaster
  2. Beaver Builder
  3. Elementor
  4. Visual composer
  5. Divi
  6. Themify
  7. Page Builder by SiteOrigin
  8. Page builder sandwich
  9. Live composer
  10. Motopress

Best WordPress Page Builders Compared (2019)

Best WordPress Page Builders  CSS Customization Pre-built Templates Usability(on a scale 1-5) Free Version Ready for translation
Elementor Yes Yes 4.8 Yes Yes
Divi Yes Yes 4.8 No No
TemplateToaster Yes Yes 4.9 Yes Yes
Beaver Builder Yes Yes 4.9 Yes No
Visual Composer Yes Yes 4.6 No  No

Best WordPress Page Builders (Review)

1. TemplateToaster ($49 -$199) – best WordPress Page builder plugin

TemplateToaster Web Design Software
TemplateToaster website builder software is a full-fledged robust WordPress website builder which provides an intuitive design environment to design WordPress themes. It is a desktop app that works even offline. It also offer advance options in WordPress backend once you install its theme. It also supports other major CMSes such as Joomla, Drupal, and E-commerce solutions such as Magento, OpenCart, WooCommerce, Prestashop etc. “WordPress with Content” is another feather in the cap by which you can directly add content while designing your theme for WordPress and hence don’t have to worry about adding content later.

  • Responsive web design software with the preview options for desktop, tablet and mobile views.
  • It provides an option to add unlimited widget areas and smooth drag and drop.
  • With the latest version, TemplateToaster provides adding header video.
  • 100s of sample themes and templates available to download free and customize accordingly.
  • Over 100 of color schemes, Google fonts, stock Images.
  • In-built Image Cropping, resizing options.
  • Create dazzling slideshows.
  • Ability to Add custom PHP, CSS and JS code

2. Beaver Builder ($99 – $399) – drag and drop WordPress page builder plugin

beaver builder page builder blog
Beaver builder is one of the famous best drag and drop WordPress page builder plugin that works through modules and widgets to lend a hand to users to generate inspiring and amazing designs. It is bottled with various pre-built layouts and its variations that too are fully mobile-optimized. It has live front-end editing so there is no worry of checking when making changes. You can save and reuse column, rows, and modules for future use. It is a third-party plugin so it doesn’t lock your changes to a specific design. The platform allows you to add audio files and HTML codes. You have complete control over the content even if you stop using the builder. Moreover, it provides over 20 content module options that are suitable for all devices. It has free and paid versions for $99 – $399. The plugin usually gets great reviews and has a strong reputation in its field.

  • An interactive drag and drop interface.
  • Mobile friendly and SEO optimized output.
  • Pre-made templates available export and import feature.
  • Live and front-end editing.
  • Bottled with content option (pricing tables, forms, testimonials, tabs and many more).
  • Video tutorials available.
  • WordPress multisite functionality.
  • Works well with WooCommerce.
  • Compatible with any theme.

3. Elementor ($49- $199) – WordPress page builder

elementor page builder blog

Elementor is the most powerful drag and drop WordPress page builder plugin. The blazing fast speed of the UI that truly set it apart from other. It is made with PHP7 and the latest coding standards. It allows you to see your page live as you edit. It has 28 widgets and you can add widgets created by other WordPress plugins. It also offers pre-built page templates that you can just insert into your pages. The layout is customizable and creates fully responsive perfect pixel design. If you decide to stop using Elementor, the layout is lost but the content remains undamaged. You can click to edit any component and change it with your own content. This crowd pleasing drag and drop WordPress page builder plugin customizes nearly every aspect of your pages. Price range from $49- $199.

  • Templates library.
  • Settings and style tabs.
  • Mobile editing
  • Smooth drag and drop.
  • Revision history.
  • strong customization options.
  • 28 widgets.
  • Multilingual & RTL supported.

4.Visual Composer (Free -$349)

visual composer page builder blog
Visual composer is a crowd favourite WordPress page builder plugin. It is highly advanced and has frontend and backend editing to give you the best of both worlds. The platform leaves behind a large number of shortcodes. The platform ships with 60+ predefined layouts and 45 +content modules. Visual composer increases your online visibility with WooCommerce integration and a Yoast SEO plugin. A good part of best drag and drop WordPress page builder success comes from its 40+ content element, 19 custom layouts, 140+ animations and over 5000 icons to enhance the functionality of the drag and drop plugin. Furthermore, it offer 150 add-ons and templates to make customization fast and straightforward. It has two versions free and $349.

  • bundled with various icon libraries.
  • a full list of Google Fonts.
  • social media integration.
  • Compatible with Yoast SEO.
  • 3rd party shortcodes directly from the editor.
  • Custom CSS and javascript.
  • No coding knowledge required.
  • Responsive and mobile-friendly.

5. Divi ($89 – $249)

divi theme builder blog
Divi has a highly intuitive drag and drop WordPress page builder Plugin. It includes a bevy of modules and has a library of 20+ premade layout which you can mix and match to build stunning pages. It is a feature packed drag and drop WordPress page builder plugin that comes with over 46 content modules so that you can add portfolios, pricing tables, testimonials and lots more. It has feature“split test” that gives you the authority to split test unlimited modules, rows or columns. Divi builder can work with any 3rd party theme. It price is $89 for basic and upper version for $249.

  • Unlimited layout possibilities.
  • Compatible multi themes.
  • Responsive out of the box.
  • Ready for translation.
  • E-commerce integration.

   6. Themify ($39 – $59)

themify page builder blog
Themify allows you to work on both the front-end and the back-end so you don’t need to keep clicking the preview button or guessing when making changes. You get a more innovative privilege to customize everything. It offers responsive elements across all resolutions. It also ships with 60 ready-made layouts, color scheme, customizable designs and support shortcodes. The styling options have Google fonts, video backgrounds, and animations.  Tutorials provided by this plugin is very informative. It also provides over 60+ Animation effects. It can work on any third party theme. Themify is reusable layouts like nested columns/row and an effective modular system. It has tools that provide the import and export feature, draggable column widths, copy/paste modules. This WordPress page builder plugin is available in both free and paid versions $39-$59.

  • Pre-defined content modules like blog posts, sliders, testimonials, text, videos etc.
  • Styling options like video backgrounds, additional CSS classes and styles and much more.
  • SEO friendly,WPML page translations.
  • Import/Export feature.
  • Ready-made layouts.
  • WooCommerce integration.
  • Both front and back-end editing.

7. Page Builder by SiteOrigin (Free – $99)

siteorigin page builder blog
Page Builder by SiteOrigin is a leading drag and drop WordPress page builder plugin. Almost one million active customers don’t lie!
It builds responsive grid-based page content that can be tailored to any mobile device. It is quite simple to make a page with this plugin you just need to drag and drop to customize your site and simply add your own price boxes, call to action, post button and galleries. This free WordPress page builder plugin boasts a lot of widgets. The widgets cover modules for headlines, Google maps, image grid and much more. You can change widget attributes like padding, background, column spacing. It also allows third-party widgets. The platform offers both front and back end live editing but its front end editing is not compatible with the other WordPress page builders in the competition. It is really a good option for beginners as it offers basic essential modules. Even its user interface is decent and the code used is lightweight and SEO friendly. Few of its features are locked and only gets unlock when you buy the premium version. It has history tab which helps to look back and rectify if any mistake is done. Its price is $99 and free version is also available.

  • Grid-based output.
  • Backend and frontend editing.
  • Enabled on any page or post.
  • Customization attributes like colors, styles, add custom CSS, and much more.
  • Pre-made layouts for starters.

8. Page builder Sandwich ($349)

sandwich page builder blog
Page builder sandwich is amazing free front-end editor. Standard WordPress widgets and custom widgets are supported by the sandwich. If you don’t want to start from scratch or you are a newcomer and you want to make stunning pages without touching a single line of coding, then sandwich is for you. Its premium version provides you tons of plugins, shortcodes and vector icons. It is compatible with all major plugins and theme. Above all, it allows you to edit and view content on mobile, desktop and laptop. It comes with essential tools and templates to make sure that you don’t face any problem in creating your site. Even if you disable the plugin, your content does not disappear. The drag and drop WordPress page builder plugin is for $349.

9. Live Composer ($99)

live composer page builder blog
Live composer is open source front-end free WordPress page builder plugin that will help you to design awesome looking modern pages without a single line of coding. It comes with premium quality features and drag and drop interface. It has 30 +content modules including tab, post box, comments, slider, galleries etc. Customization is done using a front end editor while the main editor is displayed at the bottom of each page. It has a customization option for rows, columns, module, and widgets. It allows you to style your page, insert modules and save templates thus, you need not worry about complex code, but for a developer, it has custom CSS box. It is the free alternative to the Visual Composer. The plugin cost $99.

  • open-source front-end  builder.
  • 30+ modules packed.
  • Leaving code behind
  • Drag and drop user interface

10. Motopress Content Editor ($29 -$139)

moto press page builder blog
Motopress allows both front and back-end editing but this transition from back-end to front-end can be glitchy sometimes. It has special feature “motopress content editor” that helps you to switch between front and back end. It provides full drag and drop support while editing, and you can create responsive WordPress page. This WordPress page builder plugins popular feature is it works on existing page and can redesign them. Motopress comes with 20 custom modules and over 30 responsive elements. Its price range from dollar 29 to 139.

11. Qards ($199) – wordpress page builder plugin for landing page

Qards page builder blog
Qards is built by Designmodo. It is for building landing pages for WordPress. The idea behind the tool is to focus on creating content rather than worrying about the design and letting Qards take care of design. The platform includes Pre-Designed Blocks, Easy Click-to-change Editor, Powerful text editor, Fully customizable etc. Professional version for dollar 199.

  • MailChimp subscription.
  • responsive.
  • Predesigned cards.
  • Limitless layout options.

12. Ultimatum ($49- $199)

ultimatum page builder blog
Ultimatum allows you to use any widget and plugin by just dragging and dropping them anywhere in the layout. It comes with the classic 12 column grid system from 960.gs or Bootstrap integrated with 12 boot swatches to enhance the functionality of this WordPress page builder plugin. It is enriched with features like a visual composer, sidebar, seven menu types, custom widgets, front-end CSS editing, countless hooks, etc. It for $55 – $499.

Useful Drag and drop WordPress page builders Plugins

13. King composer ($39 – $499)

kind composer page builder blog
King composer is the fast, powerful and lightweight drag and drop wordpress page builder plugin. It comes with professional Back-End Editor. No coding skills are required and are easy to use. In its pro version, it offers the Front End Editor & Add-ons . Its price $39- $499.

  • Over 850+ Google fonts.
  • Real preview all of the themes.
  • Import & export HTML code.
  • Visualize CSS properties for each node.
  • 3rd-party widgets compatibility.
  • Access to videos tutorials, articles tutorials, documents, developer forum on any trouble.
  • CSS and responsive system in the backend.

14. Cornerstone ($39)

cornerstone page builder blog
Cornerstone’s front-end approach make the user experience much intuitive and responsive than the other drag and drop WordPress page builder plugins. You’ll find useful elements or modules which you can add in a custom layout. Furthermore, it has pre-built page layouts that will help you to kick-start your designs. With the help of Cornerstone, you can make advanced layouts of multiple rows and columns. Price is $39.

  • 42 useful elements.
  • The context-sensitive sidebar panel.
  • Online support forum and documentation.
  • Mobile responsive designs and designs.

15. Awesome builder – simple WordPress page builder plugin

Awesome builder is packed with more than 25 ready widgets. It gives you full control over colors so that you can make great pages. Its responsive layout allows you to enable/disable any widget or row in Desktop or Mobile. It has a save and reuse feature which clones any saved theme in one click. The drag and drop WordPress page builder plugin for $40.

  • Translate into any language.
  • Widget animation.
  • Nested animation.
  • Clone saved template.
  • Simple UI.
  • Video background.
  • Full width and row and background.

16. Content Builder ($69 – $599) – WordPress page builder for content editing

Content Builder gives you leverage to edit all content inside the application and allows you to unite documents, images, and content in one location with just a few clicks. It has magnificent drag and drop interface to change posts and pages. The Content Builder is bottled with various features such as videos, Google maps, dividers, rich text or tabs. It facilitates you to add Vimeo videos or YouTube in a snap. Recently the platform is integrated with Email Studio and has a wonderful feature to Search and filter for the email of your choice. Basic price $69 and upper version $599.

17. Massive Visual ($26) – WordPress page builder for layouts of page

Massive Visual  uses a wide set of shortcodes. The plugin allows you to manage layouts and page items. It offers more than 51 content element and 12+ post modules. It for $26.

18. Zedity ($39 – $249)

Zedity basically is an advance content Editor for WordPress. It’s features include touchscreen devices, modern ribbon interface, content duplication, embed audios and videos. It’s draw box feature enriches your pages with lines, arrows, shapes and has a Freehand drawing feature to sign your articles with your signature. Customization of post and page is fast and easy. No coding skills are required. Buy it for $39 -249.

  • Design freedom.
  • Saves time.
  • Easy to use.

19.Conductor ($99-$399)

Conductor plugin is basically a set of pre designed content blocks that can be customized in its user interface. I has been created for developers and designers that want to create an outstanding pages. You can present your WordPress content in a table, grid or list. It has intuitive drag and drop interface and comes with frontend editor. The main idea behind the plugin is to allow you to modify page layout and change the overall look of the pages. What makes conductor unique is its feature to have complete charge of the page instead of just the content area. Rather than being a content editor, it is also a layout builder that takes complete control over the layout of the page including the header, footer, sidebars, etc. It’s the latest version has symphony framework. If other WordPress page builders are weighing you down, Conductor drag and drop WordPress page builder plugin  is a good candidate to consider and is for $99-$399.

20. Pootle ($99-$149)

Pootle  is a front-end drag and drop WordPress page builder plugin. With this intuitive plugin, you can make stunning looking posts and pages. Technical knowledge is not required. The platform comes with custom layout concepts, add new rows and columns, insert custom media, appearances of block/row/column are managed manually. Its for $99-$149.

  • Add background images, colors and videos to rows.
  • Includes parallax background images for rows.
  • Includes full-width rows, to create long sectional pages.
  • Front-end drag and drop live designer.
  • Customize your own CSS.

21. PixGridder ($24)

PixGridder is a very basic grid generator plugin that generates nice page grids for WordPress. It is not a complete page builder in itself and you need to pay $24.

22. The Creator ($33)

The Creator is incredibly easy to use and simple. No coding skills are required as it work right out of the box. It has 8 different sets of icons and 70+elements. The platform allows you to save layouts for future use. Its poedit feature makes translation easy and fast. The creator modules offer many functionalities and styling options. It has unlimited color and page combination. Its for $33.

23. Content Manager for WordPress ($26)

Content Manager for WordPress creates frontend responsive layout within few minutes. When you are done with the layout you can fill content of your choice without going to the backend. This drag and drop wordpress page builder plugin provides you frontend drag and drop editing of layout and content without going to the admin panel. It is bottled with ready to use shortcode and customization options. you have to $26 for this page builder.

24. Bricklayer ($24)

Bricklayer has an unlimited number of layouts such as full width, narrow, right-sidebar, left-sidebar, boxed, anything you can think of. It is both content and layout building tool. You are allowed to save every configuration as a template and can be reused in future. The plugin offers 20+ widgets to build blocks for any type of design. Bricklayer allows you to custom classes directly from the widgets and price is $24.

25. Rapid Composer ($34)

Rapid Composer developed by Bitorbit has powerful backend and simple to use frontend editor. It has set of essential content elements and integrated with undo/redo, clipboard etc. Drag and drop WordPress page builder plugin price is $34.

26. Tailor -WordPress page builder plugins

Tailor is an open source and free WordPress page builder plugin that helps you to create beautiful and complex sites. You can customize the look of the pages using various options. Drag and drop WordPress page builder plugin supports RTL layouts and multi-language. It has page specific layout settings and adds custom CSS.

  • History panel for undo and redo actions.
  • Modify the appearance of elements using selected options.
  • Copy elements by dragging and holding the shift key.
  • History snapshots.

27. UIX builder (Free)

UIX builder is content creation drag and drop interface with user-friendly and online Visual Editing. It has 6+ One-Page Templates. Its features include customizable core style sheets, support loop list items, RTL support, etc. Its free drag and drop WordPress page builder plugin.

28. Thrive Architect ($67)

Thrive Architect creates beautiful, engaging, visually impressive layout and content for your pages. This engaging drag and drop WordPress page builder comes with inline editing and price is $67. It shines for marketers as its main focus is on marketing. It allows you to preview on different screen sizes. You can create webinar pages, sales pages, opt-in pages, and lot more.

29. Upfront ($49)

Upfront was launched by WPMU DEV in 2015. With Upfront drag and drop WordPress page builder plugin, you can customize the content and design on the front end without ever logging into the admin panel. With this plugin, you can customize every single thing from the front end, drag and drop interface. Its child theme come with 3 options to choose from scribe, fixer, spirit. You have to pay monthly $49.

  • Full Region Customization.
  • Floating Regions, Unlimited Elements.
  • WooCommerce compatible.
  • Galleries, and video backgrounds.
  • Activate parallax with a click.
  • Responsive design.

Bonus Drag and Drop WordPress Page Builders to check out

30. Frontend builder ($57)

Frontend builder has pre-made elements like menus, headings, buttons, and forms that are customizable within the main interface. It is drag and drop composer with 40+ shortcodes. It has live editing and easy to use interface. You ‘ll also find it SEO and retina ready. Drag and drop WordPress page builder plugin is for $57.

  • Live editing.
  • 40+shortcodes.
  • Professional and easy to use interface.
  • SEO and retina ready.

31. Fast page layout

In fast page layout, You don’t need knowledge of javascript, html5 or CSS3. It will save you time for writing code and switch repeatedly from frontend to backend. This fast WordPress page builders plugin creates complex pages fast .Version is for $19.

  • More than 600 Google Fonts.
  • 1100+ Font Icons.
  • Add CSS customizations.
  • More than 100+ Animate effect.
  • Widget Area and Post Gallery Component.

32. Forge -Drag and drop WordPress Page Builder plugin

Not updated from last one year.
Forge has front-end drag and drop interface to create a page. It claims to work with any WordPress theme. Its Pro version also comes with premade layouts. This free WordPress page builder plugin is it save pieces of layout and reuse them anywhere. Its content modules have featured block, pricing tables, login form, etc. An impressive feature of the forge is its Import and export function that helps you to transfer content and designs anytime and anywhere.

  • Embed with Google Maps.
  • Embed videos.
  • Registration Form &login Form.
  • Team Profiles.
  • Content sliders to hold everything.

33. Toolset ($69 -$149)

Toolset is created by the famous WPML team to create custom post types, custom fields, and custom taxonomies. Toolset lets enrich WordPress with Custom Directory and Classifieds Sites.WordPress page builder plugin price is $69-$149.

  • Submit content via front-end editing/creation forms.
  • Creating custom fields, and custom taxonomies.
  • Search your custom post types with advanced queries.
  • Build Custom Directory and Classifieds Sites.
  • Create Custom Templates and Lists for WooCommerce Products.

34. Brix builder ($49 -$99)

Brix builder is a grid-based, intuitive, drag and drop WordPress page builders plugin. It allows you live front-end editing, adding content, drag & drop and all of these features that make Brix so great and without the fuss of having to learn code. Features also include Advanced carousels, undo/redo, and templates management. The best part of WordPress page builder plugin is it shows you a live and high fidelity preview of the changes you made to the content and layout presenting it exactly how a user would see. The WordPress page builders plugin costs $49-$99.

  • Ready for API integration and Ad integration.
  • Includes 500+ icons.
  • Has 16 built-in modules.
  • The advanced grid management system.
  • Live split/merge controls.

35. Parallax one ($24)

Parallax one-page builder WordPress page builders plugin comes with unlimited blocks and parallax effects. The best part is page is created within few minutes. The idea behind the plugin is to make unlimited size one-page sites and use the unlimited amount of ‘blocks’ to customize. Buy WordPress page builders plugin in  $24.

  • Includes Gallery.
  • Included Portfolio.
  • Included DEMO XML.
  • Custom menu and SEO.
  • Custom favicons,Pattern Background, Opacity Background,logo font style.

36. Fusion builder ($60)

Fusion by the famous team behind Avada Theme is a powerful and flexible component. Drag and drop WordPress page builders plugin is for $60.

37. Onepage -Free drag and drop WordPress Page Builders Plugin

Onepager is mainly suitable for small businesses as it allows you to easily create custom layout blocks. This wordpress page builders plugin comes with Various input types, Block-Based Architecture and gulp package manager for instant workflow. It is integrated with the Bootstrap framework and React.js.

New best drag and drop WordPress Page builders

38.The Aqua Page Builder (Free)

Not updated from last 3 years.
Aqua Page Builder is a free WordPress page builders plugin. It has unlimited number of reusable templates. This is mainly a backend plugin and has drag-and-drop user interface. It has dozens of developers friendly hooks and filters. Import/export feature really works well.

39.AIO WP builder (Free)

Not updated from last 2 years.
AIO WP BUILDER is a simple and free WordPress page builders Plugin that create beautiful, highly customised pages. It is mainly designed for content marketers and supports all types of elements including fonts, icon library, video, images etc. It is no longer maintained and may have compatibility issues with recent versions of WordPress.

40. WR Page Builder

Not updated from last 2 years.
WR Page Builder has front and backend drag-and-drop functionality and designed with an easy to use interface. It works on page and post of any theme. It provides you tons of style variation so that you can design stunning pages without any technical knowledge. It’s live preview mode enable the users to see their pages as it would look in the front-end. It enables users to have full control over the pages. Drag and drop WordPress page builders plugin is bottled with advanced page elements such as promotion box, text, videos, QR code, alert, audio, progress circle and much more. So, you can easily find these elements with spotlight filter. The best part is drag and drop WordPress page builder plugins allows you to add widgets to any page in your WordPress editor.

  • Live preview mode.
  • Fully responsive.
  • Backend drag and drop layout.
  • Built in shortcode.

41. Ether Builder – drag and drop WordPress Page builder plugins

Ether Builder is a versatile tool that works with all major themes and allows 3rd party sliders. The platform comes with customizable options and predefined styles. The display of Twitter and Flickr feed is customizable. Its feature media gallery is highly customizable and post feed, social sharing buttons, rich text, pricing box, and a lot more make it a truly magnificent plugin. This drag and drop WordPress page builders plugin is discontinued.

  • Grid and slider capability.
  • Rows with a specified column.
  • Support all themes.

42. Octonis – drag and drop WordPress page builders plugin

Octonis is the most comfortable among drag and drop WordPress page builders where you have to choose and customize blocks to build a stunning pages. It was last updated 2 years ago.This drag and drop WordPress page builders plugin is discontinued.

  • Supports any WordPress theme.
  • built-in themes.
  • No coding skills required.

Using any other Drag and drop WordPress page builders plugins?

If the WordPress page builders you are using is weighing you down, then it’s time to choose an another one from this list of best WordPress Page Builder Plugins Let’s discuss more about your favourite WordPress page builders plugins in comments.

Read More
January 23, 2019 0 Comments

9 Best WordPress Brute Force Protection Plugins (2019)

WordPress is the world’s largest blogging platform. However, you can never know when the malicious mind will hack your site. Because it doesn’t matter how much traffic is on your site, you may at any time be a victim of Brute Force attack. Therefore, you should keep your site safe and secure with a WordPress Brute Force Protection Plugin.
Weak passwords are one of the major loopholes that lead to website hacking. And that is where you need an extra layer of brute force protection of your site from the hackers.

Here at TemplateToaster website maker I have pinned down the best WordPress Brute Force protection Plugins for you. And before I introduce the list to you, here is a brief about brute force attack.

What is a Brute Force Attack?

In this digital world, Brute force attack is a hit and trial method used to decode login credentials of a website. The hackers use an automated software that tries repetitive consecutive attempts to gain access to a website or a server. And the software keeps trying the unique combinations until it gets in.

So, there are chances that your website can be hacked. With massive speed and recursive actions, attackers might get successful guessing your username and password. That being said, enforcing an additional layer of security is required to deflect any breach attempts.

WordPress has become a widely used platform in the digital world due to its flexibility and the availability of a number of plugins. As per BuiltWith and W3Techs WordPress Powers around 31 percent of all websites on the internet. Now that the internet is flooded with the WordPress website so it is required to take Brute Force protection measures to keep them safe and secure.

Here at TemplateToaster Website builder,I have listed down some of the best WordPress Brute Force Protection Plugins to give you complete protection against brute force attack.

Let’s have a look.

But wait, if you want to see the comparison between the Brute Force Protection Plugins for WordPress then you can skim the following comparison chart for a quick understanding.

Best WordPress Brute Force Protection Plugins Compared (2018)

Plugins Active Installs Required WordPress version Tested up to Ratings
Loginizer 700,000+ 3.0 4.9.8 4.8/5
Login LockDown 200,000+ 3.6 4.9.8 4.6/5
Limit Login Attempts Reloaded 100,000+ 3.0 4.9.8 4.6/5
WP Limit Login Attempts 40,000+ 3.0 4.9.8 4.6/5
Brute Force Login Protection 20,000+ 2.7.0 4.8.7 4.3/5
Limits Attempts by Best Web Soft 10,000+ 3.9 4.9.8 4.6/5
Limit Login Attempts 5,000+ 2.0.2 4.9.8 3.7/5
WPS Limit Login 2000+ 4.2 4.9.8 5/5
BruteGuard – Brute Force Login Protection 100+ 4.4 4.9.8 5/5

As you can see in the above chart I have mentioned the best WordPress Brute Force Protection Plugins and their comparison with each other along with their overall ratings.

Now let’s understand each Brute Force Protection Plugins plugin one by one.

List of the best WordPress Brute Force Protection Plugins

  1. Loginizer
  2. Login LockDown
  3. Limit Login Attempts Reloaded
  4. WP Limit Login Attempts
  5. Brute Force Login Protection
  6. Limit Attempts
  7. Limit Login Attempts
  8. WPS Limit Login
  9. BruteGuard

 

Best WordPress Brute Force Protection Plugins in detail

1. Loginizer

WordPress Brute Force Protection Plugin

Loginizer is one of the best open source and free brute force login protection plugin for WordPress. And Loginizer has enormous 700,000+ active installs. It is filled with many effective features to protect your site from any malicious attack.

Features:

    • 700,000+ active installs for Loginizer.
    • It aids you to Whitelist or Blacklist users as per their involvement to your site.
    • It uses reCAPTCHA, two-factor authentication, Passwordless logins etc. so that site data’s authentication can be maintained.
    • Like all other, it also blocks the IP after specific login attempts.

 

2. Login LockDown

login lockdown WordPress Brute Force Protection Plugin

Login LockDown protects your site from the brute force attack by recording the IP address and the timestamp of every failed login attempt. It has over lacks of active installs.

Features:

  • Login LockDown keeps the record for the number of login attempts in a certain time span.
  • Login LockDown has 200,000+ active installs.
  • A user will be locked out for 1 hour after user specified number of failed logins attempts.
  • Login LockDown is an open source brute force protection plugin for WordPress.

 

3. Limit Login Attempts Reloaded

WordPress Brute Force Protection Plugin

Limit Login Attempts Reloaded simply restrain the login attempts via normal login and via authentic cookies. To stop brute force attack Limit Login Attempts Reloaded plugin uses the technique so that an unauthentic user can get the site’s access.

Feature:

  • This Limit Login Attempts Reloaded plugin gives you the opportunity to set a definite number of login attempts for a specific IP address. So that no one can hack your information.
  • It follows the GDPR guidelines.
  • Over 200,000 active installs.
  • You can easily Whitelist or Blacklist IPs and Usernames.
  • WooCommerce login page safety is also there.

 

4. WP Limit Login Attempts

wp-limit-login attempts WordPress Brute Force Protection Plugin

WP Limit Login Attempts is another powerful WordPress brute force protection plugin. to prevent brute force attack. This plugin has 40,000+ active installs and the 4.6 overall ratings.

Features:

  • WP Limit Login Attempts, detect bots by Captcha verification.
  • This is a really lightweight and it doesn’t put the load on the site.
  • It strictly follows the GDPR guidelines.
  • WP Limit Login Attempts is an open source.
  • Thousands of happy customers.

 

5. Brute Force Login Protection

brute force login attempts plugin

Brute Force Login Protection is a lightweight that helps to provide protection against brute force attacks. Like most others it uses the .htaccess file to help you secure your site from brute force attacks.

Features:

  • Brute Force Login Protection restrain the number of login attempts.
  • It gives you the opportunity to block or unblock the IP addresses.
  • Option to Whitelist and Blacklist users.
  • In case of failed login attempts, it can delays the next login attempt in order to throttle the attempting bots.
  • It has over 20,000 active users.

Let’s Take a Break
As you are running a WordPress website let me introduce you our industry leading WordPress website Builder called TemplateToaster. As per our users it is the easiest solution to create WordPress themes without coding. TemplateToaster is delivering results with trust since 2010. Try now! Let’s continue with the WordPress brute force protection plugins.

6. Limits Attempts by BestWebSoft

limit attempts by bestwebsoft

Limits Attempts by BestWebSoft is the amazing plugin which protects the site from brute force attacks and spam. It is compatible with the latest version of WordPress.

Features:

  • This plugin will automatically block the IP addresses that try to log in and exceeds the number of login attempts.
  • Manually marking IPs into WhiteList and Blacklist is allowed.
  • You can hide information from the blocked IPs such as login, register.
  • You can show any customized Captcha error message to a blocked user and an invalid attempt.
  • Multilingual support.

 

7. Limit Login Attempts – best Brute Force Protection Plugin for WordPress

limit login attempts

Limit Login Attempts is another popular brute force protection plugin for WordPress to guard your site against malicious activities. And the primary objective of this plugin is to provide shelter from brute force attacks.

Features:

  • Limit Login Attempts keep track of login attempts and if a bot failed to login in specified time with specified login attempts, then it blocks the IP.
  • It uses Google reCAPTCHA to give spam security.
  • You will see remaining login attempts on the Login page once you entered wrong login details. This is because if you’re a genuine user and have mistakenly entered your login credentials wrong, then you can correct them in your next attempt. And if it is a bot then surely it will be blocked in few tries.
  • It will do Inactive User Logout. That means if a user is not doing anything on the page for a specific time span then it will perform automatic logout.

 

8. WPS Limit Login

wps limit login

WPS Limit Login is a full-featured brute force login protection plugin for WordPress. By default, WordPress allows to have unlimited login attempts and this makes brute force attack somewhat easy. And there comes WPS Limit Login to rescue your site.

Features:

  • WPS Limit Login restrict the number of retry attempts when trying to log in from a particular IP. you can easily customize the number of attempts you want to allow.
  • It provides you multisite compatibility with some additional settings.
  • Security for the WooCommerce login page as well.
  • You can create a Whitelist and a Blacklist for your site.
  • It also confines the number of attempts to use cookies.

 

9.  BruteGuard – Brute Force Login Protection for WordPress

WordPress Brute Force Protection Plugin

BruteGuard – Brute Force Login Protection is a cloud-based brute force protection plugin for WordPress which provides security against botnet attacks.
Features:

  • BruteGuard – Brute Force Login Protection plugin for WordPress guard the site from the illegal access via bots.
  • Hundreds of active installs.
  • If it finds any malicious activity, then it immediately blocks the IP across the complete network.

 

So, Which Brute Force Protection Plugin for WordPress do you choose?

Now that you have got the list of Best WordPress Brute Force Protection Plugins, it is time you decide which one you will use for your site. But wait! As we all know that haste leads to waste, so I would suggest that you take some time to analyze the above-mentioned brute force plugins, and choose wisely as per your needs. Don’t rush! Make a smart choice and create your beautiful themes with TemplateToaster web design software, the best WordPress website builder ever built.

Attackers always look for weak passwords, and the vulnerable sites running outdated versions of WordPress/plugins, so it is highly recommended to keep your sites updated and have a WordPress Brute Force Protection plugin for WordPress. If you know any plugin that I missed to mention then please do share with me in the comments below.

Read More
January 23, 2019 0 Comments

66 Sources of Content Inspiration

The time has finally come. You’ve poured your blood, sweat, and tears into your most recent content piece, and it’s ready to be packaged up and sent to the client to be pushed live. After a few final checks and only…

Read More
November 16, 2018 0 Comments