Update your hosts for wordpress on digitalocrean

Any one facing problem with digital ocean sending email?

the solution is easy, login to your ssh, and open up hosts file
[cc lang=”php”]nano /etc/hosts

change your host to something like this 127.0.0.1 localhost.localdomain localhost yourhostname and restart your services. and boom, you see your email send instantly.

remove trail for css transition

While working on some css transition recently faced a small problem, the item that was animated create a trail (some white lines or cut images) where animated, that created a very experience for users, there isn’t real fix yet, however the temporary solution is to use hardware accelerated css property to improve the graphic rendering

Add this property to where you transition the css, hope this help you.

-webkit-transform: translate3d(0,0,0);

Remove wordpress asking for FTP

There are many time wordpress has this annoying thing asking for FTP username and password when you try to install the plugins or themes..

here is a simple way give direct access to the file systems.

Paste the following line in your wp-config.php 

define( ‘FS_METHOD’, ‘direct’);

Gulp Mamp development

I am doing quite a lot of wordpress stuff and since using Gulp, i found happiness in my development environment, here are the most common modules that I used.

  • tiny-lr
  • gulp-coffee
  • gulp-sass
  • gulp-uglify
  • gulp-jshint
  • gulp-util
  • gulp-livereload
  • gulp-imagemin

So what I want to do with my wordpress development is that every time I made some changes to SASS / CoffeeScript or even when I saved the image it will reload the page automatically.

Continue reading “Gulp Mamp development”

Gulp js streaming build system

well if you are familiar with Grunt, this is another alternative task build tool Gulp, which is easier and flexible than Grunt

npm install -g gulp

If you are not familiar with Grunt or Gulp which both are tools that help you improve your workflow such as automated your script compiling, lint, minify it and output into another folder, every time you made an change. Its awesome tool that was built.

It just happened that I was reading some news and got into this Gulp thing and start exploring it, and found that its awesome and much easier to use than Grunt.

both are built in node, so you need to install the node module when you start an project,

at the root of your project folder, enter this in your terminal

npm install gulp —save

this will install, and now you can start creating a node script file, gulpfile.js

gulp use each plugin for each different task and thats a great concept, there are only 5 functions that you need know,

gulp.task // create a new task or action 

gulp.src // the source of this file start with same folder as gulpfile.js

gulp.run // run the task / action

gulp.watch // watch this folder or file if made some changes

gulp.dest // the destination of folder to output

Below is an example of how Gulp file work using gulp-sass plugin which will compile scss to css, if you are interested to read more, I suggest that you go directly to the gulp github repo. By the way when I install gulp using older version of Node.js I faced some problem watching the file, so you might want to update your node.js.

var sass = require(‘gulp-sass’);
var gulp = require(‘gulp’);
gulp.task(‘dosass’,function(){
gulp.src(‘sass/*.scss’).pipe(sass()).pipe(gulp.dest(‘./sass/css’));
})
gulp.task(‘default’, function() {
  gulp.run(‘dosass’);
  gulp.watch(‘sass/*.scss’, function(event){
    gulp.run(‘dosass’);
  })
})

Themeing in Ghost blogging platform

Once you installed Ghost in my previous post guide, open up the ghost folder location, you will see a folder name “themes” in ghost/content/themes there is where contains all themes in your ghost app which is similar to wordpress which is wordpress/wp-content/themes/themeName.

Go ahead copy the default theme casper and paste with any name you like,
either keep or delete the 2 text files which is the LICENSE.txt and README.md (by the way if you need visual Markdown editor check out my previous post on Mou)
As you can see there are 3 main files and a assets folder here for now,
  • assets(Folder)
  • default.hbs
  • index.hbs
  • post.hbs