Primul pas - HTML-ul si incarcarea extensiei in Google Chrome

postat acum 8 luni de Stefanescu Mihai in categorie Extensii de Google Chrome

In articolul precendent am discutat despre structura unei extensii si despre manifest-ul acesteia.

Dupa cum am spus si acolo, o extensie de chrome este formata din manifest, html, css si javascript. In acest articol o sa discutam despre partea de HTML si cum putem incarca extensia in browser.

Pentru inceput, eu mi-am definit proiectul si am urmatoarele fisiere in el:

Am pus 3 iconite cu logo-ul invata-programare si am definit manifest.json care are structura din primul articol si popup.html care momentan este gol.

In popup.html va trebui sa avem o pagina standard de html, iata cum arata la mine:

<!DOCTYPE html>
<html>
<head>
	<title>Invata-Programare</title>
</head>
<body>
	<h2>Invata-Programare</h2>
</body>
</html>

Acum, pentru a incarca aceasta extensie in google chrome navigam la URL-ul chrome://extensions unde trebuie sa activam Developers Mode din partea dreapta sus.

Acum ne-au aparut butoanele Load unpacked si Pack extension, daca facem click pe Load unpacked si selectam folder-ul extensiei.

Dupa cum vedeti am incarcat extensia, iar acum daca fac click pe iconita imi este afisat continutul fisierului popup.html

Sunt un tanar programator din Bucuresti ce lucreaza in PHP/Mysql (MySqli/PDO), Laravel, CodeIgniter, MySQL, PostgreSQL, Wordpress, HTML5/CSS3, Sass, Photoshop si multe altele.
Google+ Community Facebook Group