As I want my page to load as fast as possible and have the HTML code clean when analysing the source code (as a developer), I’d rather have all that extra code removed, especially since it loads on every page of my website. There are 2 ways in which you can do that. We’ll start with the most convenient one:

1) Disable Emojis plugin

This is the quickest way to do that and emoji’s will still work in browsers which have built in support for them. This plugin simply removes the extra code bloat used to add support for emoji’s in older browsers.

2) Use the code below

I prefer to edit functions.php or to have a custom plugin with snippets as the block of code is pretty small. If you are comfortable with that, here’s the code that you can use:

function bit_disable_wp_emojicons() {
    // all actions related to emojis
    remove_action( 'admin_print_styles', 'print_emoji_styles' );
    remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
    remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );
    remove_action( 'wp_print_styles', 'print_emoji_styles' );
    remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );
    remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
    remove_filter( 'comment_text_rss', 'wp_staticize_emoji' );

    // filter to remove TinyMCE emojis
    add_filter( 'tiny_mce_plugins', 'bit_disable_emojicons_tinymce' );
}

add_action( 'init', 'bit_disable_wp_emojicons' );

function bit_disable_emojicons_tinymce( $plugins ) {
    if ( is_array( $plugins ) ) {
        return array_diff( $plugins, array( 'wpemoji' ) );
    } else {
        return array();
    }
}

The post Disable Emojis in WordPress 4.2+ For a Faster Page Load appeared first on Bit Repository.

If you are a wise, business-minded person, you will never miss a chance to get something really worthwhile for free. Do you like participating in different giveaways? This week you have a brilliant opportunity to try your luck. Bit Repository together with TemplateMonster.com offers you an opportunity to participate in the giveaway.

What specifically is being given away?
The prize is any premium template of your choice from TemplateMonster. They have nearly 50,000 themes in stock covering different requirements and powered by the most popular engines.

1. Would you like to build a WordPress site? Then, search for it here.
2. Need a simple e-Commerce solution? Then, check out their PrestaShop designs.
3. Of course you can choose any other e-Commerce platform for your store. Maybe you prefer to work with Magento, WooCommerce, OpenCart, VirtueMart or others. TemplateMonster is really able to cater to any of your needs. Visit this page to find your perfect e-Commerce theme.
4. Not sure what you are looking for? Check out here. Who knows, maybe this link will lead you to your future website design.

What should you do to win?
Everything is simple, as usual. You just choose the item that perfectly meets your requirements on TemplateMonster’s site and put down its number in the comment section.

The TM giveaway starts on 1st February, 2016, and ends on 8th February, 2016 (next Monday), when 3 lucky readers will be selected as winners.

How are the winners actually selected?
By running an SQL query that selects 3 random results from the comments table:
SELECT * FROM [comments_table] WHERE `comment_post_ID` = 16790 AND comment_approved = 1 ORDER BY RAND() LIMIT 3

Important!
Please make sure that you provide a valid e-mail address as the winners will receive notifications via them. We wish the best of luck to all our readers. Thanks for your attention and don’t procrastinate until tomorrow, take action today! Browse TemplateMonster’s templates and make your pick!

The post Win a Premium Design From TemplateMonster appeared first on Bit Repository.

Some time ago, I got a copy of WP Rocket from the guys that developed it in order to test it and write a review about it. I was curios what this paid WordPress cache plugin has to offer in comparison with other free plugins out there, some of them very popular and used by lots of developers.

What’s the main functionality of a WordPress cache plugin?

WP caching plugins, either free or commercial, have the purpose of making the webpages load faster by:

• Caching pages into HTML ones (so they could be read without parsing the PHP code and make queries to the database)
• Minifying and concatenating .CSS and .JS files
• GZIP compressing the HTML pages
• Being compatible with Content Delivery Networks in order to serve assets (images and other files) from other servers (that are often closer to the location of the person loading the website, thus taking less time to download).

These are only a few of the features that are included in a caching plugin. As much as a like working with WordPress, being a developer myself, we all know how notoriously slow it can be sometimes if not optimised properly. Thus, all these caching plugins were developed.

Is it worth paying for a cache plugin when there are other ones out there free of charge?

In the beginning, I thought that this looks like a waste of money and wondered why would someone pay for a cache plugin when there are lots of other ones that can be found for free out there and are very powerful. However, I was thinking with the mind of the developer that likes to download plugins, have the time to play with them, tweak what needs to be tweaked and then happily use them without thinking of the premium options out there.

The plugin went through lots of updates in the past year and came with features that you won’t find in other cache plugins including: lazy loading, enable/disable caching on specific posts, combine google font requests into one. Besides, the interface is very simple and intuitive to use for the regular user which makes it easier to configure and it’s less likely that you will mess up something on your website. I’ve been using W3 Total Cache on my websites. It’s a good plugin, I would recommend it, but it takes you a while to understand it, especially if you’re not a developer. Plus, you don’t have any one on one support in case something goes wrong. You need to fix things yourself and since many people pay for convenience, an investment of $39 doesn’t seem much to save yourself time and other headaches.

Is WP Rocket’s default caching options the best for basic websites?

Although having the basic/default settings won’t give you the best performance, they will prevent you from messing up something on your website which is an advantage if you’re not a developer and don’t want to spend time tweaking it. Whatever caching plugin you’re using (free or paid), you have to go to the plugin’s settings and keep updating the options until you will get the optimal setup (e.g. minifying all JavaScript files into one could break something and you might have errors in the front-end. Thus, you can only minify the CSS files or minify the JavaScript ones into more than one files, which WP Rocket already does).

What would be one reason for investing into this plugin?

Having customer support when you need it. If you’re not a developer, it will help you save time and other headaches that other plugins could give you if they are not configured properly. I’ve regularly received emails and updates about WP Rocket in the past months.

If you’re a developer and care about the back-end side of things, I’ve also checked the quality of code.

• What I DO Like: it follows the WordPress standards (although they are really old fashioned) and is very well organised. Moreover, it has plenty of hooks that you can use which is great as you don’t have to touch the plugin directly in case you need to make changes (in general, it’s always best to make the changes you need without touching the WordPress plugins)
• What I DO NOT Like: the lack of OOP code (you barely see any). Most of the code is procedural and I believe WordPress developers should focus more on the objected oriented side of things as it would make things easier for future development. Also, some of the functions have fairly common names (e.g. “rocket_init”), which could conflict with other functions name the same in either the theme or in other plugins. It’s not that likely, but you never know. It happened to me in the past to believe that I used an unique name, and to found out that it was used in other plugins as well.

The post WP Rocket Review: Would you buy a WordPress cache plugin? appeared first on Bit Repository.

However, there are situations when we need a plugin on a page or we use a theme, but some of the CSS and JavaScript files are not needed. Imagine a contact page where you only have some text and a form and you are using a theme that loads plenty of useless CSS and JavaScript files. Not ideal for our website visitors that should enjoy a faster page load.

I’ve decided to write my first official free plugin and share it with the WordPress community.

WP Asset Clean Up scans the page you’re editing, detects the loaded scripts and styles and shows them in a list where you can choose the ones that you don’t want to load.

What are the benefits of using this plugin?

• The HTTP requests on your website will decrease thus saving you bandwidth (good, if you don’t have unlimited with your host) and your pages will load faster
• In case there are conflicts between scripts (from plugins/themes) that are loading on the same page, you can remove the ones that you don’t need, thus minimising the risk of JavaScript errors. If you’re a developer, you know how much headache you can have when you’re debugging errors on a page that have 20 .js files loaded from various plugins (and you only need 5 of them).
• The HTML source code will be smaller, cleaner and easier to read when you’ll need to find something.
• The Apache log files will also be smaller and easier to read since less requests will be made to the server.

This plugin is powerful in combination with a cache plugin that also combines the remaining loaded assets (.css and .js files) to minimize the number of HTTP requests.

The post Remove unused scripts & styles on WordPress pages | For faster load appeared first on Bit Repository.

View Video

Enjoy the video and if you have any comments about the topic, feel free to post them!

The post Discover How To Detect Mobile Devices: Video Presentation appeared first on Bit Repository.

The solution to the dreadful search for quality web graphics is over. Designers around the world can now make use of these amazing UI kits from PixelKit for all their design needs.

What’s all included?

If you’re one of the three fortunate winners of a full-year membership to PixelKit you will confirm why these kits are so amazing. These UI kits include a huge array of web graphics to beautify and make any website functional. Here’s why this giveaway is so amazing:

• Your PixelKit membership allows you to use 5000+ premium graphics and any other graphic kit that is added within the year without paying anything extra.
• New UI kits are added every month, and you can access those with your membership with ease.
• You get access to virtually all the icons and web elements you will ever need, no matter the theme of your website. Most other libraries have fewer elements, making it difficult for designers to find everything they need in one place.
• PixelKit’s vectored graphics are the perfect solution for you to resize your elements based on your needs.
• The library is full of mobile-ready elements that make it easy for viewing on tablets, smartphones, and pretty much any device.
• If you’re working on HTML sites, you will be glad to know that these elements are compatible with 960 grids.

Designers who are looking to develop sites with ease and in an efficient manner should consider PixelKit as their UI graphics solution. It solves the problem of needing to spend hours developing your own graphics or looking for them on the Internet. Now you can spend that time working on your projects instead.

Check out some of the kits PixelKit has for you:

Shapes Mobile Kit

Perfect for iOS app development. This UI kit, named Shapes Mobile, is beautiful, clear, and versatile. If you’re an app developer, take a look at this.

Crooked Stats Kit

If you’re creating infographics for your clients, then Crooked Stats is for you. It will help you showcase your information in an easy-to-understand manner no matter how complex it is.

5 O’clock Shades Icon Set

The O’clock Shades Icon Set is a set of modern icons with a flat style, perfect for a modern website that is also functional.

City Break UI Kit

If you’re working on a website for a Bed and Breakfast, a hotel, or any other related industry website, the City Break UI Kit is perfect for you. Portray a site that is not only fun, but also easy to use for visitors.

Red Carpet UI Kit

The Red Carpet UI Kit has been built with movie review blogs and related blogs in mind.

How to Enter to Win a PixelKit membership

How are the winners actually selected?

By running an SQL query that selects 3 random results from the comments table:
SELECT * FROM {$wpdb->comments} WHERE `comment_post_ID` = 16163 AND comment_approved = 1 ORDER BY RAND() LIMIT 3

Last but not least, check out the Free PixelKit Bootstrap UI Kits. For all your HTML design projects, these templates are a perfect fit.

The post Be one of 3 Winners of a PixelKit Membership Account appeared first on Bit Repository.

Time-saving is one of the foremost priorities of a developer that can help enhance the overall productivity. And one of the productivity tips from the developer’s point of view is the epidemic usage of the exciting WordPress shortcuts.

WordPress is the prominent blogging and CMS platform that also offers a wide range of keyboard shortcuts to help you boost your productivity rate expeditiously. Through this blog, we will highlight some of great and time-saving WP keyboard shortcuts. But before diving into this, let us understand why content formatting plays a crucial role.

Content Formatting 101

The presentation style of your website’s content plays a key role in determining the conversion rates and viewer’s engagement. Systematically formatted content with the pertinent headings, bold and italics, block quotes, induces the interest of the targeted readers. Thus, it is important to format the content in an engaging and intellectual way.

Bold Text

Highlighting the text in bold quickly grabs the viewer’s attention to your site’s content. When you are glancing through pages and for that matter you see a sentence or phrase that are highlighted in bold, it quickly appeals to your eyes and you start reading those highlighted sentences.

Italics

Italics play a crucial role by allowing your readers to briskly grasp what is being referred to in the content. It enables the reader to automatically highlight on the italicized word.

Bullet Lists

Bulleted lists drive the eyes of your reader. With the help of bullet format, you can convey the desired message to the viewers very easily and swiftly. Such text is easier to read and always easier to remember in this format. However, there are certain tips that you should keep in mind while using bullets:

• Keep the sentences short and relevant
• Make sure each sentence carries the same scale of importance
• Don’t use too many bullets
• Start each sentence with the same part of speech

WordPress Shortcuts

WordPress appears with a “What You See Is What You Get” editor. It is one of the collective excellent text editors which is used to fortify a plethora of rich text activities that includes bullet points, highlighting text, block quotes and headings.

Do you know that the WP keyboard shortcut “Ctrl+K” opens the hyperlink dialogue box and by entering the URL, your text gets hyperlinked without using a mouse click. Isn’t it amazing that you can manage your text efficiently without wasting your precious time.

Essential points

Many of the themes and plugins in WordPress sum up their own shortcode buttons to the visual Editor, which is very helpful for most of the developers.

• You don’t have to install any new theme or plugin that can add extra buttons in the Visual Editors.
• If you are using a Mac, then there is no use of Ctrl key. Replace the Ctrl key with the Command key in the keyboard shorts.

Launch Visual Editor

You need to launch a Visual Editor in WordPress by creating any new page or post.

Once creating a page/post, you need to see all the formatting tools that are already available in the WordPress Visual Editor. By clicking Toolbar Toggle button, you can easily showcase or hide the toolbar that contains the other necessary formatting buttons.

By clicking on the “? Button”, you can see the Keyboard Shortcuts dialog box.

Heading Shortcuts

You can use these shortcuts for the different headings from H1 to H6. It saves your time as you don’t need to select the sentence. You just place your cursor on the appropriate sentence and apply the keyboard shortcut and you can easily highlight the selected sentence. (If you are using Mac, then you have to use Option+Command in the place of Ctrl)

• Heading 1 => Ctrl+1
• Heading 2 => Ctrl+2
• Heading 3 => Ctrl+3
• Heading 4 => Ctrl+4
• Heading 5 => Ctrl+5
• Heading 6 => Ctrl+6

Basic Editor Shortcuts

In this, you have to select the sentence, phrase or word that needs to be highlighted. Following are the basic editor keyboard shortcuts used by all web developers.

• Cut => Ctrl+X
• Copy => Ctrl+C
• Paste => Ctrl+V
• Underline => Ctrl+U
• Italicize => Ctrl+I
• Bold => Ctrl+B
• Select All => Ctrl+A
• Strikethrough => Alt+Shift+D
• Undo => Ctrl+Z
• Redo => Ctrl+Y

Exceptional Editor Shortcuts

With the use of such advanced editor shortcuts, you can save a lot of time and complete your work with efficiency.

Text Alignment Shortcuts

Align Right => Alt+Shift+R
Align Left => Alt+Shift+L
Justify Text => Alt+Shift+J
Align Centre => Alt+Shift+C
Link Modification Shortcuts
Insert Link => Alt+Shift+A
Remove Link => Alt+Shift+S

5 Amazing Unknown Keyboard Shortcuts

Add/Remove Code Tag => Alt+Shift+X
Insert Page Break Tag => Alt+Shift+P
Insert More Tag => Alt+Shift+T
Insert Blockquote => Alt+Shift+Q
Insert Image => Alt+Shift+M

WordPress Keyboard Shortcuts that are barely used:

Open Spell Checker => Alt+Shift+N
Help => Alt+Shift+H
Enter Distraction-free writing mode => Alt+Shift+W
Save Draft => Ctrl+S
Show/hide the Kitchen Sink => Shift+Alt+Z

Distraction Free Writing Mode

This mode has the ability to shroud everything that can come between your writing. The Distraction free writing mode also offers amazing keyboard shortcuts:

Enter/Exit Mode => Alt+Shift+W
Narrow the Editor => Ctrl + ‘-‘ (Simply press Ctrl-)
Reset to Default Width => Ctrl+0
Widen the Editor => Ctrl + ‘+’ (Simply press Ctrl+)

Comment Moderation Keyboard Shortcuts
Filtering the daily comments from the posts is one of the irritating and time-consuming activities. But with the help of keyboard shortcuts, you can easily moderate the comments publish on the WP blog or post.

Enabling Keyboard Shortcuts for Comment Moderation
In order to utilize these shortcuts, you need to enable the “Shortcuts for Comment Moderation” option in the WP admin account.

Note: By default this option is inactive. To make it active, you need to follow these steps:

• Go to WP Dashboard > Users > Your Profile
• Check the box Enable keyboard shortcuts for comment moderation
• Click on Update Profile

Comment Navigation Shortcuts
You need to navigate through the list of comments. And the selected or activated comment will be highlighted in blue color.
Navigate to Comment Above K (also known as the Comment Up key)
Navigate to Comment Below J (also known as the Comment Down key)

Comment Moderation Action Keyboard Shortcuts
After selecting the comments that you want to moderate, you can use the below shortcuts:
Approve comment – A
Unapproved comment, and put it back into moderation – U
Mark comment as spam – S
Reply to the comment – R (Hit Esc to cancel the reply)
Restore comment – Z
Quick Activate Edit for inline editing of the comment – Q
Delete comment – D

Bulk Comment Moderation Shortcuts

Following are the bulk comment moderation shortcuts. With the use of it, you can save a lot of time:
Approve Selected Comments – Shift + A
Move Comments to Trash – Shift + T
Mark Comments as Spam – Shift + S
Delete the Selected Comments – Shift + D
Reject the Selected Comments – Shift + U
Restore Comments from Trash – Shift + Z

Conclusion

With the help of all these amazing keyboard shortcuts, you can easily format the content on your WP website and can make changes quickly. These are some of the important shortcuts that can enhance your site’s productivity in a short time span.

The post WordPress Shortcuts: Things developers must know to enhance productivity appeared first on Bit Repository.

You can either do that by using a plugin, which is the easiest and quickest way of doing it or by adding a code in your functions.php (or a custom plugin where you have your settings). If you want to apply this to 1 page and 1 widget only and you’re comfortable editing code, then you can use my snippet code. If you have to hide a few widgets for more pages and posts, then using a plugin would have been easier to manage that.

I will show you how to do it both ways and you can decide based on your situation what’s the best option for you. It’s also good for you to see how it’s done in the code, so you can learn more 😉

1) By using “Display Widgets” WP Plugin

This WordPress Plugin hides widgets on specified pages. It adds checkboxes to each widget to either show or hide it on every site page. With over 200,000 installs (I’ve tested it myself) and a 4.8 out of 5 rating, you can be sure that this plugin does what it claims.

Using it, you can avoid creating multiple sidebars and duplicating widgets by adding checkboxes to each widget in the admin. “Hide on checked pages” is left without any boxes checked, thus all your current widgets will display on all pages.

2) By inserting a code snippet into functions.php

Here’s the code that you can use to remove the widget you want in one or more pages. We will analyse it below:

function bit_remove_widget( $sidebars_widgets ) {
    global $post;
    
    $page_ids = array(2); // List of Page IDs where the widget will get hidden (one or more)
    $sidebar_id = 'sidebar';
    $widget_id = 'text-394376789';
    
    if( in_array($post->ID, $page_ids) ) {
        foreach($sidebars_widgets[$sidebar_id] as $key => $value) {
            if($value == $widget_id) {
                unset($sidebars_widgets[$sidebar_id][$key]);
            }
        }
    }
    
    return $sidebars_widgets;
}

add_filter( 'sidebars_widgets', 'bit_remove_widget' );

By using the WordPress filter ‘sidebars_widgets’, we are removing the ones that we do not need. First, we declare the $page_ids that contains a list with the pages where the widget will be hidden. In my example, I’ve added 2 as the page ID.

To get the page id, you just access the pages list “Pages” – “All Pages” and click on its title. The URL that will contain something like: “/post.php?post=2&action=edit” – The value of “post” (2 in this case) is the Page ID.

Now, we need to get the Sidebar ID and Widget ID. The easiest way for this would be to access “Appearance” – “Widgets” in the Dashboard, then on “Screen Options” (top right), click “Enable accessibility mode”. Once you do, click “Edit” on the widget you want to hide. In the URI, you have the values you need: /widgets.php?widgets-access=on&editwidget=text-394376789&sidebar=sidebar&key=0 (Widget ID and Sidebar ID are shown in bold).

I hope you learned something today and if you have any questions or comments about this technique, feel free to comment below. Many thanks for reading this and looking forward for more WordPress tips and tricks!

The post Hide WordPress Widgets on Specific Pages / Posts appeared first on Bit Repository.

PageSpeed Insights

Measures the performance of a page for mobile and desktop devices. The URL is being fetched twice: once with a mobile user agent, and once with a desktop user agent. The page score ranges from 0 to 100 points. The higher the score, the better. If you have a score over 85, it suggests that the page is performing well.

This tool measures how a page can improve its performance on:

• Time to above-the-fold load: Elapsed time from the moment a visitors requests a new page and to the moment the above-the-fold content is rendered by the browser.
• Time to full page load: Elapsed time from the moment a visitor requests a new page to the moment the page is fully rendered by the browser.

Pingdom Website Speed Test

It was built to help you analyze the load speed of your websites and learn how to make them faster. Tests are done with real test browsers from dedicated Pingdom servers to match exactly the end user experience. They use a bunch of instances of Google’s Chrome web browser to load websites, record performance data and so on.

Features include:

• Examine all parts of a web page – View file sizes, load times, and other details about every single element of a web page (HTML, JavaScript and CSS files, images, etc.). You can sort and filter this list in different ways to identify performance bottlenecks.
• Performance overview – They automatically put together plenty of performance-related statistics for you based on the test result
• Performance grade and tips – See how your website conforms to performance best practices from Google Page Speed (similar to Yahoo’s Yslow). You can get some great tips on how to speed up your website this way.
• Trace your performance history – We save each test for you so you can review it later and also see how things change over time (with pretty charts!).
• Test from multiple locations – See how fast a website loads in Europe, the United States, etc.
• Share your results – They’ve made it easy for you to perform a test and share it with your friends, work colleagues or web host.

GTmetrix

This service uses Google Page Speed and Yahoo! YSlow to grade your website’s performance and provides actionable recommendations to fix the issues. You can test your website and get extra features if you sign up for free. Some of the benefits include but not limited to:

• Track History with Graphs: With 3 interactive graphs, you can keep track of the performance for your page and visualise your history
• See how your page performs on an actual Android device; thus you can optimise your website for mobile users and ensure a fast page load on their devices.
• Test from multiple locations – check the page load from different regions around the world (Vancouver, Canada; Dallas, USA; London, UK; Sydney, Australia; São Paulo, Brazil; Mumbai, India; Hong Kong, China)
• Playback Page Load with Videos – By recording your page loads, you can pin point exactly where bottlenecks or stoppages occur.
• Set up Monitored Alerts – You can be notified if your page speed falls below a certain score you set.

Dotcom-Monitor

This is a web performance company based in Minneapolis, Minnesota that monitors websites, servers and applications for availability, speed and functionality from their worldwide network. The free website speed test provides:

• Browser-based load time testing of all page elements
• Test via Chrome, Firefox, IE and mobile web browsers
• Results from nearly 2 dozen global locations
• Detection of slow/missing elements
• Complete waterfall report, charts & graphs

With this tool, you can test your page loading speed in 20 locations worldwide, including cloud based tests (Amazon-US-East) and from behind the Great Firewall of China (Shanghai).

PageScoring

This service provides webmasters with valuable information about the loading speed of their domain and website. The tool generates a report that includes:

• Domain Lookup: The time taken to resolve your domain to the correct server IP
• Connection Time: The time taken to establish a connection to the web server
• Page Size: Total page size of the website downloaded in bytes
• Download Time: Time taken to download the HTML source code
• Average Speed: The average speed of connection during download
• Files Report: Details about the files loaded (size, path) and how fast they loaded

Gift of Speed

Recent studies have shown when web pages do not load within 3 seconds, 25% of visitors will already have left.

Besides testing your website speed, this service also offers a range of tools including:

• CSS Compressor: Automatically compress your CSS scripts and files into a much smaller size. Minimizing the disk size your CSS needs can improve page speed.
• JavaScript Delivery Test: Check how you can improve your Javascript delivery by running this test.
• Caching Checker: Check whether your files are correctly cached or not by viewing the caching information of your URL.
• Gzip Test Tool: Tool to check whether your page has GZIP enabled and how well it compresses.
• CSS Delivery Test: Test whether your CSS delivery is optimized to the maximum and learn how to improve the delivery.

What I particularly like about this service is the fact that they have a “How to” section with a lot of articles about improving page speed and steps you need to do. Very good to go through, especially for beginners!

Has any of these websites helped you in particular to measure website speed? If so, please share your experience with us.

The post 6 Online Tools You Can Use To Measure Website Speed appeared first on Bit Repository.

What is a directory traversal attack?

According to Wikipedia: “A directory traversal (or path traversal) consists in exploiting insufficient security validation / sanitization of user-supplied input file names, so that characters representing “traverse to parent directory” are passed through to the file APIs.”. This HTTP exploit is also known as as the ../ (dot dot slash) attack, directory climbing and backtracking.

The most recent attack on I’ve noticed was when I checked my 404 logs and noticed attempts on downloading wp-config.php by accessing a file that doesn’t exist and likely has a vulnerability. The path was something like /wp-content/themes/[theme_name_here]/scripts/download.php?file=../../../../wp-config.php. I didn’t have that theme installed (as a result a 404 error was issued and logged). It was mostly a scanner that checks WordPress websites for vulnerability and the moment it manages to access wp-config.php it marks that website as vulnerable in their system.

Now, once the vulnerability is found, more files can be downloaded from your server and some of them should not end up being downloaded by everyone, especially by hackers that can mess up your website and affect even your clients.

What can an attacker do with wp-config.php (or any similar configuration file) for instance?

While some attackers would not manage to do much due to their lack of experience, others can have a lot of help by accessing the sensible data from this file. Here are some of the things that you should know about:

1) Keys and Salts – Once one knows them, they can take advantage of that to get into the Dashboard. Click here to read more about this!

2) SQL Injection – Tables prefix are revealed which is useful for someone to attempt an attack

3) MySQL Database Charset – Some attacks rely on this information

4) Login Credentials – While they might not access your database (unless you allow external connections to it, a thing that should be done wisely and if only it’s necessary), they can try variations of your logins on the FTP, email and other popular websites where it’s likely you haven an account (such as Facebook). Often, people make this mistake of using the same username & password combination on multiple websites and emails, thus making things easier for an attacker.

Now, let’s take a look how a vulnerable download.php file (located in the WP theme’s root folder) would look like:

<?php
$files_folder = 'files';
$file_name = isset($_GET['file']) ? $_GET['file'] : '';

$path_to_file = dirname(__FILE__).'/'.$files_folder.'/'.$file_name;

if(file_exists($path_to_file)) {
    header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
    header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date in the past

    header("Content-Description: File Transfer");

    header("Content-Type: application/save");

    header("Content-Length: ".filesize($path_to_file));
    header("Content-Disposition: attachment; filename=".basename($file_name)); 
    header("Content-Transfer-Encoding: binary");

    readfile($path_to_file);
} else {
    exit('The requested file does not exist.');
}
exit;
?>

Why is this code vulnerable?

As you can see in the code, the file download.php is trying to get any file requested that is located within “files” folder. The code dirname(__FILE__) returns the local server path to the theme.

Only one check is made to determine if the file exists before it is being downloaded. However, this can be easily hacked by using the ../ way to traverse through folders.

In the following example, the file wp-config.php is being downloaded from the server:
http://www.your-domain.com/wp-content/themes/your-theme-name/download.php?file=../../../../wp-config.php

Basically the full path to the file that is being checked if exists is something like: /home/site/public_html/wp-content/themes/your-theme-name/files/../../../../wp-config.php. As ../ goes to the parent folder, you can see that the function returns true and the right headers are being sent to the browser to download this file. Perhaps you have seen in many PHP applications code like the following: include '../config.php'. It includes the file located in the parent folder. Note that I’m not against this inclusion practice as long as it’s used properly in projects.

How can this code be improved?

1. We should strip ../ from being included in the file name.
2. Check if the file really exists in the directory where we want the files to be downloaded from. We’ll use scandir to get the files and then check if our requested file is in the list.

Here’s a new improved version of the code:

<?php
$files_folder = 'files';
$file_name = isset($_GET['file']) ? $_GET['file'] : '';

// No ../ are allowed and something has to be requested
if( ($file_name == '') || (strpos($file_name, '../') !== false) ) {
    exit('Invalid Request');
}
// Now let's see if the file really exists in $files_folder
$path_to_folder = dirname(__FILE__).'/'.$files_folder.'/';

$files_in_folder = @scandir($path_to_folder);

if( ! in_array($file_name, $files_in_folder) ) {
    exit('Files does not exist.');
}

$path_to_file = $path_to_folder . $file_name;

header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date in the past

header("Content-Description: File Transfer");

header("Content-Type: application/save");

header("Content-Length: ".filesize($path_to_file));
header("Content-Disposition: attachment; filename=".$file_name); 
header("Content-Transfer-Encoding: binary");

readfile($path_to_file);
exit;
?>

Note that this works if you wish to allow people to download any file from that directory. If you only wish that only specific files should be downloaded, you can include extension checking to avoid for instance .PHP file downloads OR make a list of all possible files that can be downloaded and an extra check to see if the file is there, like in the following example:

$allow_list = array('data.zip', 'extra.zip', 'other-file.csv');

if( ! in_array($file_name, $allow_list) ) {
    exit('Invalid Request! You are not allowed to download the requested file.');
}

I hope this post helped you with ideas to prevent directory traversal attack on any websites you’re working on. Check out some links about this kind of vulnerability:

• http://en.wikipedia.org/wiki/Directory_traversal_attack
• http://finalphoenix.me/blog/2015/02/05/7-popular-wordpress-plugins-that-will-get-your-site-hacked/
• http://www.acunetix.com/websitesecurity/directory-traversal/
• http://www.darkreading.com/vulnerabilities—threats/dont-underestimate-directory-traversal-attacks/d/d-id/1140306?

The post Avoid directory traversal attacks in PHP & WordPress appeared first on Bit Repository.