I recomend tryint this tutorial http://truffleframework.com/docs/advanced/truffle-with-metamask
It teaches how to use Metamask web3 instance. It is not hard to use it.
MetaMask injects its own web3 instance, so we'll want to make sure we're checking for that. After the window has loaded perform the following check:
// Is there is an injected web3 instance?
if (typeof web3 !== 'undefined') {
App.web3Provider = web3.currentProvider;
web3 = new Web3(web3.currentProvider);
} else {
// If no injected web3 instance is detected, fallback to Ganache.
App.web3Provider = new web3.providers.HttpProvider('http://127.0.0.1:7545');
web3 = new Web3(App.web3Provider);
}