Topics

CSS

Varnish 5.1 always online

Recently I posted about Varnish with secure AWS S3 bucket as backend and I wanted to have the “always online” enabled, meaning you can take the backend offline while serving from Varnish cache.

Varnish with secure AWS S3 bucket as backend

Serving static contents from S3 is common, but using Varnish in front is a bit tricky. Especially if you want to keep the bucket secure and only serve from Varnish, here is a simple Varnish file to solve this problem.

First secure your bucket via IP policy:

{
  "Version": "2012-10-17",
  "Id": "S3PolicyId1",
  "Statement": [
    {
      "Sid": "IPAllow",
      "Effect": "Allow",
      "Principal": "*",
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::example.bucket/*",
      "Condition": {
        "IpAddress": {
          "aws:SourceIp": [
            "5.6.7.8/32"  //varnish ip
          ]
        }
      }
    },
    {
      "Sid": "Explicit deny to ensure requests are allowed only from specific referer.",
      "Effect": "Deny",
      "Principal": "*",
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::example.bucket/*",
      "Condition": {
        "StringNotLike": {
          "aws:Referer": [
            "https://example.com/*"
          ]
        }
      }
    }
  ]
}

Install Sphinx 2.0.4 on CentOS 6.2

– Make sure to check CentOS, PHP-FPM, Nginx, memcached and MYSQL posts.

– Get fresh RPM from sphinxsearch.com

– Install Sphinx

rpm -Uhv http://sphinxsearch.com/files/sphinx-2.0.4-1.rhel6.x86_64.rpm

– Create sample MySQL database

AnythingSlider for Worpress caption problem

The caption problem with AnythingSlider in WordPress is that it is already implemented in the plugin but not on the FX script or the CSS. All you need to do is adding this style to your post or page

.anythingBase li {
    position: relative;
}

.wp-caption-text{
    color:#fff;
    display: none;
    height: 70px;
    text-align: center; 
    background:#000;
    opacity:0.6;
    position: absolute;
    left: 0;
    top: 391px;
    width: 561px;
}
.activePage .wp-caption-text{
    display: block;
}

jQuery plugin : monnaTip 0.1

This the simplest tooltip jQuery plugin you can find around.

    features:
  • takes advantage of live(), mouseenter and mouseleave methods
  • tracks mouse movement
  • right and bottom viewport border tracking
  • can be applied on any element

DemodownloadGoogle codeGitHub