|
1 2 3 |
RewriteEngine On RewriteCond %{SERVER_PORT} 80 RewriteRule ^(.*)$ https://yourdomain.com/$1 [R,L] |
Simple SSL certificates are easily obtained and installed these days. Here some simple first steps to get a Comodo SSL certificate installed.
|
1 2 |
openssl genrsa –des3 –out yourdomain_com.key 2048 openssl req -new -key yourdomain_com.key -out yourdomain_com.csr |
|
1 |
cat yourdomain_com.crt COMODORSADomainValidationSecureServerCA.crt COMODORSAAddTrustCA.crt AddTrustExternalCARoot.crt > cacert.pem |
Some options to check your SSL setup:
|
1 |
openssl s_client -showcerts -connect yourdomain.com:443 |
This can be done manually, as shown above or you can use a shell script, which downloads the certificates for you and combines them. SSL certificate chain resolver – This shell script downloads all intermediate CA certificates for a given SSL server certificate. There is even an online version, but I rather do that on my own machine :) … certificatechain.io
Since version 5.6+ PHP is verifying peer certificates and host names by default when using SSL/TLS. This is causing problems on some servers / websites, where the config has not been setup correctly. If you can not fix the setup yourself, make sure to talk to your server host to fix that issue.
For PHPMailer (Github) there is a workaround:
|
1 2 3 4 5 6 7 |
$mail->SMTPOptions = array( 'ssl' => array( 'verify_peer' => false, 'verify_peer_name' => false, 'allow_self_signed' => true ) ); |
This should only be a workaround until your configuration has been fixed. You are suppressing certificate verification and compromising your security!
As WordPress is using PHPMailer as its main email library, this can be tweaked by using the phpmailer_init hook:
|
1 2 3 4 5 6 7 8 9 10 11 |
add_action( 'phpmailer_init', 'configure_smtp' ); function configure_smtp( $phpmailer ){ $phpmailer->SMTPOptions = array( 'ssl' => array( 'verify_peer' => false, 'verify_peer_name' => false, 'allow_self_signed' => true ) ); } |
Add this to your themes functions.php.
|
1 2 3 4 5 6 7 8 9 |
$phpmailer = new PHPMailer(); $phpmailer->isSMTP(); $phpmailer->CharSet = 'UTF-8'; $phpmailer->SMTPSecure = "ssl"; // or tls $phpmailer->SMTPAuth = true; $phpmailer->Username = _APP_EMAIL_FROM; $phpmailer->Password = _APP_EMAIL_PASS; $phpmailer->XMailer =' '; $phpmailer->Host= "correct email host"; |
And here is how phpmailer->smtpOptions should be used, on a properly configured server:
|
1 2 3 4 5 6 7 8 9 |
phpmailer->smtpOptions = array( 'ssl' => array( 'peer_name' => 'your.domain.com', 'verify_peer_name' => true, 'capath' => '/path/to/authority/certificates/directory' # Usually /etc/ssl/certs or /usr/lib/ssl/certs/ 'local_cert' => '/path/to/your.domain.com.crt', # Should be a combined cert & key in pem format 'verify_peer' => true, ) ); |
SSL changes in PHP 5.6: http://php.net/manual/en/migration56.openssl.php
SSL context options in PHP: http://php.net/manual/en/context.ssl.php
Enjoy coding…
When building plugins or addons, sometimes we need to save custom files within WordPress.
These can be custom JavaScript or CSS files that a user edited and are loaded to override core functionality.
In most cases inline styles and scripts are an option, but not always the most elegant way. Everyone has to decide that for themselves. (wp_add_inline_style) Not talking about performance between inline and external files here :)
Another option is the wp_head action:
|
1 2 3 4 5 6 |
add_action('wp_head','hook_css'); function hook_css(){ $output="<style> .wp_head_example { background-color : #f1f1f1; } </style>"; echo $output; } |
Many ask where can or should I save files created within a plugin.
When dealing with file creation and uploads, security is always important. That relates to any other platform doing similar operations. A folder created within a plugin directory is not less or more secure than a folder created in the upload directory.
Its important to have the correct file and folder permissions set:
There is a detailed article about permissions over at WordPress as well.
When it comes to creating files in PHP the term cross-site-scripting often comes up. When the system creates a file it is owned by the webserver and on a shared hosting account those files could be altered by another user on the same webserver. This could allow them to inject malicious code and compromise your sever.
That is why the WP_Filesystem was created, to make things more secure and make sure that the owner of files is correct.
WordPress provides a nice clean interface to create folders and save files to the upload folder. Here a simple example from one of my current projects.
Prepare the filesystem
|
1 2 |
require_once( ABSPATH . 'wp-admin/includes/file.php' ); global $wp_filesystem; |
Get upload dir information and prepare directory to save to
|
1 2 3 |
$upload_dir = wp_upload_dir(); $dir = trailingslashit( $upload_dir['basedir'] ) . 'your folder/'; |
Check if file exists, create folder, delete similar and save.
In my case I am adding a custom key and the page id to the file.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
$key = md5($js); if (!is_file($dir."/subfolder/yourfile_" . get_the_ID() . "_" . $key . ".js")) { WP_Filesystem(); // Create main folder within upload if not exist if(!$wp_filesystem->is_dir($dir) ) { $wp_filesystem->mkdir( $dir ); } // Create a subfolder in my new folder if not exist if(!$wp_filesystem->is_dir($dir."/subfolder") ) { $wp_filesystem->mkdir( $dir."/subfolder" ); } // Delete similar files, might not apply to you foreach (glob($dir . "/subfolder/yourfile_" . get_the_ID() . "_*.*") as $filename) { unlink($filename); } // Save file and set permission to 0644 $wp_filesystem->put_contents( $dir."/subfolder/yourfile_" . get_the_ID() . "_" . $key . ".js", $js, 0644 ); } |
If the direct way is not possible, you can also use or force the FTP approach
(request_filesystem_credentials).
This will check for the ftp credentials and request them with a form if needed.
|
1 2 3 4 |
if ( ! WP_Filesystem($creds) ) { request_filesystem_credentials($url, $method, true, false, $form_fields); return true; } |
This is just a very rough outline of how to do it, but should get you started.
Multiple connections, happening roughly within a 500 milliseconds timespan, can be called a concurrent connection.
So when looking at new server hardware, you have to think hard, if you will actually hit a certain concurrent connection limit at some point.
So lets say, you publish a campaign in a magazine, promoting a special offer through a single page website.
To calculate the possible concurrent connections, you would need to know roughly how many readers the magazine has.
The chance that all of them reading and visiting at the same time is almost impossible.
So lets say the magazine has 50.000 readers and roughly 1% hit your website at the same time.
In that case you would need a server setup that can handle 500 concurrent users.
These things are more important, when building Mobile Apps. With a popular App you can easily hit those concurrent user limits. This is where cloud solutions become really handy and help to level the traffic requirements. A good example is Parse.
The chance of your server hitting a concurrent connection limit is often not as critical as hitting a RAM limit :)
When loading web-fonts, we often see a brief un-styled moment before the browser applies the actual font. Gladly Typekit and also Google Web Fonts provide an option around that.
Both are using WebFont Loaders to help handle those brief moments.
TypeKit Webfont Loader Example
|
1 2 3 4 5 6 7 |
(function(d) { var config = { kitId: '***' , // Your Kit ID scriptTimeout: 3000 }, h=d.documentElement,t=setTimeout(function(){h.className=h.className.replace(/\bwf-loading\b/g,"")+" wf-inactive";},config.scriptTimeout),tk=d.createElement("script"),f=false,s=d.getElementsByTagName("script")[0],a;h.className+=" wf-loading";tk.src='//use.typekit.net/'+config.kitId+'.js';tk.async=true;tk.onload=tk.onreadystatechange=function(){a=this.readyState;if(f||a&&a!="complete"&&a!="loaded")return;f=true;clearTimeout(t);try{Typekit.load(config)}catch(e){}};s.parentNode.insertBefore(tk,s) })(document); |
This adds a class name to the <html> element during loading
|
1 |
<html class="wf-loading"> |
This is removed when loading is done. This allows us to hide content until all fonts are loaded.
Webfonts Loading
|
1 2 3 |
.wf-loading * { opacity: 0; } |
This also adds classes once the webfonts have been loaded, which allows us to add some transitions to reveal the content again.
Webfonts Loaded
|
1 2 3 4 5 6 7 |
.wf-active *, .wf-inactive * { -webkit-transition: opacity 1s ease-out; -moz-transition: opacity 1s ease-out; -o-transition: opacity 1s ease-out; transition: opacity 1s ease-out; } |
One last thing. You should add the webfont loader early in your content, so that it can do its magic before anything else is being loaded.
Compressing your content saves bandwidth and improves render time, particular on devices with slow internet connections. Compression allows your web server to provide smaller file sizes that load faster for your visitors. Compression of your HTML and CSS files with gzip typically saves around 50 to 70 % of the file size.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
# compress text, html, javascript, css, xml: AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript # Or, compress certain file types by extension: <files *.html> SetOutputFilter DEFLATE </files> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
gzip on; gzip_comp_level 2; gzip_http_version 1.0; gzip_proxied any; gzip_min_length 1100; gzip_buffers 16 8k; gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript; # Disable for IE < 6 because there are some known problems gzip_disable "MSIE [1-6].(?!.*SV1)"; # Add a vary header for downstream proxies to avoid sending cached gzipped files to IE6 gzip_vary on; |
A good candidate is the WP Far Future Expiration Plugin ,which not only activates GZIP compression but adds file expiration for various static file types.
Link
Check speed improvement before and after
Currently reading up on the IMAP protocol, as one of my customers is using a server without IMAP support compiled :)
I will be using a simple INBOX check for failed email notifications (sockets are your best friend). That will allow me to set a flag for every new user account that is still unconfirmed and used a broken email address for their registration. These accounts can than be verified manually :)
Happy socket = happy customer.
Btw, here is a nice piece of code to quickly parse the email header in PHP
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
$parsed = array(); $blocks = preg_split('/\n\n/', $response['data']); $lines = array(); $matches = array(); foreach ($blocks as $i => $block) { $parsed[$i] = array(); $lines = preg_split('/\n(([\w.-]+)\: *((.*\n\s+.+)+|(.*(?:\n))|(.*))?)/', $block, -1, PREG_SPLIT_DELIM_CAPTURE); foreach ($lines as $line) { if(preg_match('/^\n?([\w.-]+)\: *((.*\n\s+.+)+|(.*(?:\n))|(.*))?$/', $line, $matches)) { $parsed[$i][$matches[1]] = preg_replace('/\n +/', ' ', trim($matches[2])); } } } |
In a perfect world all current browsers would allow the usage of WebRTC natively, but that is as always not the case ;)
“WebRTC (Web Real-Time Communication) is an API definition drafted by the World Wide Web Consortium (W3C) that supports browser-to-browser applications for voice calling, video chat, and P2P file sharing without the need of either internal or external plugins.” – Wikipedia
