Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
Joomla! & Bootstrap 3
Building a Joomla! Template
with Bootstrap Version 3

Joomla!Day™ Spain 2013

Twitter: @saurabhshah
...
I’m Saurabh
● 
● 

● 
● 

From Pune, India
Love Travel & Technology

Front-End Developer @ CloudAccess.net
Marketing, Soci...
A Comprehensive, Ready-to-go
Joomla! Hosting Platform.
Point, Click, Go!

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

S...
Over 8,500 Active Paying Clients
Schools

Small & Medium
Businesses

Enterprises

Nonprofits

Governments
Joomla!Day™ Spain...
Network

Joomla!

Backups

Hosting

Compliance

CloudMail

Joomla!Day™ Spain 2013

Training
Domains

3rd Party
Apps
Twitte...
Who has built a custom
Joomla! template before?

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

September 28th, 2013
Today’s Agenda
1. 
2. 
3. 
4. 

Useful Tools
Files & Directories
Bootstrap
Step-by-step coding with a demo site

Joomla!Da...
Useful Tools
• 
• 
• 
• 

Bootstrap V3 - http://getbootstrap.com/
Bootstrap V2.3.2 - http://getbootstrap.com/2.3.2/
Crunch...
Bootstrap V3

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

September 28th, 2013
Step-by-step process of
building a Joomla! Template

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

September 28th, 2013
Step 1
●  Create templatedetails.xml file – specifies information
about the template, including where the system can
find all...
Step 2
•  Create index.php file
•  The basic file that provides the logic and positioning for
the layout of the components a...
Step 3
•  Thumbnail images, component.php file, favicon

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

September 28th, 201...
Step 4
•  Create folder images, css, fonts, LESS and JS

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

September 28th, 20...
Step 5
•  Language folder with description and files .ini, .sys.ini

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

Septemb...
Step 6
•  Zip the file and it is ready to install.

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

September 28th, 2013
You’re ready to go !

Joomla!Day™ Spain 2013

Twitter: @saurabhshah

September 28th, 2013
Other useful sites
•  Tool to convert 2.x > 3.x Bootstrap code:
http://upgrade-bootstrap.bootply.com/
•  Bootstrap Upgrade...
Are you a ninja now?
Joomla!Day™ Spain 2013

Twitter: @saurabhshah

September 28th, 2013
Gracias
ध"यवाद
Thank you
Saurabh Shah
Twitter: @saurabhshah
Email: saurabh@cloudaccess.net
saurabh.ds16@gmail.com

Joomla!...
Prochain SlideShare
Chargement dans…5
×

Joomla! Template with Bootstrap 3 - Joomla!Day Spain 2013

8 255 vues

Publié le

Workshop on Joomla! Template with Bootstrap version 3 and showing off pros and cons with current Joomla! version 3.1 compatibility.

Publié dans : Technologie, Voyages
  • ⇒⇒⇒WRITE-MY-PAPER.net ⇐⇐⇐ I love this site. It always finds me the best tutors in accordance with my needs. I have been using it since last year. The prices are not expensive compared to other sites. I am glad I discored this site:)
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • If you are looking for customer-oriented academic and research paper writing service try ⇒⇒⇒ WRITE-MY-PAPER.net ⇐⇐⇐ liked them A LOTTT Really nice solutions for the last-day papers
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • Hi there! Good job! Do you have time to look my works?
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici

Joomla! Template with Bootstrap 3 - Joomla!Day Spain 2013

  1. 1. Joomla! & Bootstrap 3 Building a Joomla! Template with Bootstrap Version 3 Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  2. 2. I’m Saurabh ●  ●  ●  ●  From Pune, India Love Travel & Technology Front-End Developer @ CloudAccess.net Marketing, Social Media, Sales, Professional Services ●  Joomlaholic Joomla! Events Team Member Joomla! Social Team Member Joomla! User Group Member Joomla! Day India Organizer ●  Mozilla Representative (ReMo) ●  ●  ●  ●  Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  3. 3. A Comprehensive, Ready-to-go Joomla! Hosting Platform. Point, Click, Go! Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  4. 4. Over 8,500 Active Paying Clients Schools Small & Medium Businesses Enterprises Nonprofits Governments Joomla!Day™ Spain 2013 Banks Twitter: @saurabhshah Hospitals September 28th, 2013
  5. 5. Network Joomla! Backups Hosting Compliance CloudMail Joomla!Day™ Spain 2013 Training Domains 3rd Party Apps Twitter: @saurabhshah September 28th, 2013
  6. 6. Who has built a custom Joomla! template before? Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  7. 7. Today’s Agenda 1.  2.  3.  4.  Useful Tools Files & Directories Bootstrap Step-by-step coding with a demo site Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  8. 8. Useful Tools •  •  •  •  Bootstrap V3 - http://getbootstrap.com/ Bootstrap V2.3.2 - http://getbootstrap.com/2.3.2/ Crunch - http://crunchapp.net/ Editor – Coda / Notepad++ / Sublime Text Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  9. 9. Bootstrap V3 Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  10. 10. Step-by-step process of building a Joomla! Template Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  11. 11. Step 1 ●  Create templatedetails.xml file – specifies information about the template, including where the system can find all the resources needed for the template. Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  12. 12. Step 2 •  Create index.php file •  The basic file that provides the logic and positioning for the layout of the components and modules; your fundamental template file. Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  13. 13. Step 3 •  Thumbnail images, component.php file, favicon Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  14. 14. Step 4 •  Create folder images, css, fonts, LESS and JS Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  15. 15. Step 5 •  Language folder with description and files .ini, .sys.ini Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  16. 16. Step 6 •  Zip the file and it is ready to install. Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  17. 17. You’re ready to go ! Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  18. 18. Other useful sites •  Tool to convert 2.x > 3.x Bootstrap code: http://upgrade-bootstrap.bootply.com/ •  Bootstrap Upgrader: http://code.divshot.com/bootstrap3_upgrader/ •  PlaceHolder – For creating Images as a placeholder: http://placehold.it/960x300 Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  19. 19. Are you a ninja now? Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013
  20. 20. Gracias ध"यवाद Thank you Saurabh Shah Twitter: @saurabhshah Email: saurabh@cloudaccess.net saurabh.ds16@gmail.com Joomla!Day™ Spain 2013 Twitter: @saurabhshah September 28th, 2013

×