Free WordPress Qurtain Theme Version 0.1

After a long hiatus on developing on WordPress, I’m back. Finally, I have a fresh new look for the website with a new theme built from scratch. I’ve spent about roughly 30 hours building this theme. Relearning some basic and core CSS3, HTML5, and WordPress. I’ll be posting a video soon on how to build a responsive theme from scratch.

I intend to release this theme for free. It is in its early stage that has flaws but good enough to get it out there.

3 Quick Easy Steps To Speed Up your WordPress Site Now

Optimizing your WordPress powered website is a continuous process. It depends on how heavily customized your WordPress site is, luckily the out of the box the theme I installed ranked average.

Check your site at Think With Google or GtMetrix to get baseline of where your current website stands.

This is my baseline stats.

I started with these and with 3 quick steps and it took me less than 40 mins.

 

Step 1:  Enable gzip compression on your website. Edit the .htaccess file and add the following



# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml

# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent


Step 2: Go into your theme folder and grab the css and js files and make a backup. Minify the existing css files at Minifier.org and upload them back, if nothing breaks you are gold.

Step 3: Optimize and compress images on your site, install the Smush It plugin. Free edition lets you process 50 images at a time.

With this 3 simple steps you can quickly do to increase your site performance. Then you can go further and implement more methods like shop around for a better host, remove unnecessary plugins, start using CDNs where you host your images and javascript libraries or install a caching plugin like W3 Total Cache.

How to run on WordPress on a LEMP stack on Amazon EC2

At last, finally found time to move my blog on LEMP(Linux, Nginx, MySQL and PHP-FPM) stack and it just one of the many goals I have set for starting overhauling this blog and over the coming days I’ll be optimizing it further and come up with a fresh new design. I’ve been running this blog on Amazon EC2 LAMP stack on t1.micro instance. With micro instances you have limited processing power and memory. Running apache is kinda like an overkill, MySQL most often times crashes due to running out of memory and this layout design is outdated and not responsive. I’ve been focused too much on Salesforce development that I’ve completely snobbed this blog and first love which is designing, web development.

Here a short 3 part tutorial for setting up EC2, LEMP and WordPress

    Part 1 Setup EC2 instance

  • Sign up for AWS account
  • Create a new instance
  • Select Linux distro either Ubuntu 14.04 or higher (HVM preferred)
  • Select t2.micro instance and run through the wizard
  • Edit the security group and make sure you add SSH and HTTP rules
  • Then launch and download your key
  • Once launched get the public IP
  • On Mac SSH using pem key to the IP
    eg. sudo ssh -i my.pem ubuntu@1.1.1.1
  • Part 2 Setup Nginx,MySQL and PHP-FPM

  • Once connect make sure you update your distro local package (sudo apt-get update)
  • Next install nginx
    sudo apt-get install nginx
  • Install MySQL Server
    sudo apt-get install mysql-server
  • Setup MySQL structure
    sudo mysql_install_db
  • Run secure MySQL script and follow the prompts
    sudo mysql_secure_installation
  • Install PHP
    sudo apt-get install php5-fpm php5-mysql
  • Install PHP
    sudo apt-get install php5-fpm php5-mysql
  • Secure PHP
    sudo vi /etc/php5/fpm/php.ini
    Uncomment and set to cgi.fix_pathinfo=0
  • Restart PHP
    sudo service php5-fpm restart
  • Edit nginx configuration to read PHP
    sudo vi /etc/nginx/sites-available/default
  • Add index.php to be parsed
    index index.php index.html index.htm;
  • Restart nginx
    sudo service nginx restart
  • Setup server permissions
    sudo chown -R demo:www-data /var/www/html/*
    sudo chown -R www-data /var/www/wordpress
  • Sweet! Finally you can install your wordpress.

Configure WordPress Update on Ubuntu EC2 instance

EC2 instances uses SFTP and not FTP. Since you do not have a password. The easiest way to configure the WordPress update is via command line. SSH into your instance and enter the following.

sudo chown -R www-data /var/www/wordpress

sudo chmod -R 755 /var/www/wordpress

Create rewrite rules for friendly url for WordPress plugin custom queries

I have this personal web application that was built from scratch last year and has already been considerably indexed by google. I used some Apache mod rewrite to make the urls friendly. Last week I decided it would be faster/easier to jumpstart the project again if I just focus on my application and just use a framework to handle other intracacies like abstractions, security and etc. I was aiming for CodeIgniter but got a glimpse on BuddyPress for WordPress(not a framework) which has most of the features I want for my app. So long story short I ended up porting my application to be a plugin for WordPress.

Read the rest of this entry »