Web Design Software: How do i convert a Joomla template to basic html/css template?

started by Berry Thomas on May 18, 2010 — RSS Feed

Berry Thomas Berry Thomas
Posts: 1

I have a Joomla template installed on my shopping cart site. But i want the similar template and css styling, as a basic HTML template, so i don't have to use Joomla for editing. Is there an simple way to convert the template to basic HTML/CSS template?

Peter Barber Peter Barber
Posts: 2

A Joomla template is basically already in HTML/CSS format. All you need to get is view the stylesheet and then copy one of the pages of the Joomla pages. Visit this website below they are Joomla Experts you can contact to website’s webmaster.

Celina Robert Celina Robert
Posts: 7

Just copy the coding from joomla and put into dreamweaver and make it to .html thats it.

Sandra Necaise Sandra Necaise
Posts: 11

Well, no just copy and paste, it's not that easy, joomla uses php for certain functions, so you will need it too, and the way it stores the data is in mysql databases, so you will need that too. So, it's not that easy. I'm still researching how can we do it.

Brown Erik Brown Erik
Posts: 8

I have done copy paste but it didnt work for me is there another solution for it?Can anyone have an update on this ?

Ratnamg3 Venkat Ratnamg3 Venkat
Posts: 2

Hello,

We have another solution, firt open the shopping cart in your browser and view source code from it and then paste it in Dreamweaver editor.

In Firefox : View > Page Source.
Copy the source and paste in Dreamweaver.

Note: make sure to change the paths and save in you folder. that's it.

Thanks.

Laps Laps Laps Laps
Posts: 2

You need to save in your browser html files

Website Designerss Website Designerss
Posts: 37

I want to learn joomla, can anyone help me for that?

Rachit Arora Rachit Arora
Posts: 12

Step 1
Prepare your template. The template should be (X)HTML & CSS compliant. There are lot of HTML templates on the Internet, just search them by using uncle Google. Templates in Joomla is filed under a directory named templates. Ensure the HTML file, images and CSS file are inside one single directory created under templates folder. For example, take a look at the Joomla template structure below:

Joomla Template Directory Structure
Joomla will search index.php inside the template directory. So, rename the index.html file to index.php.
Step 2
Replace the HTML code before the body tag of your HTML file with this code.





your_template_name
25/01/2009
Dani Gunawan


GNU/GPL
1.0.0
template description goes here

index.php
templateDetails.xml
template_thumbnail.png
images/arrow.png
images/logo.png
css/template.css


breadcrumb
left
right
top
user1
user2
user3
user4
footer
debug
syndicate


Don’t forget to enlist all your files used in your newly made template inside files tag. If you missed, the files won’t be copied to Joomla template directory during installation process. positions tag is used to declare the position name used in your template.
Step 5
Package it. You may create a thumbnail of your template before packing it. It should have 206px width and 150px height . and finally compress your template to a zip file and your template are ready to go. Don’t forget to test it before sharing it to the Internet in case you feel like it.

Nithra Booly Nithra Booly
Posts: 1

1. Read a license - maybe you are not permitted to use this theme for something else
2. Set up default Joomla installation up and running
3. Install your theme
4. Open Joomla site and copy/paste source code from your browser and download all CSS/JS files. You will get simple HTML+CSS with same design but without any Joomla template stuff.

Vikram Randhawa Vikram Randhawa
Posts: 16

Just copy whole the project and open in the Dreamviewer ..then open the project in the dreamviewer all project is converted into the Html and CSS files..

Stefan King Stefan King
Posts: 1

Nithra Booly said:
1. Read a license - maybe you are not permitted to use this theme for something else
2. Set up default Joomla installation up and running
3. Install your theme
4. Open Joomla site and copy/paste source code from your browser and download all CSS/JS files. You will get simple HTML+CSS with same design but without any Joomla template stuff.


so if i do that.. will i get the exact design?

take a look at this template - http://livedemo00.template-help.com/joomla_33235/

if i copy the copy/paste source code with all CSS/JS files,
will i get the same design like that? with all the similar header, menu effects and body features?

sorry i am a newbie and i need your advice.

thank you

Jadian Technologies Jadian Technologies
Posts: 5

I guess it depends on how you need to work with that page. Do you want it to be a completely static page, or does it still need to have PHP activity happening on it (where products are displayed etc.)?

If just static, you could View Source on the rendered page, copy it all, paste it into a new file and just delete all the Joomla-specific code. You'd still have to check that the layout remains intact, and you may have to alter the CSS at bit.

Peter Freeman Peter Freeman
Posts: 4

i have no knowledge about that but i want say open that page into the browser and open it into view source and copy all the html and save that file into your html file , hope fully it will help you

James John James John
Posts: 9

It takes much time..better to design new one.

You must login to reply