WEB DESIGNING/DEVELOPMENT

Sarang III yr ,

Dept of CSE

AGENDA

• Use of CMS• Building chrome extension

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.

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

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.

Examples (opensource)

JOOMLA WORDPRESS DRUPAL WIKI

Advantages :-

Availability of a large no. of :- Themes Widgets Modules Extensions/plugins

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

How do I install a CMS?

Download the setup file. Create db using phpmyadmin Change the config.php file Installation is done !

DEMO

Joomla (ssnlakshya) Wiki cms http://ten.wikipedia.org/wiki/Chennai Wordpress (tedxssn)

Developing Chrome Extension

Demo of Chrome Extensions (creating an RSS feed )

MANIFEST FILE

Every chrome extension has a JSON-formatted manifest file .

Deals with important fields like the name and version no. , favicon .

(contd)

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)

Manifest (contd)

"notifications" = desktop notification for the extension

"tabs" Required if the extension uses the chrome.tabs or chrome.windows module.

HTML files

Dynamic feed control Create html/css file as per

requirements

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)

Packaging (contd)

 chrome://extensions Goto developer mode Pack extension Your extension & private key files are

created

(contd screenshot)

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$)