Joomla Tutorials: How to Edit Your CSS and HTML Files on Your Joomla Web Site
The HTML tells your template where to pull modules in, and includes the footer text on your template (depending on your template). If you want to change the footer text on your template, this is the place to do it. Also, some templates have some alternate options in the HTML file such as making your template right justified, centered, or left justified. Some also allow you to change whole color schemes from the HTML file. Generally, this is found in templates you buy and the template will come with instructions on how to switch between the different options in the HTML file. It's usually as easy as typing the name of the color or entering a "1" or "0".The HTMLl file basically tells your Joomla web site template what to pull into view from the files on your server and where to display them.
How to edit your CSS file in your Joomla web site:
1) Log in to www.yoursitename.com/administrator
2) In the row of menus across the top, go to "site"
3) Choose template manager in the drop down menus
4) Choose Site templates in the menu that slides out to the side
5) When the page loads, put a check mark in the box next to your default template.
6) Click "Edit CSS" in the top right hand corner.
7) Make the changes to your CSS file that you wish to
8) Click the disk icon to save.
How to edit your HTML file in your Joomla web site :
1) Log in to www.yoursitename.com/administrator
2) In the row of menus across the top, go to "site"
3) Choose template manager in the drop down menus
4) Choose Site templates in the menu that slides out to the side
5) When the page loads, put a check mark in the box next to your default template.
6) Click "Edit HTML" in the top right hand corner.
7) Make the changes to your html file that you wish to
8) Click the disk icon to save.
Published by Jessica Lynn
A gypsie of the heart - Comedian, Writer, singer, film maker, mother, painter, photographer, entrepeneur - I have been all of these and more. I am. View profile
- Photoshop Tutorial: How to Create Longer NailsLearn how to make nails longer in this simple and easy tutorial in Adobe Photoshop.
- Photoshop Tutorial: How to Cut and Put Images on a Transparent BackgroundIn this Photoshop tutorial you will learn how to cut images and place them on a transparent background. This is a great tutorial for beginners.
Photoshop Tutorial: Learn How to Create Chat Bubble Icons or Web GraphicsIn this Photoshop tutorial, you'll learn to create chat bubble icons that can be used on your website or Myspace.
Photoshop Tutorial: Create a Professional Charcoal Drawing Out of Any PhotoThis Photoshop tutorial isn't like any other "add a filter" tutorial. In this tutorial you will learn how to turn any photo into a professional looking charcoal drawing, antique...- Photoshop Tutorial: How to Create Glamor PhotosGive your photos a glamorous twist with this Photoshop Tutorial.
- Styling CSS and HTML Unordered Lists
- Beginner's Photoshop Tutorial: Learning to Create Your Own Brushes
- Photoshop Tutorial: How to Change Hair Color in a Photo
- Photoshop Tutorial: Color Correcting and Tone Enhancing Photographs
- Photoshop Tutorial: Adding Digital Rain to Your Images
- Photoshop Tutorial: How to Digitally Create Beautiful White Teeth
- Photoshop Tutorial: Learning How to Use and Load Brushes in Photoshop
8 Comments
Post a CommentHello, I am creating a website in Joomla! using Artisteer. I need to add another header above original one (so it looks like, logo and nav links and below the blog header). I have opened up the css folders on the back door of Joomla! and see template.css, template.ie7.css, template.ie6.css, and editor.css . I decide to click on template.css and edit by copying the header code in the correct spot (or so I think- where my other header code is). When I Save>Apply and preview the website still looks the same as it did before even with the new code. Do I have to go into each template folder? Where should I put the coding? Any other information will help too.
Thank you for your time before hand!
I have a problem while doing so.. once I edit and save my CSS & HTML templates from the administration console, the file contents will get erased and the file size becomes zero. :( any idea how and why this happens?
Hi!
My template already have css style predefined and i construct another css file to implement some style to one article in special. The point is: the css default apply over the my new style, i cant made it works wit my new colours of font. In this case how to proceed?
1. Go to the following folder: C:xampphtdocs\templates\images
2. You will find the default Joomla! logo. You may open this file with your favourite image-editing application e.g. Adobe Photoshop.
3. You may place your logo on top of this one (for sizing) as well as ignore any background solid colour so that you can see only the checkered background of the canvas. Save the file as PNG.
4. Replace the logo.png file in the path given in (1) above.
5. Refresh your browser window.
NB/ This assumes that you are running on localhost. However, on the production site, use the path relative to the one above. It will probably be as follows: /public_html/templates//images/
Regards,
Paul Korir
i'm using joomla for developed a website for my company..but i have a problem how to edit color for the website and to changes and add some pictures...plz help me...
Lets say we want to change the layout, the place of columns or want to overlap different elements, I can do that by writing div tags and adjust them in css. Is it possible with joomla to make ethese without buying and templates?
css web template page (example) -- http://www.css-lessons.ucoz.com/css-template-page.htm
thanks for the help but i was wondering if u also know how to change the logo of a template