info@tonsamith.com
  • Home
  • Blog
  • About
  • Contact
  • Home
  • Blog
  • About
  • Contact
  • Home
  • Blog
  • About
  • Contact

Category: WordPress Guide

WordPress Guide

How to Resolve Common WordPress Security Risks

No matter how you parse it, the most popular content management system (CMS) available today can be found at WordPress.org. It powers 30% of all websites, comprising 60% of the total CMS market. Many people consider WordPress a blogging platform, but its flexibility and level of function are why it is used for eCommerce, SMBs, and by Fortune 500 companies like Forbes and Sony Music.

What makes WordPress so popular?

On its face, WordPress allows anyone to create a beautiful, functional website and have it up and running within hours with little or no technical knowledge. It’s the built-in features, level of support, and open source availability that makes this possible. WordPress is also easy to customize, includes plenty of analytical tools, and makes SEO a snap.

But, the popularity of WP goes deeper than that:

  • It’s free. You’ll have to pay for hosting and your domain name, but everything else is on the house.
  • Open source themes and plugins. You can use them off the shelf or add your own custom coding.
  • It’s easy to manage. Everything can be updated with a click from a single dashboard.
  • Security is built-in. They use Sucuri to protect against malware and brute force attacks. You can also add your own security measures.
  • It’s compatible with a range of media types. The built-in media uploader supports audio, video, and images, and it makes integration with embed-enabled platforms like InstaGram and YouTube effortless.

Unfortunately, a few of the things that make WordPress a popular, flexible CMS are also the source of some common security issues.

What are these issues, and how can you resolve them with a minimum of stress and hassle?

Top 5 WP Security Problems and Their Solutions

The ability to optimize WordPress makes it user-friendly for novices while allowing professionals at all levels to customize every facet of their website. The first step to resolving security issues is knowing what they are; the rest is a matter of upkeep.

Brute Force Attacks

The problem: Called “brute force” due to the nature of approach, these are the most blatant attempts at penetrating WP websites. Such an attack involves repeatedly entering a variety of username and password combinations until the hackers hits the correct one. Even if all attempts are unsuccessful, this method of attack can overload the system. This can cause issues with your hosting service and lead to account suspensions. If they’re successful, the hacker can change your password and things get worse from there.

The solution: WordPress doesn’t put a limit on login attempts by default, but you can fix this situation yourself by choosing strong passwords and using two-factor authentication. There is also software available to prevent such attacks and WP plugins that allow you to limit login attempts.

SQL Injections

The problem: The WordPress web platform uses the MySQL database management system to operate. An SQL injection attack is conducted by inserting code into your website, often through the login mechanism. The hacker simply inserts a statement into the username and password fields that allows access to your website.

For example: User Name: “or” “=” Password: “or” “=” would result in a valid SQL statement like [SELECT * FROM Users WHERE Name =”” or “”=”” AND Pass =”” or “”=””] that would give them access to all usernames and passwords in the database. Such a hack can be performed as a single command line or in batches of two or more lines of code.

The solution: Coders can prevent SQL injections by setting parameters marked by an “@” symbol in the code. For example,

[txtUserId = getRequestString(“UserId”);

txtSQL = “SELECT * FROM Users WHERE UserId = @0”;

db.Execute(txtSQL,txtUserId);].

Non-techs should make sure that they choose a hosting service that includes a WP firewall and supports MySQL.

File Inclusion Exploits

The problem: This sort of attack searches for and exploits PHP code vulnerabilities, which is the source code that runs your website, plugins, and themes. Once a vulnerable bit of code is discovered, the hacker simply alters it to gain access to your databases.

The solution: Maintenance is the key to avoiding this problem.

  • Make sure to update your WP website frequently so that you have the latest in place.
  • Obtain plugins and themes from a reputable source
  • Remove old, unused, and obsolete plugins and themes

Malware Infiltration

The problem: Malware is a malicious code or program that infects your files. The source can usually be traced to a newly created or altered file, often inserted through a link attached to an email.

The solution: The best defense against malware is to install comprehensive anti-malware and update it frequently. For those that slip through your defenses, the solution is to identify and remove the problem code by:

  • Manually deleting it,
  • Installing a new version of WordPress, or
  • Restoring your WordPress website to an earlier version before it was infected.

Cross-Site Scripting (XSS)

The problem: This bit of trickery accounts for 84% of all internet security problems. It’s also the number one vulnerability among WP plugins. The attack is initiated on the user side, and site administrators may not even know their visitors are being redirected until they notice a loss of revenue or related issue with web traffic. It involves inserting alternate code into a vulnerable section in order to gain access to user data. The most common interface is web forms.

The solution: This can be avoided several ways. First, make sure to back up all data and run WP and plugin updates as soon as they’re available. Use only reputable plugins from a reliable source that has legitimate contact information and support, and delete any unused or outdated plugins.

Performance and Security: Choosing the Right Platform for Your WP Website

what is web hosting

You can minimize risk using the suggestions outlined above, but the wrong hosting platform can still lead to problems. It’s tempting to find the cheapest route, but you’ll find that you get what you pay for. Free may be okay for a personal blog, but the dangers of choosing free web hosting platforms for online businesses are many.

They include:

  • Limited bandwidth, storage, and features
  • Lax or outdated security
  • Limits on using your own domain name
  • Third-party affiliate links and banner ads
  • No guarantees on uptime
  • Slow page loads, high lag times

The best WordPress Hosting service is one that offers enhanced security, scalability, and privacy. At minimum, your hosting service should meet the following criteria:

  • Automated backup systems
  • 24/7/365 customer support
  • High levels of uptime and low incident history
  • Technical scalability
  • Exemplary reputation and longevity
  • Security
  • One-click WP installation
  • Website transfer feature

The Bottom Line

Security issues with WordPress are mainly a matter of diligent housekeeping. The benefits of using this CMS far outweigh any potential problems. An audience of more than 400 million people can’t be wrong.

Read More
March 6, 2019 0 Comments
WordPress Guide

How to Upgrade WordPress to PHP 7: Step by Step Guide

Have you upgraded to PHP 7 for WordPress? NO.. wait, are you unaware of requirements for PHP version 7, benefits or concerned about any related issues? Don’t know about WordPress PHP upgrade procedure? No more worries – you are at the right place to get all, you need!!

PHP is a server-side scripting language developed by Rasmus Lerdorf in 1994. He would have no idea that it would empower more than 83% of the websites. It is open-source and the soul of WordPress. Recently, there is a lot of buzz in the market around PHP 7. WordPress itself, recommends upgrading your site to PHP 7. Whereas, most of the users are running their WordPress sites based on PHP version 5.6. Then, what should they do? Should continue with PHP 5.6 or upgrade WordPress to PHP 7?

Before finding an answer to this,here at Templatetoaster website maker, let’s have a look at new features in PHP 7. It will help you to move forward with a firm decision.

PHP 7 Features, Upgrades and More!

The next major release after PHP 5.6 is PHP 7. PHP 6 is skipped as Unicode didn’t do so well. A lot of iterations has been made to PHP 5 since 2004. So, twelve years was a long time span to release a version with a number of performance improvements, safety, and no backward compatibility. The main features of PHP 7 are as follows

  • Improved Performance

PHP 7 is about twice as fast as PHP 5.6. Benchmark testing shows that a response time of 4ms with PHP7 whereas it’s 1.2 on PHP 5 for WordPress 4.4.2. It requires less time to serve the same number of requests. PHP 7 instruction set is optimized for executing the same task in fewer instructions. So, it significantly reduced the memory usage too.

  • Return and Scalar Type Declarations

Now, you can specify the type of variable instead of allowing PHP to set this automatically. So the type declarations ensure the expected results and make the code easier to read. PHP 7 now has added scalar types. Specifically: int, float, string, and bool. Defining these things, it is hoped to get correct and self-documenting PHP programs. PHP 7 also supports return type declarations as arguments. Now, the function will work as desired.

  • Improved Exception Hierarchy With Error Handling

PHP 7 introduces error-handling that is a major relief for coders. As scripts are used to stop by fatal errors. But now fatal errors are replaced with exceptions. You can now use Throwable blocks to catch both Exception and Error objects. However, it does not guarantee that site visitors will never encounter errors. But there are reduced chances of the user interruptions because of PHP script errors.

  • New Operators

PHP 7 also introduces some new operators as follows

    1. Spaceship Operator – Spaceship operator is a complement to the greater-than and less-than operators. It compares the values on the left with values on the right on less than, equal or greater than grounds. It has the main application in sorting function.
    2. Null Coalesce Operator – It is to check whether any variable exists or not. If yes, returns a default value otherwise return the left operand. This if-set-or operator uses a ?? as notation.
  • Easy User-land CSPRNG Functions

It refers to an application space protected by privilege separation that is external to the kernel. CSPRNG is a secure way of generating random data. It stands for Cryptographically Secure PseudoRandom Number Generator. Random numbers are used to protect the system from hackers. In PHP 7, a system interface is put up for the random number generator. But if it gets hacked, the whole system will be compromised and results in bigger issues.

  • Anonymous Classes

PHP 7 introduces instantiate anonymous classes like in C# and Java programming. It is a class without a name. The object it instantiates has the same functionality that objects named classes to do. These are great to speed up both coding and execution as no documentation needed. You can refer to our Guide to PHP 7 article if you want to know more about new Features, Compatibility and Performance.

Why Upgrade WordPress from PHP 5.6 to 7?

Now, you have an idea about new things introduced in PHP 7. Let’s find out the reasons for WordPress upgrade PHP7.

  • An update is necessary for security reasons. The version you are using can have security holes.
  • PHP 7 has higher load capacity. It will cater more customers using the same hardware.
  • PHP 7 is good for business as providing great performance, resilience and optimal utilization. It enjoys a slight edge when it comes to WordPress.
  • The minimum requirements for WordPress have been raised. So, you will encounter compatibility issues with plugins and scripts.
  • Last but not the least, one should adopt a stable version. All its new features advocate upgrading.

 

Issues with the Upgrade

Wherever one thinks to switch to a new version, first thing comes into consideration is compatibility. PHP 7 is not backward compatible. So it might be possible that some of your plugins, themes or scripts will not work properly. Even, it may fully or partially break your site. As every new version comes with many improvements, security patches & new structure of the code.

It may also possible that your plugin or theme code is completely old version dependent. Then, an upgrade will prove this code to be obsolete. So, it’s better to review and modify this code to work well with the new version.

 

Compatibility Check for WordPress and PHP 7

Mainly, the issues arise due to incompatibility whenever you upgrade WordPress to PHP7. If you go for checking compatibility manually, it can be tiresome. So, here is a useful plugin that will help you to test it easily.

  • PHP Compatibility Checker

wordpress php 7

This plugin will ask you PHP version to check theme & plugin code. It will generate a report of compatibility issues that need to fix. It will also suggest the new version of plugins if available that will support PHP 7.

However, this plugin itself says “100% reliable detection is not possible. It is best to run comprehensive tests before you migrate to a new PHP version”.

So, it’s good to check your site manually for any issues.

Check your Site Manually before Upgrading WordPress to PHP 7

Before upgrading, it will be good to check your site. For that, you will create a local copy of your site. You will follow the below steps to check your WordPress site before upgrading

1. Backup Live Site

Before making any changes to your live site, you will take its backup. There are many plugins to create a backup of your site. Out of which, some of the popular plugins are as follows

  • UpdraftPlus WordPress Backup Plugin

This plugin simplifies the backup and restoring process of a site. It is one of the highest ranking the scheduled backup plugins. It backups your files and database to the cloud. You can restore again anytime.

  • BackUpWordPress

It is an easy to use the scheduled backup plugin. You can take backup of your site including the database.

  • All in One WP Migration

This plugin exports a site with the database and all the media files in a single file. You can upload your site anytime using this backup file.

For more plugins to backup your WordPress site, you can read our post on Free Backup WordPress Plugins.

2. Download XAMPP

Next step is to set a local copy of your website using XAMPP. Download the PHP 7 compatible version of XAMPP. To get the details, you can read the article on “how to install XAMPP and WordPress locally”.

3. Restore Your Site

Once you successfully installed WordPress, restore the backup of your site using any of the plugin mentioned above.

4. Test Local Copy of Your Site

Now, look your site thoroughly for errors. The errors and warnings generated will depend on your set up. You just

  1. Check every page on your website. Look for any elements that have suddenly stopped working.
  2. Check each plugin one by one.
  3. Test that all the features of your active theme are functioning well or not.
  4. You can also go to the wp-config.php file and set the variable WP_DEBUG as true. It will display all the errors and warnings.

define(‘WP_DEBUG’, true);

5. Fixing the Common Problems

The common problems that you can encounter while upgrading are as follows

  1. Firstly, just see the PHP constructs and non-standard PHP code declaration tags. Locate them and replace with modified PHP 7 versions.
  2. PHP7 introduces error handling. Most probably, PHP 5 exception handling methods won’t work. For example,
try {//code}

catch( exception $e)

{//code to handle this exception}

So you can specify the type of error that you expect to encounter in PHP 7 & replace that as follows

try {//code}

catch( throwable $t)

{//code to handle this error}

This means PHP 7 allows you to deal with different type of errors differently. You can also seek help from application developer or by asking questions at developer’s forum.

How to Upgrade your Site to PHP 7 for WordPress?

Once you complete the testing phase, you will follow these steps to upgrade to PHP7 for WordPress

  • Make Changes to the Live Site

Once you complete the testing and filtering the local site, you will replace same errors in your live site. It means you will make improvements in the live site to remove the same errors you encountered locally.

  • Upgrade Your Live Site to PHP7

Does your host provider include any option of PHP version change? If not, you can ask the host company to provide a version upgrade option in the cPanel

Then, log into cPanel and navigate to “Software/Services” option. Now, click the Select PHP versionoption.

wordpress php 7

Now a screen somewhat like this will display. You can Select your PHP version and PHP modules here.

wordpress php 7

… and You are done!

Final Thoughts

PHP 7 will give a performance boost to your site in terms of speed, security, low memory usage & much more. It is smart to upgrade your site to PHP 7 for WordPress. Soon, it may be the minimum requirement for WordPress. But in case you have compatibility issues, you can wait until the authors of plugins, themes provide the updated versions. But undoubtedly, PHP 7 is improving with every release and promises to benefit you a lot.

Upgrading major PHP version at the backend calls for a fresh design at the front as well. If you are already thinking to redesign your website, start with our WordPress Theme Builder and get your website design done in no time.

Read More
January 25, 2019 0 Comments
WordPress Guide

How to fix WordPress page updates not working

What..!! Do you make changes to your WordPress site but results are not visible? Have you customized the look of your site but getting no effects? Having a tough luck with your site as WordPress page updates not working? Don’t panic if your WordPress is not responding as expected. Here is the solution to your problems – learn how to fix WordPress page updates not working.

Adding changes to your WordPress site is a good practice to keep it worth reading. But what to do, if the changes you did in content or design are not committed. Actually, WordPress pages are not getting updated with the changes you did. It is really unfortunate. I got many queries that users made many changes to WordPress theme, page, post or widget. But, changes or the edits are not happening at all after saving or publishing. How will you fix it? Let’s discuss it in detail “how to fix WordPress page updates not working”.

Common Symptoms of WordPress page updates not working

It’s a very common problem with designers and developers or even basic users that the changes or edits they commit to the WordPress site, are not visible immediately. Some common situations are enlisted below that are encountered by most of the users:

  • WordPress Homepage not updating: The most common problem is when you publish a new blog post, you can view it from WordPress admin area. But, you can’t see it from the frontend on the main page.
  • WordPress Content / CSS changes not updating: You try to customize your website by adding some CSS and changing the layout. But, your site doesn’t reflect any changes after saving it.
  • WordPress Plugins not updating: You make some changes to plugins, widgets or sidebars, but updates are not visible.

How to fix WordPress page updates not working

There are some common factors responsible for not updating your WordPress website. These are not hard to handle for WordPress. Let’s see the reasons and solutions

 

1. Poorly Configured Cache plugin

One of the main causes of the issue is poorly configured WordPress cache plugin. Most of the users have caching plugins like Autoptimize, W3 Total Cache, WP super cache etc. Basically, these plugins clear the cache when some changes are made to your site. However, if the plugin is configured poorly, the cache may not be cleared and the old version of your site still appears.

Solution

You will try to empty all caches. This can be easily done by plugin settings. Suppose, you have a W3 Total Cache plugin. Go to its Settings page and click empty cache option. Now, all the changes will be visible on the main page.

clear cache using W3 Total Cache Plugin wordpress page updates not working

You can also control that what should be cached by the plugin. W3 Total Cache provides this with page cache functionality. Move to the menu under Page Cache. There is an option that allows not to cache the front page. As by default, the front page is cached, checking this option will not cache the front page.

W3 Total Cache Plugin Settimgs wordpress page updates not working

If none of these solutions work for you, you can try disabling the cache plugin. For that just deactivate the plugin. Navigate to Installed Plugins list from left pane of WordPress dashboard and Deactivate the cache plugins.

 

2. CDN not enabled

CDN is a network that accelerates the content around the world via distributed edge servers. Whenever a user comes to your site, gets redirected to host server. A host server is located at a central position. But if traffic is high, all the users still try to access the same single host server. It delays the content delivery. Here, CDN helps through its wide network. It caches the static content and stores it at all of its servers. Now, your user will be redirected to the nearest CDN server location.

Sometimes, you made changes but the CDN content is not refreshed. So, you will not able to see the expected results.

Solution

You mainly enable the CDN with a cache plugin. you can try to disable or bypass CDN temporarily. To disable, go to General settings of the W3 Total Cache plugin and uncheck the CDN Enable option. CDN off will make work your WordPress site as expected. Now, all the changes will be visible.

CDN settings with W3 Total Cache Plugin wordpress page updates not working

 

3. Old Browser Cache

Sometimes, browsers will display a cached version of your website instead of the new one. Generally, when you visit a webpage for the first time, your browser takes a while to load the content. But next time, the content is showed up at once. This is because the browser stores the information that doesn’t change, on your computer. This is called browser cache that speeds up the page loading.

However, the problem arises when you make a change on your website. Most of the browsers do not update the cached data, so it reloads the old content. It seems to you that WordPress not updating.

Solution

To resolve this issue,

  • simply Press CTRL + F5 or Cmd+R in Mac for Google Chrome. You can also empty the cache by moving to the settings. Settings → History → Empty the Cache. It will reload the page and show you the newly updated pages. Similarly,
  • Firefox – Click CTRL+SHIFT+R or navigate to Options → Privacy & security → Cached Web Content — Clear now
  • Internet Explorer – Hold the SHIFT button and click the REFRESH button. You can also do it from Gear wheel. Safety →Delete browsing History → Temporary Internet files and Website files. Then, click Delete.
  • Safari – Go to the browser menu, and click Safari → Reset → Empty Cache or click CTRL+ALT+E.
  • Opera – Go to Settings → Preferences → Advanced → History.

Select the Disk Cache section and empty the cache by clicking Empty Now. You can also use CTRL+SHIFT+DELETE to open this menu and delete private data.

 

4. Old Server Cache

Some shared hosting providers also have the cache on their server. They use web page caching tools. Because of these tools cached version of your site expires after a specific time. And, the newly updated site will be visible after that only.

Solution

You can set web page caching off via your web host’s configuration panel. If not, you can contact your web host for disabling the web page caching.

 

5. Modifications at the Incorrect Place

Sometimes, very silly mistakes cause the big problems. You may make changes to the different file and view the different file. For example- you fixed the stylel.css file and viewing the styleI.css file.

The first filename is followed by lowercase “L” and the file chosen to locate changes has filename followed by uppercase “i”.

Solution

Pay attention to the source file and specific file chosen to view the changes. Try to give distinct easily distinguishable names to different files and folders of your website.

Secondly, match your URL settings in your options panel to the database.

 

6. Working on the Wrong Theme

You face this problem when you are working on one theme but by mistake checking the page that is generated from some other theme.

Solution

Match the pages you made the changes and the page you are viewing. Sometimes, you overwrite the file but it didn’t get overwritten completely. So, delete the original file from the host server and upload the new one.

 

7. Not Saving the Changes

Even, the designers, developers, programmers can commit small mistakes. They forgot to save changes by clicking save or update buttons.

Solution

Just go back and save the modifications. Now, review your webpage.

 

8. Coding Mistakes

A small coding mistake like skipping a semicolon (;) will let you pay heavily. It will not update your page.

Solution

Review your updated code. Figure out the misspelled tags and skipped semi-colons etc. if any. Also, recheck your templates and uploads as well as debug the CSS, HTML, and PHP of your site.

 

9. DNS Resolution Delay

If you have recently moved your site to a new server, it’s possible that DNS is not propagated completely yet. Your browsers might be getting the page from the old server. So, it will show the old content.

Solution

It’s better if you can avoid any new changes until your DNS gets propagated completely. Usually, you have to wait only for 24 hours. But if you still want to modify, you can do it by logging into hosting panel.

Which method you use to fix WordPress page updates not working ?

WordPress page updates not working is a common issue encountered by users. Though the main cause after this issue is only the cache. If you clear all the caches, the probability of errors or changes not visible, will greatly reduce. The secondary cause arises due to human behavior like coding errors, file naming etc. So keep checking for those errors or mistakes and avoid dwelling on such issues. Are you facing some common issues with designing your website as well? Give TemplateToaster WordPress Theme Builder software a try. It empowers you to create stunning websites in no time.

Hopefully, this article will help you out. If you have any queries, kindly post in the comment section below.

Read More
January 24, 2019 0 Comments
WordPress Guide

How to Create Custom Header in WordPress?

Does your website look appealing enough to the visitors? Or it’s just a normal website among millions of others! Do you wish your website to stand out from the crowd?  Do you want every page of your site looks distinct with a different feel? What if I say that the key to the solution for all these problems is in your own hands? And that key is – Custom Header!! Yes, you read it right. Let’s see how…

A header is the most important visual element of your site that occupies the topmost position. It is the first thing a visitor sees whenever lands on your website. The header of your site is your website’s identity that remains same throughout all the website pages. You can use it to ink a good long-lasting impact in visitor’s mind. You can stand out and win the user’s trust by creating remarkable self-portraying custom headers. A custom header in WordPress is a feature that allows you to customize the header image along with adding text, widget etc. to it. You can also adjust these elements as per your need to feature the best image of your website.

WordPress Custom Header: Why do you actually need one?

The header is one of the most important elements of your website. It is a gesture that conveys a lot about your site. Usually, it holds a picture or video to grab the visitor’s attention. According to Nielsen Norman group, a visitor only remains for 10-20 seconds on your website. So, the header should be appealing to interest them.

A custom header in WordPress gives you more control and flexibility. You can rotate, resize or crop a header image in addition to the repositioning of the logo, text or widgets. You can design it to contrast your website look. You have to use it as a proposition to the target audience. Try to quote your tagline in the custom header in WordPress. As you may not have second chance to make the first good impression. A well-structured header should answer why you are unique, what’s all that your site features etc.

So, a custom header is important as it works as a face of your website. It should be able to communicate the crux and mood of your site to the audience. You can have a different WordPress custom header per page. For example, you can add features of your product in the header for About Us page and rest of the pages without features. It can work wonders !!

How to Add a Custom Header to WordPress?

The default WordPress themes allow you to use custom headers. You can put your own custom header images as per your preferences. Setting a WordPress custom header image takes a few efforts. It basically involves two steps to add a custom header to the default WordPress themes as follows

1. Source and Edit your image

First of all, select an enticing image. It should be simple and unique. You can get lots of free images on the Internet. For more details, you can read about 16 websites to get free images. Once you source your header image, you are just left with editing it.

You can use some of the useful desktop editing or web-based free editing tools. You can rejuvenate the chosen image with GIMP, paint.net etc. GIMP is a free and open source image editing software. It provides you many sophisticated tools to give a special touch to your image. Whereas paint.netfacilitates editing tools for images on Windows. Get your custom header WordPress image done.

2. Upload the Custom Header

To upload the header image, log into your WordPress dashboard. From the left pane, navigate to Appearance → Header.

It will open a Header Media pane on the left of the screen. Go to Header Image and click Add New Image button.

It will open the image gallery to choose the image. You can also browse your custom image here. Select the image, crop it if required. Set it as the custom header image. You are done.

 

How to Customise Header in WordPress?

Once you upload the WordPress theme custom header image, you can edit it for applying video, text, widgets, social icons etc. You can use any default WordPress theme. Here, you will get example code to edit custom header in Twenty Seventeen theme.

1. Add a Text Area to the Header

With default theme, you can only change the website title. But to add text area, you have to write some code in header-image.php file. You will add the following code to get a text area in the header

<div class="custom-header">

<div class="custom-header-media">
<?php the_custom_header_markup(); ?>
</div>
<div class="custom_textbox">
<div class="custom_textbox_content"><p>This is my dummy content</p></div>
</div>

After adding this code, you will see a separate text area in the header as shown below

text area setings of header in WordPress custom header wordpress

2. Add Social Icons

To add social icons to the header, you will add following code to site-branding.php after wrap class.

<div class="social_links">
<ul>
<li>
<a href="" class="custom_facebook_icon">
<img alt="customfacebook" src="http://localhost/wordpress/wp-content/uploads/2018/01/facebook.png" />
</a>
</li>
<li>
<a href="" class="custom_twitter_icon">
<img alt="customtwitter" src="http://localhost/wordpress/wp-content/uploads/2018/01/twitter.png" />
</a>
</li>
<li>
<a href="" class="custom_googleplus_icon">
<img alt="customgoogleplus" src="http://localhost/wordpress/wp-content/uploads/2018/01/google-plus.png" />
</a>
</li>
</ul>
</div>

You also have to give CSS if you want to style social icons in your own unique style.

#masthead .wrap {
position: relative;
display: inline-block;
vertical-align: middle;
}
.social_links {
float: right;
padding-right: 60px;
}
.social_links li {
display: inline-block;
margin-right: 15px;
}

It will give you the required results as shown

social icons settings in header in WordPress custom header wordpress

3. Add a Widget to the Header

If you want some widgets to feature your website, you will define a function in function.php file. You can add this code at the end of the file.

function custom_widgets()
{
register_sidebar( array(
'name' => 'Custom Header Position',
'id' => 'custom_header_position',
'description' => __( 'An optional widget area for your site header', 'testtt' ),
'before_widget' => '<aside id="CustomWidget" class="custom_widget">',
'after_widget' => "</aside>",
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
}

add_action( 'widgets_init', 'custom_widgets' );

Once you did it, you will add this HTML code to header-image.php file to show the specific widget on the frontend.

<?php

if ( is_active_sidebar( 'custom_header_position' ) ) : ?>
<div id="header-widget-area" class="custom-widget-area widget-area" role="complementary">
<?php dynamic_sidebar( 'custom_header_position' ); ?>
</div>
<?php endif; ?>

Now, you will move to Appearance → Widgets. From here, you can add any widget to your Custom Header Position. For example, the Search widget is added by simply dragging it to Custom Header position.

widget header settings custom header wordpress

The resultant header will look somewhat like this

resultant custom header wordpress

4. Reposition the Logo

You can add a logo to default WordPress options. Navigate to Appearance → Header → Header Media → Logo Section. Here, set a logo by clicking Select Logo option.

logo settings custom header wordpress

But to reposition it, you need to write additional CSS. In Twenty Seventeen theme, you will get a logo in bottom-left position by default as shown below

reposition settings custom header wordpress

Here, you will see an example CSS to add the logo to the center position. Likewise, you can set it anywhere in the header.

.custom-logo-link {
padding-right: 2em;
position: absolute;
left: 500px;
top: 0px;
}

setting logo in center position custom header wordpress

5. Add Video to the Header

Finally, you can also add a video to your WordPress Header. Thankfully, there is no need to add code for this. WordPress provides you a default option to add video or background image.

For adding video to the header, navigate to Appearance → Header → Header Media → Header Video. Here, you will click Select Video button as shown below. Then, you can browse the video you want on the header from your computer. Alternatively, you can also give URL of the video if it’s online. Just publish it.

header video settings custom header wordpress

Your Header Video will look like this

final custom header WordPress video

Similarly, you can add a Background header image by selecting any Header Image from Header Media section.

You can have different WordPress custom header per page, say some with a background image, some with video or Widgets etc. It all depends on your choice and creativity.

 

How to Create a Custom Header in WordPress from Scratch with TemplateToaster?

You should have good knowledge of PHP, HTML, CSS to work with template files. If you are a beginner and don’t know how to write code, you can rely on TemplateToaster WordPress Theme Builder. You need no coding to create WordPress custom header template. Just a few clicks to drag & drop interface and you are ready with your custom header. Let’s see how to add custom header to WordPress with TemplateToaster

First of all, download and install TemplateToaster website builder. After successfully installing it, you will get the CMS selection screen as shown below. Select the WordPress here

CMS selection in TemplateToaster custom header wordpress

Then, you will get next screen to create a template from scratch or use a sample template. You will select Start from Scratch and click Modify.

sample template selection in TemplateToaster custom header wordpress

Then, you will be redirected to the main interface of the software from where you can start designing your custom header.

main interface of TemplateToaster custom header wordpress

1. Full-Width Custom Header 

You will get the main interface screen of the software as shown below. From here, you can set a full-width header. Go to Header → Width → Full Width.

width settings of header in TemplateToaster custom header wordpress

2. Reposition the Logo

From Header tab, click Logo option. It will open a logo icon gallery. You can select a logo image from sample library or you can browse your own custom image. It will set the logo.

selection of logo in TemplateToaster custom header wordpress

When you double-click on logo image, it will open a Format tab as shown below. From here, you can give a link to logo image or set its position. You can reposition by giving custom left and top positions or select a position shortcut. For example, here a vertical-center position is selected for the logo.

more logo settings in TemplateToaster custom header wordpress

3. Adding Background Image

You will select Background option from Header tab to set a header background image. It will open an image gallery. You can also browse your own custom header image from More Images option.

background image settings in TemplateToaster custom header wordpress

Similarly, you can add a Foreground header image by clicking Image option from Header tab.

4. Add Text Area to the Header

If you want to display the tagline and relevant information on the header, you can use a text area. In the text area, you can add plain text, button, list etc. Click Text Areas option.

Header text area settings in TemplateToaster custom header wordpress

Add content and style it by double-clicking. As a double-click will open an Editor tab to edit content.

Text area settings 2 in TemplateToaster custom header wordpress

5. Add Widget to the Header

You can add a widget area to the header in a single click. Go to Widget Areas tab and click Widget Areas → Header option. You can also set typography for this widget and can reposition it anywhere in the header just by dragging. You can add content to it after export.

widget settings of header in TemplateToaster custom header wordpress

6. Add Social Icons to the Header

Adding social media icons to the header is really simple. From Header tab, click Social Icons option. It will open a social icon gallery to select an image as per your need. You can also browse your custom icon here.

social icons settings of header in TemplateToaster custom header wordpress

All the social media icons are available here. You can keep icons according to your requirement. You put social media icons on Facebook, Twitter, and Google + here.

7. Adding Video to the Header

To add a video, click Add Video option. From here, you can easily upload a header background video.

Video Header settings in TemplateToaster custom header wordpress

Final Words

By now, you have learned about how to create a Custom header in WordPress. It will definitely change the outlook of your website. The solution you opt is entirely your choice. Hopefully, you liked the post. If you have queries, you can post in the comment section below.

Read More
January 24, 2019 0 Comments
WordPress Guide

How to Create a WordPress Custom Login Page?

Do you want to add more brand value to your site? Do you want to keep the look of login page fresh for the users who regularly log into your site? If yes, simply create a WordPress custom login page.

If you are running a membership site or blog, you may need a login page. A login page makes users to signup and login using their credentials. It allows them to visit, share and contribute to your site by via posts, images, videos, or comments. But, WordPress provides a default generic login page. It doesn’t give any built-in options to add your own logo and change the feel of a page to match your theme. It is far behind to result in an ideal login page. So, a WordPress custom login page will play an important role here. A custom login page is crucial to add your own branding to the site. You can add more fields to get more information from the users. Moreover, it facilitates you to limit the admin panel access by specifying user roles. In short, a WordPress custom login page offers many benefits with a pleasing user experience.

Different Methods to Create a WordPress Custom Login Page

It is always better to create a custom login page rather than a boring WordPress login page. At the most, you can add your own logo and white label to the admin panel. But what about the admin panel access? So, if you don’t want the access of admin panel to every logged in user, you need a custom login page. But, how to create a custom login page for WordPress? There are two basic methods to create your own custom login page as follows

  • Create WordPress login page Manually
  • Create WordPress login page With TemplateToaster Website builder software

 

1. Create a Custom Login Page WordPress without Plugin

You can make a WordPress custom login page by using code. It needs basic skills in HTML, PHP, CSS etc. You will make changes to function.php file of your theme. However, remember that you will lose these changes if you update WordPress.

The Basic Modifications to Customize a Login Page

There are some basic things that you want to change your custom login page. For that, the main modifications you can do are as follows

  • Add a custom background.
  • Add a custom logo.
  • Customize the look of the login form.
  • Change the login logo URL.
  • Remove the lost password link.
  • Remove the “Back to” link.
  • Hide the login error message.
  • Remove the login page shake.
  • Change the redirect URL.
  • Set “Remember Me” to checked.

How Will You Proceed?

WordPress doesn’t load your theme stylesheet as the login page isn’t part of the WordPress theme setup. So, you have to make your own stylesheet for the custom login page. Before that, you will create a new folder in your theme folder called Login. In this, make a new .txt file and save it as custom-login-style.css.

Once you have a CSS for the login page, you have to tell the WordPress to load it explicitly. For that, you will put this code in function.php

function my_custom_login()
{
echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/login/custom-login-style.css" />';
}
add_action('login_head', 'my_custom_login');

The resultant WordPress custom login page will look somewhat like this

resultant WordPress custom login page

Now, let’s see the particular CSS code to make specific modifications

  • Adding a Custom Background

You can add any background image to your login page. Just specify it’s correct name in the 2nd line of your custom page CSS. The code to set the background is as follows

Body.login
{
background-image:url("../image/login-page-bg.jpg");
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
  • Adding a Custom Logo

This is the most crucial step to mark a brand identity. You can add your own custom logo in place of WordPress logo. Save the custom logo image to the Login/image folder. You will do that as follows

#login h1 a {
background-image: url("../image/logo-1.png");
background-size: 75px;
}
  • Customizing the Login Form

Now, you will modify the Login form look to match your site appearance. You can set the padding, margin of the form. You will also like to change the background color, label etc. for this, you can refer the following sample code

.login form{
box-shadow:none;
padding:20px;
}
#login {
background: #FFF;
margin: 50px auto;
padding: 40px 20px;
width: 400px;
}
.login label {
color: #555;
font-size: 14px;
}
.login form .forgetmenot{
float:none;
}

Further to modify submit button look, you can set margin, border, height, width, the color of it. So, include these lines to your CSS

#login form p.submit{
margin-top:15px;
}
.login.wp-core-ui .button-primary {
background: #7B417A;
border-color:#7B417A;
box-shadow: 0 1px 0 #7B417A;
color: #FFF;
text-shadow: none;
float: none;
clear: both;
display: block;
width: 100%;
padding: 7px;
height: auto;
font-size: 15px;
}
  • Change the Login Logo URL

The Logo URL links to WordPress.org by default. You can redirect it to some other URL as follows

function custom_login_logo_url() {
return get_bloginfo( 'url' );
}
add_filter( 'login_headerurl', 'custom_login_logo_url' );

function custom_login_logo_url_title() {
return 'Default Site Title';
}
add_filter( 'login_headertitle', 'custom_login_logo_url_title' );
  • Remove the Lost Password Link

Lost password link is useful when you forget your password. But it can be misused so you can remove it. You will simply add this code

p#nav
{
display: none;
}
  • Remove the “Back to” link

The “Back to…” link lets users return to the homepage. But if you want a simple clean look, you can remove it. For this, you will add this

p#backtoblog
{
display: none;
}
  • Hide the Login Error Message

Sometimes users enter the wrong information by mistake, it will result in generating Login error messages. The reason could be any, either the username is incorrect or password is wrong. This message is useful for users but creates a gap as hackers can crack the user login credentials. They can then gain access to your site. So, it’s better to change the error message in function.php file as follows

function custom_login_error_message()
{
return 'Please enter valid login credentials.';
}
add_filter('login_errors', 'custom_login_error_message');
  • Remove the Login Page Shake

The login form shakes when the user submits the wrong login credentials. But if you don’t like this feature, you can remove this.

function custom_login_head() {
remove_action('login_head', 'wp_shake_js', 12);
}
add_action('login_head', 'custom_login_head');
  • Change the Redirect URL

If you log into WordPress, it redirects you to dashboard directly. You can redirect all to the homepage except administrator as follows

function custom_login_redirect( $redirect_to, $request, $user )
{
global $user;
if( isset( $user->roles ) && is_array( $user->roles ) ) {
if( in_array( "administrator", $user->roles ) ) {
return $redirect_to;
} else {
return home_url();
}
}
else
{
return $redirect_to;
}
}
add_filter("login_redirect", "custom_login_redirect", 10, 3);
  • Set “Remember Me” to Checked

Remember Me box is unchecked by default. You can change it to checked state as follows:

add_filter( 'login_footer', 'default_rememberme_checked' );
}
add_action( 'init', 'default_checked_remember_me' );
function default_rememberme_checked() {
echo "<script>document.getElementById('rememberme').checked = true;</script>";
}

This was all about customizing a login page with code. You can try out all the modifications to simple CSS code.

 

2. Create a Custom Login Page WordPress using TemplateToaster Plugins

If you don’t have much coding skills, you can opt more convenient way to create a custom login page than coding i.e using plugins. There are a number of plugins available in WordPress repository to customize a login page. Though the popular plugins are as follows

Creating a WordPress Custom Page Login using Login Customizer Plugin

Login customizer is one of the most suitable WordPress custom login page plugins. Once you install and activate it, you can see it in under Appearance section of the left pane in the WordPress Dashboard. As you click on it, you can Start Customizing your login page as shown below

Appearance → Login Customizer → Start Customizing

create WordPress Custom Page Login using Login Customizer Plugin

It will redirect you to the Customizer screen. Where you will find the Login Customizer option. As you click on it, it will show you the default login page as shown below

Customizer screen of Login Customizer Plugin wordpress custom login page

From here, you will start redesigning it. The first option is to add a new Logo.

logo settings in wordpress custom login page

Here, you will select a logo image by browsing it.

logo image selection wordpress custom login page

Then set the Logo Width, Logo Height, and Padding Bottom. Click Change Image to set your custom logo instead of WordPress logo.

width, height, padding bottom settings of logo wordpress custom login page

Select Background option to add a background image to the login page. It will give a nice touch to the login page.

background image settings of logo wordpress custom login page

Click Select Image button as shown below to browse the required background image.

selection of background image wordpress custom login page

Once the image gets uploaded, click on Change Image to apply it.

applying selected image wordpress custom login page

Form Background option is there to change the color of form area. As here a little dark form background is set instead of white.

color settings of form areawordpress custom login page

You can also set a background color as shown below

form background color settings wordpress custom login page

You can change the form height, width, padding and border from Form Styling option.

form styling settings wordpress custom login page

Set the different attributes as shown below. And, you can see the visible effects as the form gets widened.

more form settings wordpress custom login page

Do the Field Styling by specifying the Input field width, Margin, Background, Label color as shown below

field styling settings of form wordpress custom login page

You can change the different attributes of a button like a Background, Border, Color from Button Stylingoption.

button styling settings of form wordpress custom login page

You can also set other things like Text color or attach a custom CSS from Other option.

other form settings wordpress custom login page

Then, publish this page to get your own custom login page.

Popular Plugins to Create a WordPress Custom Page Login

Some of the other useful WordPress custom login page plugins are as follows

 

1. Theme My Login

Theme My Login is a top-rated custom login page plugin. However, you can also create custom registration and profile pages, custom emails, etc. along with the login page. You will just configure the TML login settings by clicking the TML menu. The relevant features will be enabled and visible under TML option in the Menu. It also avails the custom login widgets. You can add a TML widget to the sidebar by visiting Appearance → Widgets.

Theme My Login plugin settings wordpress custom login page

  • Active installs: 100,000+
  • Rating: 4.3

 

2. Admin Custom Login

Admin Custom Login is a powerful custom login page plugin. It provides you a lot of features to edit background color and image, login form color, font size and position and much more. You can also add a background slideshow and social media icons on the form. All the designs prepared with it are mobile-friendly. It provides you a wide range of Google fonts and color schemes. It’s really simple to work in its setting panel.

settings panel of admin custom login plugin wordpress custom login page

  • Active installs: 50,000+
  • Rating: 4.8

 

3. LoginPress

LoginPress is another good custom login page plugin. It gives you lots of features to change the layout of the login page including logo image, width, height, padding, URL, and title, background image or color, login form image or color, width, height, padding, and border etc.

loginpress plugin settings wordpress custom login page

It provides the great feature to modify login error messages, forgot error messages, registration error messages, forget password hint message. You can do all modifications by opening up the Customizer that appears under LoginPress → Settings in the left main menu of the dashboard.

customizer settings of loginpress wordpress custom login page

  • Active installs: 10,000+
  • Rating: 4.9

 

4. Custom Login Page Plugin

Custom Login Page By SeedProd enables you to customize a default WordPress login page in minutes. It provides you a Real Time Customizer Editor to change logo, background, button, form, text etc. you can also add your custom CSS to a login page.

Customizer editor of WordPress Custom Login Page Plugin

  • Active installs: 3,000+
  • Rating: 5

 

5. Custom Login Page Templates

You can also use WordPress Custom Login Page Templates plugin to create a custom login page. You can upload your own logo and a full-width background image. It also has a feature to attach your own custom CSS.

custom login page settings wordpress custom login page

It provides you 5 different custom login page templates as shown below

different custom login page templates wordpress custom login page

  • Active installs: 2,000+
  • Rating: 4

 

6. Custom Admin Login Page WPZest

Custom Admin Login Page WPZest plugin enables you to create a custom admin login page. It has all the basic features to edit logo, background, form input fields, text and button etc. in addition to this, you can also add the Google reCaptcha in form. On the top of it, you can hide the Forgot Password Link or Back to Blog Link too. It enables you to create your own unique WordPress custom login page.

Custom Admin Login Page WPZest plugin settings wordpress custom login page

  • Active installs: 500+
  • Rating: 5

Wrapping Up

A custom login page plays a great role in social media engagement and email marketing. It should look like a part of the site layout. Putting efforts to customize a WordPress login page of your site is proportional to building your brand. It will give a personalized online experience to the users.

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

Read More
January 24, 2019 0 Comments
WordPress Guide

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).

  • Advanced Custom Fields Plugin

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 Plugin

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
  • Scripts n Styles Plugin

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
WordPress Guide

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 Guide

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?
    • Using cPanel
    • Using FTP client
    • Using Plugin
  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.

How to Create a .htaccess File in WordPress?

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:

  • Log in to your FTP hosting account.
  • Navigate to the root of your installation to enable Show Hidden I=”ftp” class=”alignnone size-full wp-image-8077″ src=”https://blog.templatetoaster.com/wp–content/uploatems to locate the .htaccess file.

           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
WordPress Guide

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
Categories
  • SEO Guide 3
  • Social Media Tips 3
  • Web Development 27
  • WordPress Guide 9
  • WordPress Plugin 6
  • WordPress Theme 3
Scan Us Now

TSM is the WordPress outsource expert focusing on the guide and instruction with creative development strategies. Web development blogs are full of greatest fruit for professional developers.
Services
Web Design
Online Course
E-Books
Free Themes
Technical SEO Audit
Content Marketing
Contacts
Address: 05, Battambang City, Cambodia, 02201
Website: www.tonsamith.com
Email: info@tonsamith.com
Phone: +855 93 328 273
Fax: +855 93328 273
Newsletter
Terms of use | Privacy  Policy

Copyright © 2019 TSM Blog. All Rights Reserved.