Can't install my custom chrome extension crx_magic_number_invalid - google-chrome

Question

I made a simple chrome extension:
manifest.json:
{
"name": "Layout VS Design",
"version": "1",
"description": "Enter the url of a image with your design at 100%",
"background_page": "index.html",
"browser_action": {
"name": "Manipulate DOM",
"icons": ["icon.png"],
"default_icon": "icon.png"
},
"content_scripts": [ {
"js": [ "jquery.min.js", "js.js" ],
"matches": [ "http://*/*", "https://*/*"]
}]
}
The thing is that chrome won't let me install it:
The thing is I have no idea where to set this number, Any idea what can I try?

Answer 1

The first thing I see is that your background_page isn't formatted properly. It should be
{ ...
"background": {
"page": "index.html"
},
...
}
If you manifest.json file isn't formatted correctly, Chrome will reject the extension.
You can read more about the manifest formatting in the Manifest File Format documentation from Google.
Update
Another SO post detailed how Chrome looks for a "magic number" at the top of a .crx file. But, if you're hosting locally, you can install extensions in a simpler manner.
Save your manifest.json and background.html to a directory (the name doesn't matter)
Go to chrome:extensions
Make sure "Developer Mode" is checked at the top
Click "Load unpacked extension..."
Select the directory with your background and manifest files to install on Chrome.

Answer 2

go to extensions page
check developer options
click on pack extension
set root directory (folder in which your images and manifest file
exist)
pack extension
now disable developer options
go to root directory (do not open root directory saying this only so
that you could easily find file otherwise you can open it)
you will see a .crx file just open it with chrome (e.g. drag and drop this file onto the chrome://extensions/ page)
click on continue (will come at the bottom of chrome window)
Your Chrome browser is modified like you wanted