VBlog

Tag: WordPress

All you ever wanted to know about WordPress hosting cleverly summed up in a superb infography. Courtesy of CodeinWP.com.

Continue reading

Responsive Videos in WordPress Posts

Here’s a small jQuery code snippet that I found on Anders Noréen‘s themes that makes sure embeded videos have the correct size ratio on any screen.

(function() {
    // resize videos after container
	var vidSelector = "iframe, object, video";
	var resizeVideo = function(sSel) {
		$( sSel ).each(function() {
			var $video = $(this),
				$container = $video.parent(),
				iTargetWidth = $container.width();

			if ( !$video.attr("data-origwidth") ) {
				$video.attr("data-origwidth", $video.attr("width"));
				$video.attr("data-origheight", $video.attr("height"));
			}

			var ratio = iTargetWidth / $video.attr("data-origwidth");

			$video.css("width", iTargetWidth + "px");
			$video.css("height", ( $video.attr("data-origheight") * ratio ) + "px");
		});
	};

	resizeVideo(vidSelector);

	$(window).resize(function() {
		resizeVideo(vidSelector);
	});
})();

WordPress Security 101

There are literally hundreds of plugins promising to improve the safety of your shiny but vulnerable WordPress site. However, as a wise coworker of mine once said:

more code = more bugs = more security breach possibilities

@Schadock29

So instead of adding more code, let’s take a few simple measures to drastically improve any WordPress install. We will have 2 goals here:

  1. Change the default settings so that our config is less predictable
  2. Put all critical resources on lockdown

1.  MySQL table prefix

Imagine a world where all the websites would use the exact same names for their MySQL tables. Wouldn’t that be heaven for a hacker? So yeah, the first step is to switch from wp_ to something different. It can be the name of your website, or even better, something totally random like 9iugHYt9y7_

This is preferably done when configuring database access before installing WordPress, in wp-config.php:

$table_prefix  = '9iugHYt9y7_';

If you already have a running install, you can always migrate, but it’s kind of risky. Here’s a complete tutorial on how to do so.

2. Secret Salt Keys

Salt keys are a set of random variables that improve encryption of information stored in the user’s cookies. Long story short, it makes your password a lot more difficult to crack. Setting unique salt keys isn’t required for WordPress to install properly, so a lot of wp-config.php files have default salt keys in them.

Setting secret salt keys is easy. Just go to https://api.wordpress.org/secret-key/1.1/salt/ to generate random and unique keys, then open your wp-config.php file and paste those generated keys in the appropriate section.

wpconfig-salt-keys

Note that it’s safe to do that on a running install, you will just need to log back in.

3. Disable debug messages

Debug messages usually contain sensitive information, like the full path to your WordPress install. This is why it’s highly recommanded to turn debugging off. Once again this is done in wp-config.php:

define('WP_DEBUG', false);

It’s also recommended to disable PHP errors entirely, by adding the following lines at the very begining of your wp-config.php:

error_reporting(0);
@ini_set(‘display_errors’, 0);

 

4. Disable the theme and plugin editor

WordPress allows its privileged users to edit a file directly from the administration interface. If your administrator account is hacked, it will be an open door to your code base. That’s why it’s also recommended to disable this feature, again in wp-config.php:

define('DISALLOW_FILE_EDIT', true);

5. Protect wp-config.php

As you probably noticed, a lot of WordPress security settings are controlled from one single file: wp-config.php. Your database connexion information are in there too. That would be a shame if you set everything up correctly but allow anyone to read or edit that file… This is probably the most important action to do: secure wp-config.php.

To do so, log in to your server via FTP or command line, and change the file permission settings to 400. It means that the file owner can only read it, but won’t be able to edit it or delete it. Everyone else than the file owner won’t even be able to read it.

chmod 400 wp-config.php

For extra precaution, you can also forbid anyone to access the file from their browser. This is not absolutely necessary as the PHP code in the file won’t actually be displayed by the browser, but better safe than sorry!

To do that, open the .htaccess file at the root of your install, and add the following lines:

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

6. Hide the administrator

A WordPress account is protected by 2 things: the username, and the password. Let’s not give half of it to hackers. Knowing who is the administrator is super easy: just add ?author=1 to your home URL and voilà, you are redirected to the first user’s profile page, who usually is the admin.

To address this issue, WPMU has a drastic solution: redirect author archive pages to the homepage. If you don’t bother getting rid of author pages, then copy paste the following code to your functions.php file:

add_action(‘template_redirect’, ‘bwp_template_redirect’);
    function bwp_template_redirect()
    {
        if (is_author()) {
            wp_redirect( home_url() ); exit;
    }
}

Wrapping up

That’s all I got for now, but I’ll be sure to add new security related tips in here as I run into them. Also feel free to share your best practices in the comments section.

What is AMP and how can it help your articles to perform better on Google?

AMP is an open source project started by Google, and announced on february 2016. The aim of this initiative is to make the mobile web a lot faster by using several techniques and caching solutions.

Here is, in very short, how it works:

  1. You develop a simplified version of your articles using the AMP specifications, that you host on your domain next to your normal articles.
  2. Both articles, the normal one and the AMP one, are linked to one another via meta tags.
  3. Google will then find your AMP enabled articles thanks to their search robots, and host a cached version of those directly on their infrastructure.
  4. Users searching on Google on mobiles will eventually see your AMP enabled articles at the very top of the search results.

f0787-amp_v6_phone_cropped-mov

Creating AMP enabled pages

If you are using WordPress or Drupal, AMP support only requires you to install a plugin. However, the AMP version will be very basic and you will need some code customization to include things like web analytics, SEO or branding. If you’re on Marfeel, even better, AMP support is built-in.

If you don’t, no worries. Enabling AMP support is quite simple and should only require a few hours of development. There’s a nice tutorial on the AMP website explaining how to do so.

Note that this article you’re reading is available in its AMP version.

I’ve always wanted to travel and work for some time, but been wondering if it’s just a fantasy or could become a reality. If you’re like me, the amazing Joyce Grace shares her journey as a she traveled the world while freelancing as a WordPress developer. Definetly worth the read!

Change WordPress Language on a Running Install

Well I thought it would be tough but it’s actually pretty simple, or even a one line change if you want to switch back to English. To do the latter, simple open your wp-config.php file, find the WPLANG constant, and empty it. Period.

define('WPLANG', '');

Now if you need to switch to another language than English, you will need to grab the language files on the WordPress Language File Repository, and upload them to your install before modifying the wp-config.php file.

To do so, go to the repository, chose the desired language (for examplefr_FR), click the branches link, pick the version of your WP install, and open the messages repertory. Download all the files you see, and upload them to the wp-content/languages repertory on your server. Now you can edit your wp-config.php file and change the WPLANG value to the language code you picked (in my case fr_FR).

define('WPLANG', 'fr_FR');

That’s it. :)

Copyright © 2018 VBlog

Theme by Anders NorenUp ↑