cms & chrome extension development
DESCRIPTION
This presentation deals with the usage of Content Management Systems and fundamentals for development of extensions for Google Chrome.TRANSCRIPT
![Page 1: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/1.jpg)
WEB DESIGNING/DEVELOPMENT
Sarang III yr ,
Dept of CSE
![Page 2: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/2.jpg)
AGENDA
• Use of CMS• Building chrome extension
![Page 3: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/3.jpg)
Why go in for a CMS ?
Current scenario – we need a website for promoting every product/business.
Building websites for organisations , product review websites using html is time consuming .
Users of a website are not exposed to coding .
Website are often integrated with the latest developments.
![Page 4: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/4.jpg)
CONTENT MANAGEMENT SYSTEM
Collaborative environment for designing a website (like IDE)
Targets large no. of people to contribute and share stored data .
Reduces the time involved in building a website
Version Control
![Page 5: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/5.jpg)
Introduction(contd)
Allows people without technical details to post in the website
For eg : one cannot expect an person posting a book review to know the coding of a website .
Allows easy SEO.
![Page 6: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/6.jpg)
Examples (opensource)
JOOMLA WORDPRESS DRUPAL WIKI
![Page 7: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/7.jpg)
![Page 8: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/8.jpg)
Advantages :-
Availability of a large no. of :- Themes Widgets Modules Extensions/plugins
![Page 9: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/9.jpg)
Theme examples
http://www.proudthemes.com/demo/academica/
http://tedxssn.com http://ssnlakshya.com
http://localhost:81/ssnedc/joomla_root/index.php?tp=1&template=axe_rescheek
![Page 10: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/10.jpg)
How do I install a CMS?
Download the setup file. Create db using phpmyadmin Change the config.php file Installation is done !
![Page 11: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/11.jpg)
DEMO
Joomla (ssnlakshya) Wiki cms http://ten.wikipedia.org/wiki/Chennai Wordpress (tedxssn)
![Page 12: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/12.jpg)
Developing Chrome Extension
Demo of Chrome Extensions (creating an RSS feed )
![Page 13: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/13.jpg)
MANIFEST FILE
Every chrome extension has a JSON-formatted manifest file .
Deals with important fields like the name and version no. , favicon .
(contd)
![Page 14: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/14.jpg)
Manifest (contd)
"bookmarks" = reqd if browser uses bookmarks
"chrome://favicon/" = <img src="chrome://favicon/http://www.google.com/">
location of favicon. "cookies" =Required if the extension
uses the chrome.cookies module. (contd)
![Page 15: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/15.jpg)
Manifest (contd)
"notifications" = desktop notification for the extension
"tabs" Required if the extension uses the chrome.tabs or chrome.windows module.
![Page 16: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/16.jpg)
HTML files
Dynamic feed control Create html/css file as per
requirements
![Page 17: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/17.jpg)
Packaging
Manifest.json Html files Image files (favicon) CSS Files Javascript files(if necessary) Create a zip file of the folder Package it as crx file
(contd)
![Page 18: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/18.jpg)
Packaging (contd)
chrome://extensions Goto developer mode Pack extension Your extension & private key files are
created
(contd screenshot)
![Page 19: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/19.jpg)
![Page 20: CMS & Chrome Extension Development](https://reader036.vdocuments.net/reader036/viewer/2022062313/55928e5b1a28abae708b45c5/html5/thumbnails/20.jpg)
Testing & Publishing
Go to developer mode in Google Chrome “Load unpacked extensions” Publish your extensions to Google Chrome
extension Library . You need to have a google developer account
for publishing (developer fee of 5$)