Octopress Plugin to Upload Files to S3 and Refer With a Tag in Html Views

- - posted in Technical | Tagged as OctopressPlugin,S3,AWS | Comments

Hello again, This time I wrote an octopress plugin which will upload the files from your local directory to your S3 account and provide you a tag which you can refer in your html views.

The uploading takes place at the time of generating your site with the help of security credentials from your ENV variables settings.

You can get the source at github here: aws_s3_imagetag

This is how you can setup:


An octopress plugin to upload files to AWS S3 account and Provide a tag to reference the files in your views.

Place your files under the directory defined as your env variable S3_DIR (see enviroment variables below). When you generate your site the files will be uploaded to your S3 AWS account. and then you can use the tag 'AWS_S3_Image' which allows you reference images we just hosted on Amazon S3 within your posts. A bit of a contrived example, but it demonstrates the process of creating custom Liquid tags.

To use it, just host some place some images in $S3_DIR (they will be made publicly accessible) and use the tag with the syntax

If you don't specify a bucket name and folder name in the view, it will look for an environment variable.

Environment Variable

(I did not want to expose the credential by accendently checking in the code, so using ENV variables )

export AWS_BUCKET=your bucket name     

\# if your images are under a folder inside the bucket  
export AWS_BUCKET_FOLDER=folder name               

export AWS_ACCESS_KEY_ID=Your S3 Access Key     

export AWS_SECRET_ACCESS_KEY=Your S3 Secret key     

\# Directory from where the files will be uploaded   
export S3_DIR=source/images/TO_S3                   

\# set false if you dont want to upload and just use the tag to refer s3 images/files    
export AWS_UPLOAD=true                            


# If you want to avoid referencing the annoyingly long aws s3 url, you can set your custom domain url and set it as an env variable

export AWS_CUSTOM_DOMAIN=pics.mydomain.com   

In this case the final html will have image tag as

And you can avoid the URLs in form of

You will have to set up CNAME entry for your domain name , I will cover that in another post.


Gravatar of Ashwani Kumar

Recent posts


Your Feedback encourages me

Learning and Developments

One Month Rails

, 2FA, AWS AWS, Active Authenticator Directory, Facebook Flash, Forwarding, GOD,Chat,Coffee Github,Feedback,Repo Google Google,Search HAProxy, IOT, IP-block JQuery LetsEncrypt Load MQ MQTT, Messaging Octopress Octopress, OpenVpn OpenVpn, PI, Plugin Plugin, Port Raspberry, S3, SSH, Shell,Commands Soapui, Tag Tag, Tree, Tunneling XML XML, XServer, Xming ajax, angular, animated architecture architecture, azure balancing cloud, commenting, connectivity datapower datatables diagrams diaspora dropdown geocoding grep, hashicorp, ipaddress, ipv6, java, java,python mysql nokogiri, octopress-migration octopress-plugin oidc openapi, openssl powershell proxy rails, repo reviews ruby, script scripts, security, sharepoint shell spiffe spire spring springboot, ssh, swagger, telnet, vault vi, vieditor vim, visualblock, webattacks windows,cleanup windowsxp workload identity